关于ES6,都有哪些新增,经常使用的有哪些,使用心得

ES6

1. 新增块级作用域 即(let,const)

let 声明的变量只在 let 命令所在的代码块内有效。
const 声明一个只读的常量,一旦声明,常量的值就不能改变。
且let和const不存在变量提升,let的值可以改变,const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值
在 ES6 之前,JavaScript 只有两种作用域: 全局变量 与 函数内的局部变量。
const a ;//报错,一旦声明变量,应该立即赋值!!
const b = 2;
b = 3//报错,因为定义常量之后不能成重新赋值!!

3. 新增了定义类的语法糖(class)
4. 新增数据类型 (symbol)
5. 新增了变量的结构赋值(let {a} = {a:1})
解构赋值语法是一种 Javascript 表达式。通过解构赋值, 可以将属性/值从对象/数组中取出,赋值给其他变量。

let [a, b] = [10, 20];
console.log(a);
//  10
console.log(b);
// 20

6. 函数参数允许设置默认值 (fumction(a=1){}),引入了rest参数,新增了箭头函数(()=》{})
使用ES6箭头函数语法定义函数,将原函数的“function”关键字和函数名都删掉,并使用“=>”连接参数列表和函数体。
当函数参数只有一个,括号可以省略;但是没有参数时,括号不可以省略。
1). 箭头函数this为父作用域的this,不是调用时的this
箭头函数的this永远指向其父作用域,任何方法都改变不了,包括call,apply,bind。
普通函数的this指向调用它的那个对象。

2). 箭头函数不能作为构造函数,不能使用new

3). 箭头函数通过call和apply调用,不会改变this指向,只会传入参数

4). 箭头函数没有原型属性
7. 数组新增了Api,如IsArray、from、of 方法 ,数组实例新增了entries(),keys(),和values()等方法
8. 对象和数组新增了扩展运算符(…arr)
对象中的扩展运算符(…)用于取出参数对象中的所有可遍历属性,拷贝到当前对象之中

let bar = { a: 1, b: 2 };
let baz = { ...bar }; // { a: 1, b: 2 }

9. ES6 新增了模块化 (import、export)
在之前的javascript中是没有模块化概念的。如果要进行模块化操作,需要引入第三方的类库。随着技术的发展,前后端分离,前端的业务变的越来越复杂化。直至ES6带来了模块化,才让javascript第一次支持了module。ES6的模块化分为导出(export)与导入(import)两个模块。
在ES6中每一个模块即是一个文件,在文件中定义的变量,函数,对象在外部是无法获取的
当外部需要读取模块当中的内容,就必须使用export来对其进行暴露。
默认导出(default export)
一个模块只能有一个默认导出,对于默认导出,导入的名称可以和导出的名称不一致。

export default function(){
    return "默认导出一个方法"
}

可以将所有需要导出的变量放入一个对象中,然后通过default export进行导出

let res = {a:1}
export default res 

如果导入的多个文件中,变量名字相同,即会产生命名冲突的问题,为了解决该问题,ES6为提供了重命名的方法,当你在导入名称时可以这样做:

import {myName as name} from "./test.js";

10. 新增了Set和Map数据结构(arr.Set(),arr.map())
Set类似于数组,但是成员的值都是唯一的,没有重复。使用new Set()创建Set实例
Map类似于对象,但是键的范围不限于字符串,各种类型的值都可以作为键值。使用new Map()创建Map实例
11. 原生提供Proxy构造函数 用于生成Proxy实例(var proxy = new Proxy(target, handle);)
12. 新增了生成器(Generator)和遍历器(Iterator)

猜你喜欢

转载自blog.csdn.net/t5_5_5_5_5_7_7/article/details/109602195
今日推荐