日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當(dāng)前位置: 首頁 > 前端技术 > javascript >内容正文

javascript

$JavaScript(3)

發(fā)布時(shí)間:2023/12/20 javascript 24 豆豆
生活随笔 收集整理的這篇文章主要介紹了 $JavaScript(3) 小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

41、漸進(jìn)增強(qiáng)和優(yōu)雅降級

  • 漸進(jìn)增強(qiáng) :針對低版本瀏覽器進(jìn)行構(gòu)建頁面,保證最基本的功能,然后再針對高級瀏覽器進(jìn)行效果、交互等改進(jìn)和追加功能達(dá)到更好的用戶體驗(yàn)。

  • 優(yōu)雅降級 :一開始就構(gòu)建完整的功能,然后再針對低版本瀏覽器進(jìn)行兼容

42、deferasync

  • defer并行加載js文件,會按照頁面上script標(biāo)簽的順序執(zhí)行

  • async并行加載js文件,下載完成立即執(zhí)行,不會按照頁面上script標(biāo)簽的順序執(zhí)行

43、說說嚴(yán)格模式的限制

  • 變量必須聲明后再使用

  • 函數(shù)的參數(shù)不能有同名屬性,否則報(bào)錯(cuò)

  • 不能使用with語句

  • 禁止this指向全局對象

44、attributeproperty的區(qū)別是什么?

  • attributedom元素在文檔中作為html標(biāo)簽擁有的屬性;

  • property就是dom元素在js中作為對象擁有的屬性。

  • 對于html的標(biāo)準(zhǔn)屬性來說,attributeproperty是同步的,是會自動(dòng)更新的

  • 但是對于自定義的屬性來說,他們是不同步的

45、談?wù)勀銓?span style="color:#ff0000;">ES6的理解

  • 新增模板字符串(為JavaScript提供了簡單的字符串插值功能)

  • 箭頭函數(shù)

  • for-of(用來遍歷數(shù)據(jù)—例如數(shù)組中的值。)

  • arguments對象可被不定參數(shù)和默認(rèn)參數(shù)完美代替。

  • ES6promise對象納入規(guī)范,提供了原生的Promise對象。

  • 增加了letconst命令,用來聲明變量。

  • 增加了塊級作用域。

  • let命令實(shí)際上就增加了塊級作用域。

  • 還有就是引入module模塊的概念

46、ECMAScript6 怎么寫class么,為什么會出現(xiàn)class這種東西?

  • 這個(gè)語法糖可以讓有OOP基礎(chǔ)的人更快上手js,至少是一個(gè)官方的實(shí)現(xiàn)了

  • 但對熟悉js的人來說,這個(gè)東西沒啥大影響;一個(gè)Object.creat()搞定繼承,比class簡潔清晰的多

47、什么是面向?qū)ο缶幊碳懊嫦蜻^程編程,它們的異同和優(yōu)缺點(diǎn)

  • 面向過程就是分析出解決問題所需要的步驟,然后用函數(shù)把這些步驟一步一步實(shí)現(xiàn),使用的時(shí)候一個(gè)一個(gè)依次調(diào)用就可以了

  • 面向?qū)ο笫前褬?gòu)成問題事務(wù)分解成各個(gè)對象,建立對象的目的不是為了完成一個(gè)步驟,而是為了描敘某個(gè)事物在整個(gè)解決問題的步驟中的行為

  • 面向?qū)ο笫且怨δ軄韯澐謫栴},而不是步驟

48、面向?qū)ο缶幊趟枷?/h3>
  • 基本思想是使用對象,類,繼承,封裝等基本概念來進(jìn)行程序設(shè)計(jì)

  • 優(yōu)點(diǎn)

    • 易維護(hù)易擴(kuò)展

      • 采用面向?qū)ο笏枷朐O(shè)計(jì)的結(jié)構(gòu),可讀性高,由于繼承的存在,即使改變需求,那么維護(hù)也只是在局部模塊,所以維護(hù)起來是非常方便和較低成本的
    • 開發(fā)工作的重用性、繼承性高,降低重復(fù)工作量。

    • 縮短了開發(fā)周期

49、對web標(biāo)準(zhǔn)、可用性、可訪問性的理解

  • 可用性(Usability):產(chǎn)品是否容易上手,用戶能否完成任務(wù),效率如何,以及這過程中用戶的主觀感受可好,是從用戶的角度來看產(chǎn)品的質(zhì)量。可用性好意味著產(chǎn)品質(zhì)量高,是企業(yè)的核心競爭力

  • 可訪問性(Accessibility):Web內(nèi)容對于殘障用戶的可閱讀和可理解性

  • 可維護(hù)性(Maintainability):一般包含兩個(gè)層次,一是當(dāng)系統(tǒng)出現(xiàn)問題時(shí),快速定位并解決問題的成本,成本低則可維護(hù)性好。二是代碼是否容易被人理解,是否容易修改和增強(qiáng)功能。

50、如何通過JS判斷一個(gè)數(shù)組?

  • instanceof方法

    • instanceof 運(yùn)算符是用來測試一個(gè)對象是否在其原型鏈原型構(gòu)造函數(shù)的屬性
var arr = []; arr instanceof Array; // true
  • constructor方法

    • constructor屬性返回對創(chuàng)建此對象的數(shù)組函數(shù)的引用,就是返回對象相對應(yīng)的構(gòu)造函數(shù)
    • var arr = [];
      arr.constructor
      == Array; //true
  • 最簡單的方法

    • 這種寫法,是 jQuery 正在使用的
    • Object.prototype.toString.call(value) == '[object Array]' // 利用這個(gè)方法,可以寫一個(gè)返回?cái)?shù)據(jù)類型的方法 var isType = function (obj) {return Object.prototype.toString.call(obj).slice(8,-1); }
  • ES5新增方法isArray()

?

var a = new Array(123); var b = new Date(); console.log(Array.isArray(a)); //true console.log(Array.isArray(b)); //false

?

51、談一談letvar的區(qū)別?

  • let命令不存在變量提升,如果在let前使用,會導(dǎo)致報(bào)錯(cuò)

  • 如果塊區(qū)中存在letconst命令,就會形成封閉作用域

  • 不允許重復(fù)聲明,因此,不能在函數(shù)內(nèi)部重新聲明參數(shù)

52、mapforEach的區(qū)別?

  • forEach方法,是最基本的方法,就是遍歷與循環(huán),默認(rèn)有3個(gè)傳參:分別是遍歷的數(shù)組內(nèi)容item、數(shù)組索引index、和當(dāng)前遍歷數(shù)組Array

  • map方法,基本用法與forEach一致,但是不同的,它會返回一個(gè)新的數(shù)組,所以在callback需要有return值,如果沒有,會返回undefined

53、談一談你理解的函數(shù)式編程?

  • 簡單說,"函數(shù)式編程"是一種"編程范式"(programming paradigm),也就是如何編寫程序的方法論

  • 它具有以下特性:閉包和高階函數(shù)、惰性計(jì)算、遞歸、函數(shù)是"第一等公民"、只用"表達(dá)式"

54、談一談箭頭函數(shù)與普通函數(shù)的區(qū)別?

  • 函數(shù)體內(nèi)的this對象,就是定義時(shí)所在的對象,而不是使用時(shí)所在的對象

  • 不可以當(dāng)作構(gòu)造函數(shù),也就是說,不可以使用new命令,否則會拋出一個(gè)錯(cuò)誤

  • 不可以使用arguments對象,該對象在函數(shù)體內(nèi)不存在。如果要用,可以用Rest參數(shù)代替

  • 不可以使用yield命令,因此箭頭函數(shù)不能用作Generator函數(shù)

55、談一談函數(shù)中this的指向吧?

  • this的指向在函數(shù)定義的時(shí)候是確定不了的,只有函數(shù)執(zhí)行的時(shí)候才能確定this到底指向誰,實(shí)際上this的最終指向的是那個(gè)調(diào)用它的對象

  • javascript語言精髓》中大概概括了4種調(diào)用方式:

  • 方法調(diào)用模式

  • 函數(shù)調(diào)用模式

  • 構(gòu)造器調(diào)用模式

graph LR A-->B
  • apply/call調(diào)用模式

56、異步編程的實(shí)現(xiàn)方式?

  • 回調(diào)函數(shù)

    • 優(yōu)點(diǎn):簡單、容易理解
    • 缺點(diǎn):不利于維護(hù),代碼耦合高
  • 事件監(jiān)聽(采用時(shí)間驅(qū)動(dòng)模式,取決于某個(gè)事件是否發(fā)生):

    • 優(yōu)點(diǎn):容易理解,可以綁定多個(gè)事件,每個(gè)事件可以指定多個(gè)回調(diào)函數(shù)
    • 缺點(diǎn):事件驅(qū)動(dòng)型,流程不夠清晰
  • 發(fā)布/訂閱(觀察者模式)

    • 類似于事件監(jiān)聽,但是可以通過‘消息中心’,了解現(xiàn)在有多少發(fā)布者,多少訂閱者
  • Promise對象

    • 優(yōu)點(diǎn):可以利用then方法,進(jìn)行鏈?zhǔn)綄懛?#xff1b;可以書寫錯(cuò)誤時(shí)的回調(diào)函數(shù);
    • 缺點(diǎn):編寫和理解,相對比較難
  • Generator函數(shù)

    • 優(yōu)點(diǎn):函數(shù)體內(nèi)外的數(shù)據(jù)交換、錯(cuò)誤處理機(jī)制
    • 缺點(diǎn):流程管理不方便
  • async函數(shù)

    • 優(yōu)點(diǎn):內(nèi)置執(zhí)行器、更好的語義、更廣的適用性、返回的是Promise、結(jié)構(gòu)清晰。
    • 缺點(diǎn):錯(cuò)誤處理機(jī)制

57、對原生Javascript了解程度

  • 數(shù)據(jù)類型、運(yùn)算、對象、Function、繼承、閉包、作用域、原型鏈、事件、RegExpJSONAjaxDOMBOM、內(nèi)存泄漏、跨域、異步裝載、模板引擎、前端MVC、路由、模塊化、CanvasECMAScript

58、Js動(dòng)畫與CSS動(dòng)畫區(qū)別及相應(yīng)實(shí)現(xiàn)

  • CSS3的動(dòng)畫的優(yōu)點(diǎn)

    • 在性能上會稍微好一些,瀏覽器會對CSS3的動(dòng)畫做一些優(yōu)化
    • 代碼相對簡單
  • 缺點(diǎn)JavaScript的動(dòng)畫正好彌補(bǔ)了這兩個(gè)缺點(diǎn),控制能力很強(qiáng),可以單幀的控制、變換,同時(shí)寫得好完全可以兼容IE6,并且功能強(qiáng)大。對于一些復(fù)雜控制的動(dòng)畫,使用javascript會比較靠譜。而在實(shí)現(xiàn)一些小的交互動(dòng)效的時(shí)候,就多考慮考慮CSS

    • 在動(dòng)畫控制上不夠靈活
    • 兼容性不好

59、JS 數(shù)組和對象的遍歷方式,以及幾種方式的比較

  • for in循環(huán)

  • for循環(huán)

  • forEach

    • 這里的 forEach回調(diào)中兩個(gè)參數(shù)分別為 value,index
    • forEach 無法遍歷對象
    • IE不支持該方法;Firefox chrome 支持
    • forEach 無法使用 breakcontinue 跳出循環(huán),且使用 return 是跳過本次循環(huán)
  • 這兩種方法應(yīng)該非常常見且使用很頻繁。但實(shí)際上,這兩種方法都存在性能問題

  • 在方式一中,for-in需要分析出array的每個(gè)屬性,這個(gè)操作性能開銷很大。用在 key 已知的數(shù)組上是非常不劃算的。所以盡量不要用for-in,除非你不清楚要處理哪些屬性,例如 JSON對象這樣的情況

  • 在方式2中,循環(huán)每進(jìn)行一次,就要檢查一下數(shù)組長度。讀取屬性(數(shù)組長度)要比讀局部變量慢,尤其是當(dāng) array 里存放的都是 DOM 元素,因?yàn)槊看巫x取都會掃描一遍頁面上的選擇器相關(guān)元素,速度會大大降低

60、gulp是什么?

  • gulp是前端開發(fā)過程中一種基于流的代碼構(gòu)建工具,是自動(dòng)化項(xiàng)目的構(gòu)建利器;它不僅能對網(wǎng)站資源進(jìn)行優(yōu)化,而且在開發(fā)過程中很多重復(fù)的任務(wù)能夠使用正確的工具自動(dòng)完成

  • Gulp的核心概念:流

  • 流,簡單來說就是建立在面向?qū)ο蠡A(chǔ)上的一種抽象的處理數(shù)據(jù)的工具。在流中,定義了一些處理數(shù)據(jù)的基本操作,如讀取數(shù)據(jù),寫入數(shù)據(jù)等,程序員是對流進(jìn)行所有操作的,而不用關(guān)心流的另一頭數(shù)據(jù)的真正流向

  • gulp正是通過流和代碼優(yōu)于配置的策略來盡量簡化任務(wù)編寫的工作

  • Gulp的特點(diǎn):

    • 易于使用:通過代碼優(yōu)于配置的策略,gulp 讓簡單的任務(wù)簡單,復(fù)雜的任務(wù)可管理

    • 構(gòu)建快速 利用 Node.js 流的威力,你可以快速構(gòu)建項(xiàng)目并減少頻繁的 IO 操作

    • 易于學(xué)習(xí) 通過最少的 API,掌握 gulp 毫不費(fèi)力,構(gòu)建工作盡在掌握:如同一系列流管道

61、說一下Vue的雙向綁定數(shù)據(jù)的原理

  • vue.js?則是采用數(shù)據(jù)劫持結(jié)合發(fā)布者-訂閱者模式的方式,通過Object.defineProperty()來劫持各個(gè)屬性的settergetter,在數(shù)據(jù)變動(dòng)時(shí)發(fā)布消息給訂閱者,觸發(fā)相應(yīng)的監(jiān)聽回調(diào)





轉(zhuǎn)載于:https://www.cnblogs.com/Strugglinggirl/p/11058128.html

總結(jié)

以上是生活随笔為你收集整理的$JavaScript(3)的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò),歡迎將生活随笔推薦給好友。