在 ES7 中，Array.prototype.fill() 方法可以用于填充数组中的元素。但是，在 Safari 中使用此方法时，可能会出现兼容性问题。本文将探讨这个问题以及如何解决它。
问题描述
在 Safari 中，当我们使用 Array.prototype.fill() 方法时，会出现以下错误：
TypeError: undefined is not a function (evaluating 'array.fill(0)')
这是因为 Safari 版本不支持 Array.prototype.fill() 方法。
例如，下面的代码片段将在大多数浏览器中正常工作，但在 Safari 中将产生上述错误：
const array = [1, 2, 3]; array.fill(0); console.log(array); // [0, 0, 0]
解决方案
解决此问题的一种方法是使用 polyfill。polyfill 是一个 JavaScript 库，它提供了在较旧浏览器中缺失的功能。
我们可以使用以下 polyfill 代码解决 Safari 中 Array.prototype.fill() 方法不兼容的问题：
-- -------------------- ---- -------
-- ----------------------- -
-------------------------------------- ------- -
------ -------- ------- -
-- ----------
--- ----- - ------------ -- --
--- --- - ------------
-- --------
-- ------ - -- -
----- - ----------- - ------
-
-- --------
-- ------------- --- ---------- -
--- - -------------
-
-- ---- - -- -
--- - ----------- - ----
-
-- -----------
--- ---- - - ------ - - ---- ---- -
------- - ------
-
-- --------
------ -----
-
---
-这段代码将 Array.prototype.fill() 方法定义为一个属性，并提供了一个函数来模拟 fill() 的功能。此 polyfill 不仅解决了 Safari 中 Array.prototype.fill() 方法的兼容性问题，还支持负数起始位置和终止位置。
示例代码
下面是使用上述 polyfill 的示例代码：
-- -------------------- ---- -------
-- -- -------- --
-- -- --------
-- ----------------------- -
-------------------------------------- ------- -
------ -------- ------- -
--- ----- - ------------ -- --
--- --- - ------------
-- ------ - -- -
----- - ----------- - ------
-
-- ------------- --- ---------- -
--- - -------------
-
-- ---- - -- -
--- - ----------- - ----
-
--- ---- - - ------ - - ---- ---- -
------- - ------
-
------ -----
-
---
-
-- -- ------ --
----- ----- - --- -- ---
--------------
------------------- -- --- -- --在此示例中，我们定义了 polyfill 代码，并使用 fill() 方法将数组中的所有元素设置为零。
结论
通过使用 polyfill，我们可以解决 Safari 中 Array.prototype.fill() 方法不兼容的问题。在编写具有兼容性的代码时，我们应该始终考虑到这些问题，并确保我们的代码可以在所有主要浏览器中正常工作。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/66ee58c46fbf960197216670