JS中Polyfill註解與阻止修改的使用

這次帶給大家JS中Polyfill註解與阻止修改的使用，JS中Polyfill註解與阻止修改使用的注意事項有哪些，下面就是實戰案例，一起來看一下。

隨著ES5和和HTML5的特性逐漸被各種瀏覽器實作。 JS polyfills（也稱為shim）變得流行起來了。 polyfill是某種功能的模擬，這些功能在新版本的瀏覽器中有完整的定義和原生實作。例如，ES5為數組增加了forEach()函數。這個方法在 ES3中有模擬實現，這樣就可以在舊版瀏覽器中用上這個方法了。 polyfills的關鍵在於它們的類比實作要與瀏覽器原生實作保持完全相容。正是由於少數瀏覽器原生實現這些功能，才需要盡可能的檢測不同情況下它們這些功能的處理是否符合標準。

為了達到目的，polyfills常常會為非自己擁有的物件新增一些方法。我不是polyfills的粉絲，不過對別人使用它們，我表示理解。相較之下其他的物件修正而言，polyfills是有界線的，是相對安全的。因為原生實作中是存在這些方法並且能運作的，有且僅當原生方法不存在時，polyfills才新增這些方法，而且它們和原生版本方法的行為是完全一致的。

polyfills的優點是，如果瀏覽器提供原生實現，可以非常輕鬆地移除它們。如果你使用了polyfills，你需要弄清楚哪些瀏覽器提供了原生實作。並確保polyfills的實作和瀏覽器原生實作保持完全一致，並再三檢查類別庫是否提供驗證這些方法正確性的測試案例。 polyfills的缺點是，和瀏覽器的原生實作相比，它們的實作可能不精確，這會給你帶來很多麻煩，不如不實現它。

從最佳的可維護性角度而言，避免使用polyfills，相反地可以在已存在的功能之上建立門面來實現。這個方法給了你最大的彈性，當原生實作中有bug時這種做法（避免使用polyfills）就顯得特別重要。在這種情況下，你根本不想直接使用原生的API，不然無法將原生實作附帶的bug隔離開來。

ES5引入了幾個方法來防止對物件的修改。理解這些能力很重要，因此現在可以做到這樣的事情：鎖定這些對象，並保證任何人不能有意或無意地修改他們不想要的功能。目前（2018年）的瀏覽器都支援ES5的這些功能，有三種鎖定修改的等級：

#防止擴充(Object.preventExtension())：禁止為物件「新增」 屬性和方法，但已存在的屬性和方法是可以被修改或刪除

密封(Object.seal())：類似“防止擴展”，而且禁止為物件“刪除”已存在的屬性和方法

凍結(Object.freeze())：類似“密封”，而且禁止為對象“修改”已存在的屬性和方法（所有字段均只讀）

每種鎖定的類型都有兩個方法：一個用來實作操作，另一個用來偵測是否套用了對應的操作。如防止擴展，Object.preventExtension()和Object.isExtensible()兩個函數可以使用。你可以在MDN上查看相關方法的使用，這裡就不贅述了。

使用ES5中的這些方法是保證你的專案不經過你同意鎖定修改的極佳的做法。如果你是一個程式碼庫的作者，很可能會想鎖定核心庫某些部分來保證它們不會被意外修改，或是想強迫允許擴充的地方繼續存活。如果你是一個應用程式的開發者，鎖定應用程式的任何不想被修改的部分。這兩種情況中，在全部定義好這些物件的功能之後，才能使用上述的鎖定方法。一旦一個物件被鎖定了，它將無法解鎖。

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

推薦閱讀：

web開發中怎樣偵測原始值

#為什麼web開發中需要避免使用全域變數

以上是JS中Polyfill註解與阻止修改的使用的詳細內容。更多資訊請關注PHP中文網其他相關文章！