摘要:另一方面,在函數(shù)外部自然無法讀取函數(shù)內(nèi)的局部變量。這段代碼中另一個(gè)值得注意的地方,就是這一行,首先在前面沒有使用關(guān)鍵字,因此是一個(gè)全局變量,而不是局部變量。解決方法是,在退出函數(shù)之前,將不使用的局部變量全部刪除。
一、JavaScript 數(shù)組方法對(duì)比 I. 新增:影響原數(shù)組小結(jié)放在前,金三銀四找工作高峰期,很榮幸的在這個(gè)時(shí)間段找到一家合適自己的公司,也希望還沒找到工作的朋友盡快找到合適自己的公司。下面分享一些這幾天看的一些知識(shí)點(diǎn)。
使用 array.push() 和 array.ushift() 新增元素會(huì)影響原來的數(shù)組。
兩種方式新增元素不會(huì)影響原數(shù)組,第一種是 array.concat() 。
第二種方法是使用 JavaScript 的展開(spread)操作符,展開操作符是三個(gè)點(diǎn)(…)
展開操作符會(huì)復(fù)制原來的數(shù)組,從原數(shù)組取出所有元素,然后存入新的環(huán)境。
III. 移除:影響原數(shù)組使用 array.pop() 和 array.shift() 移除數(shù)組元素時(shí),會(huì)影響原來的數(shù)組。
array.pop() 和 array.shift() 返回被移除的元素,你可以通過一個(gè)變量獲取被移除的元素
array.splice() 也可以刪除數(shù)組的元素
像 array.pop() 和 array.shift() 一樣,array.splice() 同樣返回移除的元素
JavaScript 的 array.filter() 方法基于原數(shù)組創(chuàng)建一個(gè)新數(shù)組,新數(shù)組僅包含匹配特定條件的元素
以上代碼的條件是“不等于 ‘e’ ”,因此新數(shù)組(arr2)里面沒有包含 ‘e’。
箭頭函數(shù)的獨(dú)特性:
單行箭頭函數(shù),’return’ 關(guān)鍵字是默認(rèn)自帶的,不需要手動(dòng)書寫。
可是,多行箭頭函數(shù)就需要明確地返回一個(gè)值。
另一種不影響原數(shù)組的方式是 array.slice()(不要與 array.splice() 混淆)。
如果知道替換哪一個(gè)元素,可以使用 array.splice()
VI. 替換:不影響原數(shù)組
可以使用 array.map() 創(chuàng)建一個(gè)新數(shù)組,并且可以檢查每一個(gè)元素,根據(jù)特定的條件替換它們。
使用 array.map() 轉(zhuǎn)換數(shù)據(jù)
array.map() 是個(gè)強(qiáng)力方法,可以用于轉(zhuǎn)換數(shù)據(jù),而不污染原先的數(shù)據(jù)源
JS與PHP在函數(shù)傳參方面有點(diǎn)不同,PHP形參與實(shí)參個(gè)數(shù)要匹配,而JS就靈活多了,可以隨意傳參,實(shí)參比形參少或多都不會(huì)報(bào)錯(cuò)。
實(shí)參比形參多不會(huì)報(bào)錯(cuò)
function say(a){ alert(a); } say("will","WEB");
執(zhí)行結(jié)果
我們?cè)賮砜纯葱螀⒈葘?shí)參多的結(jié)果
function say(a,b){ alert("a 的值是 "+a+" b 的值是 "+b); } say("will");
執(zhí)行結(jié)果
a 對(duì)應(yīng)第一個(gè)實(shí)參“will”,b 沒有對(duì)應(yīng)的實(shí)參所以值為undefined
其實(shí)有時(shí)候我們?cè)诔绦蛟O(shè)計(jì)比較復(fù)雜的時(shí)候并不指定參數(shù)個(gè)數(shù),都是靈活運(yùn)用。在函數(shù)里有一個(gè)數(shù)組arguments就是專門存儲(chǔ)實(shí)參數(shù)組的,通過arguments我們就可以知道實(shí)參個(gè)數(shù)以及值。
function arg(){ var str = "總共傳了"+arguments.length+"個(gè)參數(shù) "; for(var i=0;i執(zhí)行結(jié)果
在以上例子中,我們定義函數(shù)arg并沒有給它指定形參,而是使用arguments對(duì)象接收實(shí)參,非常靈活。
比如我們可以利用它來計(jì)算出一組數(shù)字里最小的數(shù)字,不管這組數(shù)字有多少個(gè)。如以下代碼:function arg(){ var tmp = 0, str = "在 "; for(var i=0;i執(zhí)行 30,10,59,35 四個(gè)數(shù)對(duì)比結(jié)果
我們?cè)诩尤雰蓚€(gè)數(shù),分別是 5 和 16
function arg(){ var tmp = 0, str = "在 "; for(var i=0;i執(zhí)行 30,10,59,35,5,16 六個(gè)數(shù)對(duì)比結(jié)果
三、javascript閉包的理解 閉包(closure)是Javascript語言的一個(gè)難點(diǎn),也是它的特色,很多高級(jí)應(yīng)用都要依靠閉包實(shí)現(xiàn)。 1. 變量的作用域
根據(jù)兩次運(yùn)算結(jié)果,我們發(fā)現(xiàn)無論我們傳進(jìn)多少個(gè)數(shù)字,都能正確比對(duì)結(jié)果。arguments一般用在實(shí)參個(gè)數(shù)不定的地方,比如上邊的例子,你可以傳5個(gè)數(shù)進(jìn)去比較,也可以傳100個(gè)數(shù)進(jìn)去比較都可以。要理解閉包,首先必須理解Javascript特殊的變量作用域。
變量的作用域無非就是兩種:全局變量和局部變量。
Javascript語言的特殊之處,就在于函數(shù)內(nèi)部可以直接讀取全局變量。var n=999; function f1(){ alert(n); } f1(); // 999
另一方面,在函數(shù)外部自然無法讀取函數(shù)內(nèi)的局部變量。function f1(){ var n=999; } alert(n); // error這里有一個(gè)地方需要注意,函數(shù)內(nèi)部聲明變量的時(shí)候,一定要使用var命令。如果不用的話,你實(shí)際上聲明了一個(gè)全局變量!
function f1(){ n=999; } f1(); alert(n); // 9992. 如何從外部讀取局部變量?出于種種原因,我們有時(shí)候需要得到函數(shù)內(nèi)的局部變量。但是,前面已經(jīng)說過了,正常情況下,這是辦不到的,只有通過變通方法才能實(shí)現(xiàn)。
那就是在函數(shù)的內(nèi)部,再定義一個(gè)函數(shù)。function f1(){ var n=999; function f2(){ alert(n); // 999 } }在上面的代碼中,函數(shù)f2就被包括在函數(shù)f1內(nèi)部,這時(shí)f1內(nèi)部的所有局部變量,對(duì)f2都是可見的。但是反過來就不行,f2內(nèi)部的局部變量,對(duì)f1就是不可見的。這就是Javascript語言特有的"鏈?zhǔn)阶饔糜?結(jié)構(gòu)(chain scope),子對(duì)象會(huì)一級(jí)一級(jí)地向上尋找所有父對(duì)象的變量。所以,父對(duì)象的所有變量,對(duì)子對(duì)象都是可見的,反之則不成立。
既然f2可以讀取f1中的局部變量,那么只要把f2作為返回值,我們不就可以在f1外部讀取它的內(nèi)部變量了嗎!function f1(){ var n=999; function f2(){ alert(n); } return f2; } var result=f1(); result(); // 9993. 閉包的概念上一節(jié)代碼中的f2函數(shù),就是閉包。
4. 閉包的用途
各種專業(yè)文獻(xiàn)上的"閉包"(closure)定義非常抽象,很難看懂。我的理解是,閉包就是能夠讀取其他函數(shù)內(nèi)部變量的函數(shù)。
由于在Javascript語言中,只有函數(shù)內(nèi)部的子函數(shù)才能讀取局部變量,因此可以把閉包簡(jiǎn)單理解成"定義在一個(gè)函數(shù)內(nèi)部的函數(shù)"。
所以,在本質(zhì)上,閉包就是將函數(shù)內(nèi)部和函數(shù)外部連接起來的一座橋梁。閉包可以用在許多地方。它的最大用處有兩個(gè),一個(gè)是前面提到的可以讀取函數(shù)內(nèi)部的變量,另一個(gè)就是讓這些變量的值始終保持在內(nèi)存中。
怎么來理解這句話呢?請(qǐng)看下面的代碼。function f1(){ var n=999; nAdd=function(){n+=1} function f2(){ alert(n); } return f2; } var result=f1(); result(); // 999 nAdd(); result(); // 1000在這段代碼中,result實(shí)際上就是閉包f2函數(shù)。它一共運(yùn)行了兩次,第一次的值是999,第二次的值是1000。這證明了,函數(shù)f1中的局部變量n一直保存在內(nèi)存中,并沒有在f1調(diào)用后被自動(dòng)清除。
5. 使用閉包的注意點(diǎn)
為什么會(huì)這樣呢?原因就在于f1是f2的父函數(shù),而f2被賦給了一個(gè)全局變量,這導(dǎo)致f2始終在內(nèi)存中,而f2的存在依賴于f1,因此f1也始終在內(nèi)存中,不會(huì)在調(diào)用結(jié)束后,被垃圾回收機(jī)制(garbage collection)回收。
這段代碼中另一個(gè)值得注意的地方,就是"nAdd=function(){n+=1}"這一行,首先在nAdd前面沒有使用var關(guān)鍵字,因此nAdd是一個(gè)全局變量,而不是局部變量。其次,nAdd的值是一個(gè)匿名函數(shù)(anonymous function),而這個(gè)匿名函數(shù)本身也是一個(gè)閉包,所以nAdd相當(dāng)于是一個(gè)setter,可以在函數(shù)外部對(duì)函數(shù)內(nèi)部的局部變量進(jìn)行操作。1)由于閉包會(huì)使得函數(shù)中的變量都被保存在內(nèi)存中,內(nèi)存消耗很大,所以不能濫用閉包,否則會(huì)造成網(wǎng)頁的性能問題,在IE中可能導(dǎo)致內(nèi)存泄露。解決方法是,在退出函數(shù)之前,將不使用的局部變量全部刪除。
6. 思考題
2)閉包會(huì)在父函數(shù)外部,改變父函數(shù)內(nèi)部變量的值。所以,如果你把父函數(shù)當(dāng)作對(duì)象(object)使用,把閉包當(dāng)作它的公用方法(Public Method),把內(nèi)部變量當(dāng)作它的私有屬性(private value),這時(shí)一定要小心,不要隨便改變父函數(shù)內(nèi)部變量的值。如果你能理解下面兩段代碼的運(yùn)行結(jié)果,應(yīng)該就算理解閉包的運(yùn)行機(jī)制了。
代碼片段一。var name = "The Window"; var object = { name : "My Object", getNameFunc : function(){ return function(){ return this.name; }; } }; alert(object.getNameFunc()());代碼片段二。
var name = "The Window"; var object = { name : "My Object", getNameFunc : function(){ var that = this; return function(){ return that.name; }; } }; alert(object.getNameFunc()());原文連接:
http://note.youdao.com/notesh...
http://note.youdao.com/notesh...
http://note.youdao.com/notesh...
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/82024.html
摘要:一基礎(chǔ)接口的意義百度規(guī)范擴(kuò)展回調(diào)抽象類的意義我的前端面試經(jīng)歷百度前端掘金博主就讀于電子科技大學(xué),大三狗一枚面試是個(gè)漫長(zhǎng)的過程,從海投到收獲電話面試,一面二面三面,一個(gè)步驟出錯(cuò)那么后面就宣告終結(jié)。 一道常被人輕視的前端 JS 面試題 - 前端 - 掘金 目錄前言第一問第二問變量聲明提升函數(shù)表達(dá)式第三問第四問第五問第六問構(gòu)造函數(shù)的返回值第七問最后前言 年前剛剛離職了,分享下我曾經(jīng)出過的一道...
摘要:獲取的對(duì)象范圍方法獲取的是最終應(yīng)用在元素上的所有屬性對(duì)象即使沒有代碼,也會(huì)把默認(rèn)的祖宗八代都顯示出來而只能獲取元素屬性中的樣式。因此對(duì)于一個(gè)光禿禿的元素,方法返回對(duì)象中屬性值如果有就是據(jù)我測(cè)試不同環(huán)境結(jié)果可能有差異而就是。 花了很長(zhǎng)時(shí)間整理的前端面試資源,喜歡請(qǐng)大家不要吝嗇star~ 別只收藏,點(diǎn)個(gè)贊,點(diǎn)個(gè)star再走哈~ 持續(xù)更新中……,可以關(guān)注下github 項(xiàng)目地址 https:...
摘要:前言在大廠工作了年,當(dāng)了年的前端面試官,把大廠常問的面試題與答案匯總在我的中。第題如何劫持的請(qǐng)求,提供思路難度阿里騰訊很多人在上搜索前端面試詳解,把答案倒背如流,但是問到如何劫持請(qǐng)求的時(shí)候就一臉懵逼,是因?yàn)檫€是停留在理論性階段。前言 在大廠工作了6年,當(dāng)了3年的前端面試官,把大廠常問的面試題與答案匯總在我的Github中。希望對(duì)大家有所幫助,助力大家進(jìn)入自己理想的企業(yè)。 項(xiàng)目地址是:git...
摘要:前言在大廠工作了年,當(dāng)了年的前端面試官,把大廠常問的面試題與答案匯總在我的中。第題如何劫持的請(qǐng)求,提供思路難度阿里騰訊很多人在上搜索前端面試詳解,把答案倒背如流,但是問到如何劫持請(qǐng)求的時(shí)候就一臉懵逼,是因?yàn)檫€是停留在理論性階段。 前言 在大廠工作了6年,當(dāng)了3年的前端面試官,把大廠常問的面試題與答案匯總在我的Github中。希望對(duì)大家有所幫助,助力大家進(jìn)入自己理想的企業(yè)。 項(xiàng)目地址是:...
摘要:前言在大廠工作了年,當(dāng)了年的前端面試官,把大廠常問的面試題與答案匯總在我的中。第題如何劫持的請(qǐng)求,提供思路難度阿里騰訊很多人在上搜索前端面試詳解,把答案倒背如流,但是問到如何劫持請(qǐng)求的時(shí)候就一臉懵逼,是因?yàn)檫€是停留在理論性階段。 前言 在大廠工作了6年,當(dāng)了3年的前端面試官,把大廠常問的面試題與答案匯總在我的Github中。希望對(duì)大家有所幫助,助力大家進(jìn)入自己理想的企業(yè)。 項(xiàng)目地址是:...
閱讀 3046·2021-11-02 14:40
閱讀 857·2019-08-30 15:53
閱讀 1277·2019-08-30 15:53
閱讀 3275·2019-08-30 13:53
閱讀 3317·2019-08-29 12:50
閱讀 1145·2019-08-26 13:49
閱讀 1877·2019-08-26 12:20
閱讀 3678·2019-08-26 11:33