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等。