ES6简单理解基本使用

let const

  • 原来的var声明标识符:可以重复声明,编译不报错.
  • let,const声明标识符:不能重复声明,再声明编译报错.
  • var声明的标识符作用域是当前函数,let和const是当前{块}.
  • const声明的标识符不能再被赋值,也就是常量.

解构赋值

ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构.
本质上,这种写法属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值。
具体语法简单而繁杂就不一一赘述了,重点记一下用途吧.以后碰到记得用

交换变量的值

let x = 1
let y = 2
[x,y] = [y,x]

从函数返回多个值

//返回一个数组
function 函数(){
	return [1,2,3]
}
let [x,y,z] = 函数()
//返回一个对象
function 函数(){
	return {
		属性一的标识符:1,
		属性二的标识符:2
	}
}
let [属性一的标识符,属性二的标识符] = 函数()

函数参数的定义

//参数是一组有次序的值
function 函数([x,y,z]){...}
函数([1,2,3])
//函数是一组无序的值
function 函数({x,y,z}){...}
函数({z:3,y:2,x:1})

提取JSON数据

let jsonData = {id:42,status:"OK",data:[867,5309]}
let {id,status,data:number} = jsonData
//number === [867,5309]

函数参数的默认值

jQuery.ajax = function (url, {
  async = true,
  beforeSend = function () {},
  cache = true,
  complete = function () {},
  crossDomain = false,
  global = true,
  // ... more config
} = {}) {
  // ... do stuff
};

输入模块指定方法

const {sin,cos} = Math
const {函数名,函数名} = require('模块')

遍历map结构

...

函数的扩展

  1. 可以指定默认值
//解构赋值的默认值和参数默认值结合
function 函数(url,{body = '',method = 'GET'} = {}){...}
function 函数(url,{body ,method } = {body = '',method = 'GET'}){...}//这个有问题,注意和上一个的区别
  1. rest参数
functio 函数(...参数组){
	console.log(typeof 参数组)//数组
}
  • rest参数只能放到最后,否则报错
  • 函数的length不包括rest参数
  • 可以代替arguments使用,arguments不是数组有时候不方便.
  1. 尾调用优化,尾递归优化
    ...

扩展运算符和剩余参数

上代码:
复制数组和对象

let 数组1 = ['苹果','橘子','香蕉']
let 数组2 = [...数组1]
console.log(数组1 === 数组2)//false
let 对象1 = {name:'李华',age:'12'}
let 对象2 = {...对象1}

数组去重

let 数组1 = ['苹果','橘子','香蕉','苹果']
let 数组2 = [...new Set(数组1)]

合并数组

let 数组1 = ['西瓜','苹果']
let 数组2 = ['桃','香瓜','橘子']
let 数组3 = [...数组1,...数组2]//[ '西瓜', '苹果', '桃', '香瓜', '橘子' ]
let 数组4 = [...数组2,...数组1]//[ '桃', '香瓜', '橘子', '西瓜', '苹果' ]
console.log(数组3)
let 对象1 = {name='李华',age='13'}
let 对象2 = {爱好:'学习'}
let 对象3 = {...对象1,...对象2}
let 对象4 = {...对象1,...对象2,...{name:'小明'}}//{ name: '小明', age: '13', '爱好': '学习' }相同的键名会导致后面的覆盖前面的

调用函数时

let 函数 = (x,y,z)=>{console.log(x,y,z)}
let 数组 = [1,2,3]
函数(...数组)//把数组展开传参

函数声明时形参前加上...

let 函数 = function(...参数){
	console.log(typeof 参数)
}
函数(1,2,3,4)//数组[1,2,3,4]
不过只能写在最后
这种情况叫剩余参数rest,其实就是将此处开始的参数转换成一个数组。
function fn(x,y,z){
	let arg = [...arguments]
}

将伪数组转换成数组

[...document.querySelectorAll('div')]
[...'你好小伙砸']

Symbol

  1. Symbol表示独一无二的值,是第七种基本数据类型
let s = Symbol('描述字符串')//这里的描述字符串不影响Symbol,只是方便开发.
let ss = Symbol.for('全局Symbol的key,也作为对其的描述')//创建全局Symbol

console.log(Symbol.for('用户1') === Symbol.for('用户1'))//true
//先在全局Symbol注册表中查找key为'用户1'的Symbol,如果找到就反回这个Symbol,否则就创建一个全局Symbol
  1. Symbol的使用
    ...略

Set(集合)和Map(字典)数据结构

  1. 是一组键值对的结构,具有极快的查找速度.
    js中对象的数据结构也是字典,只不过对象的key必须是字符串或symbol,map的key可以是任意类型
    字典的key不能重复,如果重复放入key相同的键值对,会覆盖原来的value
let 字典 = new Map()//可以传入二维数组
字典.set('吃','eat')
字典.has('吃')
字典.delete('吃')
  1. Set对象是map键的集合,你可以按照插入的顺序迭代它的元素(好像和Python里的不一样),Set中的元素是唯一的.

...API略

异步编程

略.

class

语法糖,还是基于原型链,搞清楚prototype和__proto__就可以了

Promise

见下章...

posted @ 2020-12-04 19:29  丁同亚的博客  阅读(322)  评论(0编辑  收藏  举报