ie兼容es6,ie兼容ES6的方法,包括箭头函数,Promise,async,await

1.

使用es6语法(不包含Promise)

script标签的type的值设为text/babel

<script type="text/babel">
    const arr1=[1,2,3]
    const arr2=[...arr1]
    console.log(arr2);
    let arr3=arr2.map((x)=>x*2)
    console.log(arr3);
    const [x,y,z]=[[...arr3]]
    console.log(x);

    class Point {
        constructor(x, y) {
            this.x = x;
            this.y = y;
        }

        toString() {
            return '(' + this.x + ', ' + this.y + ')';
        }
    }
    console.log(new Point(1, 2).toString());
    console.log(new Promise(function(){})); 
</script>
<script src="browser.min.js"></script>

即在<script>标签后导入browser.min.js(browser.min.js下载链接,不需要积分)就行了。结果为:

index.js:4 [1, 2, 3]
index.js:5 [2, 4, 6]
index.js:7 [2, 4, 6]
index.js:20 (1, 2)

IE使用Promise,async,await

在头部增加polyfill.js即可。

polyfill.js安装方法:npm install babel-polyfill --save

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>polyfill</title>
    <script src="../node_modules/babel-polyfill/dist/polyfill.js"></script>
</head>
<body>
<script type="text/babel">
    const arr1=[1,2,3]
    const arr2=[...arr1]
    console.log(arr2);
    let arr3=arr2.map((x)=>x*2)
    console.log(arr3);
    const [x,y,z]=[[...arr3]]
    console.log(x);

    class Point {
        constructor(x, y) {
            this.x = x;
            this.y = y;
        }

        toString() {
            return '(' + this.x + ', ' + this.y + ')';
        }
    }
    console.log(new Point(1, 2).toString());
    console.log(new Promise(function(){}))
    function getUser() {
      return new Promise((resolve) => {
        setTimeout(()=>{
          resolve('lzy')
        },2000)
      })

    }
    async function getUserName() {
      let userName=await getUser()
      console.log(userName)
    }
    getUserName()
</script>
<script src="browser.min.js"></script>
</body>
</html>

比较通用的工具方案有babel,jsx,traceur,es6-shim等。

 

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
ES6中的asyncawait是用于处理异步操作的关键字。async关键字用于声明一个函数是异步的,而await关键字用于等待一个异步任务执行完成。 通过使用asyncawait,我们可以以同步的方式编写异步代码,使得代码更加清晰和易读。 使用async关键字声明的函数会返回一个Promise对象。在函数内部,我们可以使用await关键字来等待一个异步任务执行完成,而不需要使用回调函数或者Promise的then方法。当await关键字等待一个异步任务时,它会暂停函数的执行,并且等待异步任务完成后继续执行函数asyncawait的使用可以大大简化异步代码的编写,使得代码更易于理解和维护。它们是ES6中非常有用的特性,被广泛应用于JavaScript开发中。 引用: 目录 ES6asyncawait关键字1、初步了解2、async关键字3、await关键字4、深入讲解asyncawait。 :主要介绍了详解ES6async await 同步/异步方案,本文以最简明的方式来疏通 async await,有兴趣的可以了解下。 :我们先从字面意思来理解这两个关键字,asyncasynchronous(异步)的简写,而await可以认为是async wait的简写。所以async可以理解为用于声明一个函数是异步的,而await用于等待一个异步任务执行完成。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [详解ES6asyncawait关键字](https://blog.csdn.net/ldjgood/article/details/123696983)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* [详解ES6async+await 同步/异步方案](https://download.csdn.net/download/weixin_38746166/12772472)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值