摘要:的作用是,創建一個新函數,稱為綁定函數。而這句話的效果相當于下面的代碼對方法的理解在看別人代碼時,發現有這么個寫法,這到底是什么意思呢方法可從已有的數組中返回選定的元素。該方法并不會修改數組,而是返回一個子數組。
1.document.querySelectorAll賦給其它變量時, 為什么要.bind(document)?
阮一峰的博客提到$的替代方法:
var $ = document.querySelectorAll.bind(document);
回答(1):我的理解是this的指向問題。querySelectorAll是document下的一個方法,附值給select后,select已經是window下的一個屬性,此時,this已經不再是document,而window下沒有querySelectorAll方法,所以會報錯;var select = document.querySelectorAll.bind(document),能保證調用select()時this永遠指向document。
回答(2):這個問題其實和querySelectorAll沒什么關系。document是類的一個實例,而querySelectorAll是原型鏈上的方法。類比到普通的類和原型方法就很好理解了吧。
通過實例來運行原型鏈上的方法時,解釋器會自動將this指向那個實例,但是直接這樣var select = document.querySelectorAll;,你的變量僅僅是指向了原型鏈上的那個函數,而沒有綁定this指針,所以你才需要在外面手動綁定一下指針。
回答(3):因為document.querySelectorAll是通過document這個對象去調用querySelectorAll的時候,函數的環境變量里this會指向document,假設querySelectorAll含有this的操作的話,那么this就會指代document。
而當你執行var select = document.querySelectorAll; 的時候,select所得到的是querySelector這個引用,但是此時如果直接通過select去調用的話,也就是select("span"); ,由于select(querySelectorAll)直接調用的話,this會自動指向window,所以就會出錯。
bind的作用是,創建一個新函數,稱為綁定函數。當調用這個綁定函數時,綁定函數會以創建它時傳入 bind()方法的第一個參數作為 this,傳入 bind() 方法的第二個以及以后的參數。
而這句話var $ = document.querySelectorAll.bind(document);的效果相當于下面的代碼
var $ = function(document) { return function() { return document.querySelectorAll.call(document, arguments); } }2.對Array.prototype.slice.call()方法的理解
在看別人代碼時,發現有這么個寫法:[].slice.call(arguments, 0),這到底是什么意思呢?
(1)slice() 方法可從已有的數組中返回選定的元素。
start:必需。規定從何處開始選取。如果是負數,那么它規定從數組尾部開始算起的位置。也就是說,-1 指最后一個元素,-2 指倒數第二個元素,以此類推。
end:可選。規定從何處結束選取。該參數是數組片斷結束處的數組下標。如果沒有指定該參數,那么切分的數組包含從 start 到數組結束的所有元素。如果這個參數是負數,那么它規定的是從數組尾部開始算起的元素。
返回一個新的數組,包含從 start 到 end (不包括該元素)的 arrayObject 中的元素。該方法并不會修改數組,而是返回一個子數組。
(2)call()和apply()方法都是在特定的作用域中調用函數,實際上等于設置函數體內this對象的值。apply和call方法的第一個參數都是特定的作用域第二個參數不同,apply第二個參數可以是Array的實例,也可以是arguments對象。call方法需要逐個列出需要傳遞的參數。
(3)arguments對象指數與數組類似(它并不是Array的實例),但是可以使用方括號語法訪問每一個元素,使用length來確定傳遞進來多少個參數。
(4)Array.prototype.slice.call()可以理解為:改變數組的slice方法的作用域,在特定作用域中去調用slice方法,call()方法的第二個參數表示傳遞給slice的參數即截取數組的起始位置。
原理:
Array.prototype.slice.call(arguments)能將具有length屬性的對象(key值為數字)轉成數組。[]是Array的示例,所以可以直接使用[].slice()方法。
var obj = {0:"hello",1:"world",length:2}; console.log(Array.prototype.slice.call(obj,0));//["hello", "world"]
沒有length屬性的對象
var obj = {0:"hello",1:"world"};//沒有length屬性 console.log(Array.prototype.slice.call(obj,0));//[]
可以借用Array.prototype.slice方法的對象要滿足一下兩個條件:
對象本身要可以存取屬性
對象的length屬性可讀寫
3.在 JavaScript 中, true && expression 總是會評估為 expression ,而 false && expression 總是執行為 false 。console.log(true && "expression") console.log(false && "expression") 輸出: expression false
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/95464.html
摘要:獲取的對象范圍方法獲取的是最終應用在元素上的所有屬性對象即使沒有代碼,也會把默認的祖宗八代都顯示出來而只能獲取元素屬性中的樣式。因此對于一個光禿禿的元素,方法返回對象中屬性值如果有就是據我測試不同環境結果可能有差異而就是。 花了很長時間整理的前端面試資源,喜歡請大家不要吝嗇star~ 別只收藏,點個贊,點個star再走哈~ 持續更新中……,可以關注下github 項目地址 https:...
摘要:收集的一些前端面試題從面試題發現不足,進而查漏補缺,比通過面試更難得及各大互聯網公司前端筆試面試題篇及各大互聯網公司前端筆試面試題篇面試題個和個經典面試題前端開發面試題如何面試前端工程師很重要個變態題解析如何通過餓了么面試輕 收集的一些前端面試題 從面試題發現不足,進而查漏補缺,比通過面試更難得 1 BAT及各大互聯網公司2014前端筆試面試題--Html,Css篇 2 BAT...
摘要:收集的一些前端面試題從面試題發現不足,進而查漏補缺,比通過面試更難得及各大互聯網公司前端筆試面試題篇及各大互聯網公司前端筆試面試題篇面試題個和個經典面試題前端開發面試題如何面試前端工程師很重要個變態題解析如何通過餓了么面試輕 收集的一些前端面試題 從面試題發現不足,進而查漏補缺,比通過面試更難得 1 BAT及各大互聯網公司2014前端筆試面試題--Html,Css篇 2 BAT...
摘要:面試的心得體會簡歷制作我做了兩份簡歷,用兩個手機賬號,兩個簡歷名字,分別在各個招聘網站投了雙份簡歷,一個是數據分析的簡歷一個是全棧開發的簡歷,我真正接觸快年,不管是學習還是工作學到的東西,這兩年大概掌握了前端爬蟲數據分析機器學習技術, showImg(https://upload-images.jianshu.io/upload_images/13090773-b96aac7e974c...
摘要:背景個人背景就讀于東北某普通二本院校計算機軟件工程專業,現大四,北京實習前端方向,自學,技術棧時間背景大概是在月日準備好簡歷開始投遞秋招差不多已經結束招聘崗位不多,投遞對象為大一些的互聯網公司事件背景第一個入職的是好未來的前端實習崗,待遇工 背景 個人背景 就讀于東北某普通二本院校計算機軟件工程專業,現大四,北京實習 前端方向,自學,vue技術棧 時間背景 大概是在11月9日準備...
閱讀 2034·2021-11-11 16:54
閱讀 2111·2019-08-30 15:55
閱讀 3611·2019-08-30 15:54
閱讀 391·2019-08-30 15:44
閱讀 2228·2019-08-30 10:58
閱讀 424·2019-08-26 10:30
閱讀 3048·2019-08-23 14:46
閱讀 3191·2019-08-23 13:46