学习es6

Posted 2020-11-02 aSnow

#第一节

初始化项目

npm init -y

安装babel-cli

npm install -g babel-cli

npm install --save-dev babel-preset-es2015 babel-cli

根目录新建.babelrc文件

写入一下内容

{

"presets": [

"es2015"

],

"plugins": [

 

]

}

转化es6

babel src/index.js -o dist/index.js

自动转

babel src/index.js -w -o dist/index.js

为了方便我们可以配置package.json

如下：

"scripts": {

 

"dev":"babel src/index.js -o dist/index.js",//不自动生成

"deva":"babel src/index.js -w -o dist/index.js"//自动生成

},

·

然后输入npm run build就可以

编译api

npm install --save babel-polyfill

然后引入

<script type="text/javascript" src="node_modules\babel-polyfill\dist\polyfill.min.js"></script>

#第二节

let 局部声明变量

var 全局声明

const常量声明值不能改变

#第三节

解构赋值

let [a,b,c]=[0,1,2];

console.log(a,b,c);

先赋值解构

let foo;

({foo}={foo:‘111‘})

#第四节

对象扩展运算符

...

let arr1=[‘www‘,‘aaa‘,‘bbbb‘];

let arr2=[...arr1];

console.log(arr2);

arr2.push(‘qqqq‘);

console.log(arr1);

#第五节

字符串模版

let isp="222";

let aa=`<b>frssd</b>fg<br />dsagdf${isp}`

document.write(aa)

#第六节

#第七节

es6中的数组

Array.from(xxx)json数组转数组

Array.of转换字符串为数组

数组的json格式

let json={

‘0‘:‘jsp‘,

‘1‘:‘222‘,

‘2‘:‘edwwa‘,

length:3

}

find()查找

查找出大于5的

let aa=[1,2,3,4,5,6];

console.log(aa.find(function(value,index,aa){

return value>5

}))

#第八节

fill()//查找替换

for of循环

let arr=[‘jsp‘,‘qqq‘,‘eee‘];

for(let [index,val] of arr.entries()){

console.log(index,val)

}

entries()实例可以实现不规则循环

#第九节

箭头函数

// function add(a,b){

// return a+b

// }

// console.log(add(1,2))

 

var add =(a,b=1) => a+b;

console.log(add(1));

#第十节