ES6 的新特性
1：变量声明 let 和 const
在 ES5 之前 以下两种 函数方式 声明 test 方式一致 变量提升
function aa() {
var flag=true;
if(flag) {
var test = 'hello man'
}
alert(test)
}
function bb() {
var flag=true;
var test
if(flag) {
test = 'hello man'
}
alert(test)
}
let 和 const 是块级作用域
块级作用域: 在一个函数内部 在一个代码块的内部 ,其实就是仅仅作用域 最近{} 中
let 声明变量
const 声明常量 const 如果声明的是对象 对象中的值是可以修改的,指向地址不能改变
const student = { name: 'cc' }
// 没毛病
student.name = 'yy'
// 如果这样子就会报错了
student = { name: 'yy' }
2:字符串模板
//ES5
var name = 'lux'
console.log('hello' + name)
//es6
const name = 'lux'
console.log(`hello ${name}`) //hello lux
3:函数默认值
function action(num) {
num = num || 200
//当传入num时，num为传入的值
//当没传入参数时，num即有了默认值200
return num
}
//ES5 时num 传入0 时 未false
alert( action(0)) 弹出200
alert( action(1)) 弹出1
//ES6 提供了默认函数值
function action(num = 200) {
console.log(num)
}
action(0) // 0
action() //200
action(300) //300
4:箭头函数
=>
三个特点 a: 省略function 关键字 b:省略 return c:继承当前上下文 this 的关键字
//例如：
var data=[0,1,2].map(x => x + 1)
//等同于：都输出 [1,2,3]
var data= [0,1,2].map((function(x){
return x + 1
}).bind(this))
5:解构
//对象
const people = {
name: 'lux',
age: 20,
sex:'男'
}
const { name, age,sex } = people
console.log(`${name} - ${age}--${sex}`)
引入
const jsonParse=require('body-parser').jsonparse; 用 es6 转换 import {jsonparse} from 'body-parser'
6:Spread Operator 运算符 (...)
数组合并
const num=[1,2];
const num2=[3,4];
const num3=[...num,...num2,5,6];
alert(num3)
对象合并
如果有重复的属性名:右边覆盖左边
const o
constfirst = { a:1, b:2, c:6, }
constsecond = { c:3, d:4}
consttotal = { ...first, ...second } console.log(total)// { a: 1, b: 2, c: 3, d: 4 }
获得数组或对象的某几项
const user={name:"yufeng",sex:"男"}
const user={name:"yufeng",sex:"男",age:20,nick:'魅力'};
const{name,...reset}=user;
console.log(name);//yufeng
console.log(reset);//{sex: "男", age: 20, nick: "魅力"}
7:import 和 export
1.当用export default people导出时，就用 import people 导入（不带大括号）
2.一个文件里，有且只能有一个export default。但可以有多个export。
3.当用export name 时，就用import { name }导入（记得带上大括号）
4.当一个文件里，既有一个export default people, 又有多个export name 或者 export age时，导入就用 import people, { name, age }
5.当一个文件里出现n多个 export 导出很多模块，导入时除了一个一个导入，也可以用import * as example
8. Promise
以此输出:2,3,4,5,1
setTimeout(
function() {console.log(1)},
0);
newPromise(
function executor(resolve)
{
console.log(2);
for(vari=0; i<10000; i++ )
{ i ==9999&& resolve(); }
console.log(3); }
).
then(function()
{console.log(4);}
);
console.log(5);
9:迭代器 Genertors
返回一个 迭代器函数 ,比普通的function 多了一个*号
function * createIteratorFunction () {
yield 1;
yield 2;
yield 3;
}
let createIterator=createIteratorFunction();
console.log(createIterator.next().value);//1
console.log(createIterator.next().value);//2
console.log(createIterator.next().value);//3
网友评论