Array.prototype.concat不是通用方法反駁[譯]
更新時間:2012年09月20日 22:40:46 作者:
ECMAScript 5.1規(guī)范中指出,數(shù)組方法concat是通用的(generic).本文反駁了這一結(jié)論,因為實際上并不是這樣的
ECMAScript 5.1規(guī)范§15.4.4.4 中說到:
復(fù)制代碼 代碼如下:
concat函數(shù)是有意設(shè)計成通用的;它并不要求它的this值必須得是個Array對象.因此,它可以被轉(zhuǎn)移到其它類型的對象上作為方法來調(diào)用.
本文中的代碼都使用了[]來作為Array.prototype的快捷方式.這已經(jīng)是很常用的技巧了,雖然可讀性差點:你通過一個對象實例訪問到了Array.prototype上的方法.但是,這樣的訪問方式在現(xiàn)代的JavaScript引擎中非常之快,以至于我懷疑,說不定在這種調(diào)用方式下,這些JavaScript引擎可能已經(jīng)不再創(chuàng)建數(shù)組實例了.本文中所有的例子都在Firefox和V8中嘗試運行過.
讓我們看一下concat到底是不是個通用方法:如果它是一個通用方法,則不管this的值是一個真實數(shù)組還是個類數(shù)組對象(擁有l(wèi)ength屬性,能通過索引訪問每個元素),方法的返回結(jié)果都應(yīng)該是一樣的.我們首先嘗試在數(shù)組上調(diào)用concat方法:
復(fù)制代碼 代碼如下:
> ["hello"].concat(["world"])
["hello", "world"]
> [].concat.call(["hello"], ["world"]) // 和上面的一樣
["hello", "world"]
然后,我們使用一個類數(shù)組對象來進行上面的連接操作.結(jié)果應(yīng)該是一樣的.
復(fù)制代碼 代碼如下:
> [].concat.call({ 0: "hello", length: 1 }, ["world"])
[ { '0': 'hello', length: 1 }, 'world' ]
特殊變量arguments也是一個類數(shù)組對象.結(jié)果仍然不是我們所期望的:
復(fù)制代碼 代碼如下:
> function f() { return [].concat.call(arguments, ["world"]) }
> f("hello")
[ { '0': 'hello' }, 'world' ]
真正的通用方法應(yīng)該是這樣的Array.prototype.push:
復(fù)制代碼 代碼如下:
> var arrayLike = { 0: "hello", length: 1 };
> [].push.call(arrayLike, "world")
2
> arrayLike
{ '0': 'hello', '1': 'world', length: 2 }
譯者注:瀏覽器只是按照標準來實現(xiàn),所以并不存在bug的問題.
相關(guān)文章
javascript正則表達式使用replace()替換手機號的方法
這篇文章主要介紹了javascript正則表達式使用replace()替換手機號的方法,可實現(xiàn)把手機號第4位到第7位替換成****的功能,是非常實用的技巧,需要的朋友可以參考下2015-01-01JS Jquery 遍歷,篩選頁面元素 自動完成(實現(xiàn)代碼)
本篇文章是對JS Jquery 遍歷,篩選頁面元素 自動完成的實現(xiàn)代碼進行了詳細的分析介紹,需要的朋友參考下2013-07-07javascript實現(xiàn)網(wǎng)頁中涉及的簡易運動(改變寬高、透明度、位置)
這篇文章主要介紹了javascript實現(xiàn)網(wǎng)頁中涉及的簡易運動,比如改變寬高、透明度、位置等,感興趣的小伙伴們可以參考一下2015-11-11JavaScript實現(xiàn)簡易購物車最全代碼解析(ES6面向?qū)ο?
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)簡易購物車最全代碼,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2021-09-09一文教你徹底學(xué)會JavaScript手寫防抖節(jié)流
其實防抖和節(jié)流不僅僅在面試中會讓大家手寫,在實際項目中也可以起到性能優(yōu)化的作用,所以還是很有必要掌握的。本文就帶大家徹底學(xué)會JavaScript手寫防抖節(jié)流,需要的可以參考一下2022-11-11