Safari 9 不支持 ES6：解决方案

什么是 ES6

ECMAScript 6.0，简称 ES6，是一个主要的 JavaScript 编程语言标准，于 2015 年 6 月发布。ES6 引入了许多新的语言特性，例如箭头函数、类、模块、解构、rest 参数、Symbol 类型等。这些新特性令 JavaScript 代码更加简洁、易读、易维护，极大地提升了开发效率和代码质量。

为什么 Safari 9 不支持 ES6

Safari 9 是苹果公司推出的浏览器，发布于 2015 年 9 月。在该版本的 Safari 中，对 ES6 的支持并不完整，只支持部分新特性，例如 let、const、箭头函数、模板字符串等，但不支持诸如 Promise、生成器等更为先进的特性。

解决方案

要让 Safari 9 支持 ES6，可以采用以下两种解决方案：

方案一：使用 Babel 编译器

Babel 是一个广泛使用的 JavaScript 编译器，可以将 ES6 代码转换为 ES5 代码，从而兼容旧版浏览器。使用 Babel 的步骤如下：

1. 在项目中安装 Babel：

   $ npm install --save-dev @babel/core @babel/cli @babel/preset-env

2. 配置 Babel：

   在项目根目录下创建 .babelrc 文件，并输入以下内容：

   {
     "presets": ["@babel/preset-env"]
   }

3. 编译 ES6 代码：

   在项目根目录下执行以下命令：

   $ npx babel src --out-dir lib

   这将会将 src 目录中的 ES6 代码编译成 ES5 代码，并存储在 lib 目录中。

方案二：使用 polyfill 库

polyfill 是一个 JavaScript 库，可以在旧版浏览器中模拟出 ES6 的部分特性。使用 polyfill 的步骤如下：

1. 在 HTML 文件中加载 polyfill 库：

   <script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>

2. 编写 ES6 代码：

   在代码中使用 ES6 的新特性，例如 Promise、生成器等。

3. 使用 polyfill 实现对应特性：

   在代码中使用 polyfill 库提供的模拟实现，例如：

   -- -------------------- ---- -------
   -- ---------------- -
     ------------- - ---------------- -------- -
       -- ------- -- ----- -
         ----- --- ----------------- ------- --------- -- ---- -- ---------
       -
       --- -- - ---------------
       --- ---- ----- - -- ----- - ----------------- -------- -
         --- ---------- - -----------------
         -- ----------- -- ----- -
           --- ---- ------- -- ----------- -
             -- ------------------------------------------------- --------- -
               ----------- - --------------------
             -
           -
         -
       -
       ------ ---
     --
   -

示例代码

下面是一个使用 Babel 编译器的示例代码：

-- -------------------- ---- -------
----- ------ -
  ----------------- -
    --------- - -----
  -

  ------- -
    ------------------- - - --------- - -----
  -
-

----- ---- - --- ------------ ------
-------------

使用 Babel 编译器将上述代码转换为 ES5 代码：

-- -------------------- ---- -------
---- --------

-------- ------------------------- ------------ - -- ----------- ---------- ------------- - ----- --- ----------------- ---- - ----- -- - ----------- - -

--- ------ - -------- ------------ -
  --------------------- --------

  --------- - -----
--

---------------------- - -------- ------- -
  ------------------- - - --------- - -----
--

--- ---- - --- ------------ ------
-------------

浏览器支持情况

下表列出了主流浏览器对 ES6 的支持情况（数据来源于 caniuse.com）：

总结

ES6 是 JavaScript 社区中的一项重要进步，可以提升代码质量、开发效率，并带来更好的用户体验。而 Safari 9 中对 ES6 的支持并不完整，需要采用 Babel 编译器或 polyfill 库进行转换。随着时间的推移，浏览器对 ES6 的支持会越来越全面，我们可以更加自由地使用这些新特性，创造更加优秀的 Web 应用。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/654377a57d4982a6ebd3fe9c