欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

javascript當中的代碼嗅探擴展原生對象和原型(prototype)

 更新時間:2013年01月11日 09:37:27   投稿:whsnow  
如果不是有特殊需要而去擴展原生對象和原型(prototype)的做法是不好的,除非這樣做是值得的,例如,向一些舊的瀏覽器中添加一些ECMAScript5中的方法

:翻譯之中有什么不恰當?shù)牡胤?,歡迎大家指正,祝大家雙節(jié)快樂!
如果不是有特殊需要而去擴展原生對象和原型(prototype)的做法是不好的

復制代碼 代碼如下:

//不要這樣做
Array.prototype.map = function() {
// 一些代碼
};

除非這樣做是值得的,例如,向一些舊的瀏覽器中添加一些ECMAScript5中的方法。
在這種情況下,我們一般這樣做:
復制代碼 代碼如下:

if (!Array.prototype.map) {
Array.prototype.map = function() {
//一些代碼
};
}

如果我們比較偏執(zhí),為了防止別人將map定義為其它意想不到的值,像true或其他,我們可以 將檢測代碼改為下面這樣:
復制代碼 代碼如下:

if (typeof Array.prototype.map !== "function") {
Array.prototype.map = function() {
// 一些代碼
};
}

但是,在一個充滿敵意和殘酷競爭的環(huán)境下(換句話說,但你提供或者使用一個js庫時),你不應該相信任何人。如果其他人的js代碼先于你的js代碼加載,并且以某種方式定義了一個不完全兼容ES5的map()方法,導致你的代碼不能正常運行,該怎么辦呢?

不過,你可以相信瀏覽器,如果Webkit內(nèi)核實現(xiàn)了map()方法,你可以放心,這個方法肯定會正常運行。否則的話,你就要用你的代碼進行檢測了。

幸運的是,這在JavaScript當中很容易實現(xiàn),當你調(diào)用原生函數(shù)的toString方法的時候,會返回一個函數(shù)的字符串,該函數(shù)的函數(shù)體是[native code]。
例如在Chrome的控制臺下:

復制代碼 代碼如下:

> Array.prototype.map.toString();
"function map() { [native code] }"

一個適當?shù)拇a檢查向來就是一個稍微令人不快的事,因為不同瀏覽器對空格和換行處理的太過輕率。測試如下:
復制代碼 代碼如下:

Array.prototype.map.toString().replace(/\s/g, '*');
// "*function*map()*{*****[native*code]*}*" // IE
// "function*map()*{*****[native*code]*}" // FF
// "function*map()*{*[native*code]*}" // Chrome

只簡單的去掉\s會得到更實用的字符串:
復制代碼 代碼如下:

Array.prototype.map.toString().replace(/\s/g, '');
// "functionmap(){[nativecode]}"

你可以將它封裝成一個可以重用的shim()函數(shù),這樣以來你就沒有必要去重復所有的類似!

Array.prototype...這樣的操作了。這個函數(shù)會接受一個對象作為參數(shù)(例如,Array.prototype),一個將要添加的屬性(例如 'map')和一個要添加的函數(shù)。
復制代碼 代碼如下:

function shim(o, prop, fn) {
var nbody = "function" + prop + "(){[nativecode]}";
if (o.hasOwnProperty(prop) &&
o[prop].toString().replace(/\s/g, '') === nbody) {
//表名是原生的!
return true;
}
//新添加的
o[prop] = fn;
}

測試:
復制代碼 代碼如下:

//這是原生的方法
shim(
Array.prototype, 'map',
function(){/*...*/}
); // true
//這是新添加的方法
shim(
Array.prototype, 'mapzer',
function(){alert(this)}
);
[1,2,3].mapzer(); // alerts 1,2,3

(完)^_^

相關(guān)文章

  • 微信小程序商城項目之側(cè)欄分類效果(1)

    微信小程序商城項目之側(cè)欄分類效果(1)

    這篇文章主要為大家詳細介紹了微信小程序?qū)崙?zhàn)商城系列之側(cè)欄分類效果,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-04-04
  • JS二維數(shù)組的定義說明

    JS二維數(shù)組的定義說明

    本篇文章主要是對JS二維數(shù)組的定義進行了說明介紹,需要的朋友可以過來參考下,希望對大家有所幫助
    2014-03-03
  • JS實現(xiàn)常用導航鼠標下經(jīng)過下方橫線自動跟隨效果

    JS實現(xiàn)常用導航鼠標下經(jīng)過下方橫線自動跟隨效果

    這篇文章主要介紹了JS寫常用導航鼠標下經(jīng)過下方橫線自動跟隨效果,文中還給大家講解了基于css?+?js?實現(xiàn)導航欄下劃線跟隨鼠標滑動效果,需要的朋友可以參考下
    2023-01-01
  • 詳細談談JavaScript中循環(huán)之間的差異

    詳細談談JavaScript中循環(huán)之間的差異

    JS循環(huán)語句也叫迭代語句,是一種特殊的語句,主要用于需要多次執(zhí)行的代碼塊,下面這篇文章主要給大家介紹了關(guān)于JavaScript中循環(huán)之間的差異的相關(guān)資料,需要的朋友可以參考下
    2021-08-08
  • js打字機效果代碼

    js打字機效果代碼

    大家經(jīng)常用js實現(xiàn)打字機效果,最近發(fā)現(xiàn)這個不錯
    2008-06-06
  • 刷新頁面的幾種方法小結(jié)(JS,ASP.NET)

    刷新頁面的幾種方法小結(jié)(JS,ASP.NET)

    本篇文章只要是對刷新頁面的幾種方法進行了詳細的總結(jié)介紹,包括JS與ASP.NET。需要的朋友可以過來參考下,希望對大家有所幫助
    2014-01-01
  • RequireJS用法簡單示例

    RequireJS用法簡單示例

    這篇文章主要介紹了RequireJS用法,結(jié)合簡單實例形式分析了RequireJS項目文件結(jié)構(gòu)、相關(guān)操作技巧與注意事項,需要的朋友可以參考下
    2018-08-08
  • JavaScript數(shù)組塌陷實例解析

    JavaScript數(shù)組塌陷實例解析

    這篇文章主要為大家介紹了JavaScript數(shù)組塌陷實例解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
    2023-05-05
  • javascript回到頂部特效

    javascript回到頂部特效

    這篇文章主要為大家詳細介紹了javascript回到頂部特效,具有一定的參考價值,感興趣的朋友可以參考一下
    2016-07-07
  • 關(guān)于頁面嵌入swf覆蓋div層的問題的解決方法

    關(guān)于頁面嵌入swf覆蓋div層的問題的解決方法

    這篇文章主要介紹了關(guān)于頁面嵌入swf覆蓋div層的問題的解決方法,需要的朋友可以參考下
    2014-02-02

最新評論