es6新特性

1.块级作用域变量(let和const)

let和const关键字可以用来声明块级作用域变量,使得变量只在当前作用域内有效。

【1】ES6 新增了 let 命令,用于声明变量,用法与 var 类似;但禁止重复声明,let 不允许在相同作用域内,重复声明同一个变量。不存在变量提升(使用前,先声明); 暂时性死区,只要块级作用域内存在 let 命令,它所声明的变量就“绑定”(binding)这个区域,不再受外部的影响。与 var 的不同在于,用 let 声明的变量只在 let 命令所在的代码块 { }内有效。

【2】 const 命令, 定义一个只读的常量。常量的值不能改变(声明时进行初始化);禁止重复声明;不存在变量提升(养成良好习惯,先定义,后使用); 暂时性死区;变量不可修改,基本类型的话,值不可修改。引用类型的话,引用不可修改,引用的对象的属性可以修改; 声明后必须立刻赋值,否则会报错。

{

  let x = 1;

  const y = 2;

  console.log(x); // 1

  console.log(y); // 2

}

console.log(x); // ReferenceError: x is not defined

console.log(y); // ReferenceError: y is not defined

2.箭头函数

箭头函数是一种新的函数声明方式,可以更简洁地定义函数。

const add = (x, y) => x + y;

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

let a = ()=>{

alert(1);

}

a();

3.模板字符串

模板字符串可以用来更方便地拼接字符串。

const name = "孙悟空";

console.log(`Hello, ${name}!`); // Hello, 孙悟空!

4.解构赋值

解构赋值可以用来快速地从数组或对象中提取值并赋给变量。

const arr = [1, 2, 3];

const [a, b, c] = arr;

console.log(a, b, c); // 1 2 3

const obj = {x: 1, y: 2, z: 3};

const {x, y, z} = obj;

console.log(x, y, z); // 1 2 3

5.默认参数

函数可以设置默认参数,当调用函数时没有传入该参数时,会使用默认值。

const greet = (name = "World") => `Hello, ${name}!`;

console.log(greet()); // Hello, World!

console.log(greet("Alice")); // Hello, Alice!

6. 扩展运算符

扩展运算符可以用来将数组或对象展开成一系列参数。

eg6:

const arr1 = [1, 2, 3];

const arr2 = [4, 5, 6];

const arr3 = [...arr1, ...arr2];

console.log(arr3); // [1, 2, 3, 4, 5, 6]

const obj1 = {x: 1, y: 2};

const obj2 = {z: 3};

const obj3 = {...obj1, ...obj2};

console.log(obj3); // {x: 1, y: 2, z: 3}

7. 类和继承

ES6引入了class关键字来定义类和继承关系。

class Animal {

  constructor(name) {

    this.name = name;

  }

  speak() {

    console.log(`${this.name} makes a noise.`);

  }

}

class Dog extends Animal {

  speak() {

    console.log(`${this.name} barks.`);

  }

}

const d = new Dog("Rex");

d.speak(); // Rex barks.

8.Promise

Promise是一种新的异步编程方式,可以更方便地处理异步操作,解决地狱回调非常好用。

const wait = (ms) => new Promise(resolve => setTimeout(resolve, ms));

wait(1000).then(() => console.log("1 second passed."));

resolved [成功后调用]

rejected [失败后调用]

Promise的状态只有这 2 种, 且一个 promise 对象只能改变一次

const promise = new Promise((resolve, reject) => {

setTimeout(function() {

var data = {

retCode: 0,

msg: '啊哈'

};

// 接口返回的数据

if (data.retCode == 0) { //如果状态为0则成功

// 接口请求成功时调用

resolve(data);

} else { //状态不为0则失败

// 接口请求失败时调用

reject({

retCode: -1,

msg: '略略略'

});

}

}, 100);

});

promise.then(data => {

// 从 resolve 获取正常结果

console.log(data);

}).catch(data => {

// 从 reject 获取异常结果

console.log(data);

});

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • ES6、ES7、ES8特性一锅炖(ES6、ES7、ES8学习指南) 概述 ES全称ECMAScript,ECMAS...
    李振亚_cb74阅读 418评论 0赞 0
  • - ECMAScript 与 Javascript - ECMAScript的发展过程 - ECMAScript2...
    爵迹01阅读 374评论 0赞 1
  • let和const命令 var:声明变量,更多的是全局作用域,存在变量提升 let:声明变量,存在于块级作用域,不...
    zhangivon阅读 2,581评论 1赞 13
  • CSS3 新特性 border-radius:圆角边框 box-shadow:盒子阴影 background-si...
    林之之阅读 448评论 0赞 0
  • ES6 新特性 ES6 新特性 一ES6简介 二块级作用域绑定1 let声明2 const声明Constant D...
    _无为_阅读 965评论 0赞 3

友情链接更多精彩内容