ES6新增

最新推荐文章于 2023-04-14 17:36:24 发布

buleRainbow

最新推荐文章于 2023-04-14 17:36:24 发布

阅读量392

点赞数 1

分类专栏： Vue 文章标签： javascript es6 vue.js

本文链接：https://blog.csdn.net/hrj970808/article/details/109605071

版权

Vue 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

字符串新增

模板字符串：``
模板字符串中嵌入变量，需要将变量名写在${}之中： `${}`
includes()：返回布尔值，表示是否找到了参数字符串。
startsWith()：返回布尔值，表示参数字符串是否在原字符串的头部。
endsWith()：返回布尔值，表示参数字符串是否在原字符串的尾部。

对象新增

Object.assgin()方法：
    Object.assign({},obj,obj1);对象
    Object.assign([],obj,obj1);数组
特点：浅拷贝、对象属性的合并
属性的简洁表示法：
	ES6 允许在大括号里面，直接写入变量和函数，作为对象的属性和方法。这样的书写更加简洁。
代码：	 
	const obj = {foo}
	// 等同于
	const obj = {foo: foo};

函数新增

箭头函数：
fn((i,k)=>{})
简洁语法
let a = i => ()
函数默认值：
fn((i=1,k=2)=>{})
箭头函数this指向：
箭头函数没有自己的 this，当在内部使用了 this时，它会指向最近一层作用域内的 this
rest 参数：
ES6 引入 rest 参数（形式为...变量名），用于获取函数的多余参数，这样就不需要使用arguments对象了。rest 参数搭配的变量是一个数组，该变量将多余的参数放入数组中。

数组的新增扩展

数组新增 API from、of、isArrar
扩展运算符：
	扩展运算符（spread）是三个点（...）。它好比 rest 参数的逆运算，将一个数组转为用逗号分隔的参数序列。
该运算符主要用于函数调用。
扩展运算符后面还可以放置表达式
如果扩展运算符后面是一个空数组，则不产生任何效果。
注意，只有函数调用时，扩展运算符才可以放在圆括号中，否则会报错。
扩展运算符的应用：
（1）复制数组
（2）合并数组
（3）与解构赋值结合
（4）字符串：扩展运算符还可以将字符串转为真正的数组。
数组实例的 find() 和 findIndex()方法：
	数组实例的find方法，用于找出第一个符合条件的数组成员。它的参数是一个回调函数，所有数组成员依次执行该回调函数，直到找出第一个返回值为true的成员，然后返回该成员。如果没有符合条件的成员，则返回undefined。
    数组实例的findIndex方法的用法与find方法非常类似，返回第一个符合条件的数组成员的位置，如果所有成员都不符合条件，则返回-1。
数组实例的 entries()，keys() 和 values()方法：
	ES6 提供三个新的方法——entries()，keys()和values()——用于遍历数组。它们都返回一个遍历器对象，可以用for...of循环进行遍历，唯一的区别是keys()是对键名的遍历、values()是对键值的遍历，entries()是对键值对的遍历。

基本数据类型Symbol

	ES6 引入了一种新的原始数据类型Symbol，表示独一无二的值。它是 JavaScript 语言的第七种数据类型，前六种是：undefined、null、布尔值（Boolean）、字符串（String）、数值（Number）、对象（Object）。

Set 和 Map 数据结构

	ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。
	Set本身是一个构造函数，用来生成 Set 数据结构。
	Set函数可以接受一个数组（或类似数组的对象）作为参数，用来初始化。
	Map结构提供了“值—值”的对应，是一种更完善的Hash结构实现。如果你需要“键值对”的数据结构，Map比Object更合适。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键。

变量的解构赋值

	ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构
数组的解构赋值：let [a, b, c] = [1, 2, 3];
对象的解构赋值：let { foo, bar } = { foo: 'aaa', bar: 'bbb' };
字符串的解构赋值：const [a, b, c, d, e] = 'hello';
数值和布尔值的解构赋值：
	解构赋值时，如果等号右边是数值和布尔值，则会先转为对象。
	let {toString: s} = 123;
    s === Number.prototype.toString // true
    let {toString: s} = true;
    s === Boolean.prototype.toString // true
函数参数的解构赋值：
	function add([x, y]){
      return x + y;
    }
    add([1, 2]); // 3
    上面代码中，函数add的参数表面上是一个数组，但在传入参数的那一刻，数组参数就被解构成变量x和y。对于函数内部的代码来说，它们能感受到的参数就是x和y。

let 和 const 命令

let 命令：
	ES6 新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。
const 命令：
    const声明一个只读的常量。一旦声明，常量的值就不能改变。
块级作用域：
    ES5 只有全局作用域和函数作用域，没有块级作用域，这带来很多不合理的场景。
ES6 的块级作用域：
    let实际上为 JavaScript 新增了块级作用域。

async 函数

	Async 和 await 是一种同步的写法，但还是异步的操作，两个内容还是必须同时去写才会生效不然的话也是不会好使，而且 await 的话有一个不错的作用就是可以等到你的数据加载过来以后才会去运行下边的 js 内容，而且 await 接收的对象必须还是个 promise 对象，如果是接收数据的时候就可以直接用一句话来接收数据值，所以这个 async await 我的主要应用是在数据的接收，和异步问题的处理，主要是还是解决不同执行时机下的异步问题！
写法：
async Fn()){
    let data = await Ajax ()
    console.log(data);
}