ie相容es6，ie相容ES6的方法，包括箭頭函式，Promise，async，await
阿新 • • 發佈：2018-12-01
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等。