扩展运算符
是ES6 新增的一个特殊的运算符，也称Rest运算符.能够简化一些针对数组和对象的复制和合并、展开等操作。
语法
...变量名变量名保存数据类型的不同，扩展运算符会有不同的效果
数组中的应用
- 合并数组
var arr = [1,2,3,4];
var arr2 = [5,6,7,8];
传统:
var newArr = arr.concat(arr2);
扩展运算符：
var newArr = [...arr,...arr2];
- 复制数组
var arr = [1,2,3,4];
var newArr = [...arr];
newArr.push(5);
console.log(newArr);[1,2,3,4,5];
- 在数组api中的应用
//push
var arr = [1,2,3,4];
var arr2 =[5,6,7,8,9];
arr.push(...arr2);
console.log(arr);[1,2,3,4,5,6,7,8,9]
- 将dom标签的类数组对象转换为真正的数组
若变量存储的数据类型为数组，可以直接展开使用
对象中的使用
- 合并对象
var obj1 = {
name:'张三',
age:13,
sex:'男'
};
var obj2 = {
address:'中国四川',
phone:"1399999999"
};
var newObj = {
...obj1,
...obj2
}
- 复制对象
var obj1 = {
name:'张三',
age:13,
sex:'男'
};
var obj2 = {
...obj1
};
console.log(obj2);
在对象中需要使用{} 包裹并展开 {…property}
函数中的应用
作为形式参数：将所有的实际参数组合成一个数组
function demo(...arr){ console.log(arr); } 传递了5个参数 demo(1,2,3,4,5)作为实际参数：将数组里的每个数据都作为一个实际参数
function demo(arr){ console.log(arguments); } var array = [1,2,3,4]; demo(...array); //等同于 // demo(1,2,3,4);
字符串中的应用
展开字符串
var str = 'abcde'; var arr = [...str]; console.log(arr); //等同于 console.log(str.split(''));
- 一般来说，无论是数组或对象，扩展运算符的作用就是展开其里面的内容
- 在函数中作为形式参数，会把所有的实际参数合并成一个数组
解构赋值
是ES6新增的特性。可以用来对数据(一般指对象或数组)进行解构，按照一定语法，将解构的数据快速赋给不同的变量。
数组中的应用
对数组进行解构，并把数组中的 数据赋给变量
let [变量名1,变量名2,变量名n]= 数组 //按照数组对应的下标将数据赋给对应位置的变量 let arr2 = [1,2,[3,4]]; let [num1,num2,num3]=arr2; // num1:1 num2:2 num3:[3,4]
对象中的使用
//实例对象
let obj ={
username:"zs",
age:12,
sex:'男'
}
将对象中不同属性的值赋给不同的变量
let {属性名1:变量名1,属性名2:变量名2,属性名n:变量名n}=对象 let {username:uname,age:uage,sex:usex} = obj;会将对象中和变量同名属性的值赋给变量
let {变量名1,变量名2,变量名n} =对象 let {username,age,sex} =obj;
字符串中的应用
类似数组的对象都有一个length属性，因此还可以对这个属性解构赋值。
var str = "hello world"; let {length}=str; console.log(length,str.length);//11 11 字符串的属性
应用
处理请求时对返回的数据进行解构
$.ajax({ url:"https://www.fastmock.site/mock/bb4157f45a0b5ffdcb3f6d984517a6c0/woniuMovie/getAllMovies", success:function({movies}){ //解构赋值 console.log(movies); } })配合扩展运算符，获取剩余的数据
let [,...phone] = ['全班qq号','10086','10000','00777777']; console.log(phone);//['10086', '10000', '00777777']
Set
set集合是ES6所提供的自带去重的用于保存和管理多个数据的语法结构。类似于数组，但和数组有很大区别
特点
set集合自带去重
set集合没有下标
set集合内部会维护数据的插入顺序。即遍历set集合时，数据的遍历顺序跟插入顺序是一致的。
set集合底层是用map来实现的。
set对于数据的处理都是通过自带的api来操作。
语法
//1. 定义一个空的 set集合 let 变量名 = new Set(); //2. 定义带有默认数据的set集合 let 变量名 = new Set(数组); //会将数组里的数据插入到set中并去重。
相关API
添加数据
add()let s = new Set(); s.add(1).add(‘zs’).add(2).add(‘ls’).add(‘zs’);//支持链式调用删除数据
delete()let s = new Set(); s.add(1).add(2); s.delete(2); console.log(s);查找数据
has()- 判断set中是否有某个数据,返回一个布尔型数据
let s = new Set(); s.add(1).add(2); console.log(s.has(2));//true清空数据
clear()set集合变量名.clear();获取长度
sizeset集合变量名.size遍历
set集合变量名.forEach((value)=>{ console.log(value) });应用
数据去重
set集合和数组的之间的转换
数组转为set集合
let setobj=new Set(数组名)；set集合转为数组
let arr = [...set集合变量名];//使用扩展运算符
Map
ES6新增的用于保存多个键值对数据的语法结构，简称map集合。
键值对：指的一个数据以名字->数据的模式来描述。 比如姓名->张三 。姓名就是键，张三就是值。
特点
- map集合的每个数据都是一个
键值对. - map集合的每个数据里的键是唯一的，不允许重复，重复添加同一个键，会将以前的值给覆盖掉。
- map是通过键来访问对应的数据
- map没有下标。
- map也是通过
api来完成键值对的 操作
定义map集合
//1. 定义一个空的map集合
let 变量名= new Map();
//2. 定义带有默认数据的map集合
let 变量名 = new Map(二维数组);
map对应API
添加、修改数据
map集合变量名.set(key,value); //例子： let m = new Map(); m.set('name','张三'); m.set('age',12).set('sex','男');如果重复添加同一个键，该键所对应的数据会被后添加的给覆盖（修改）
通过键删除数据：
delete(key)map集合变量名.delete(key);通过键查找是否存在某数据：
has(key)返回布尔值map集合变量名.has(key);通过键来查找对应的值：
get(key)map集合变量名.get(key);清空：
clearmap集合变量名.clear();获取长度
map集合变量名.size遍历
map集合变量名.forEach((value,key){ console.log(value,key) });
严格模式
背景
- 在JavaScript中，不写var和写var表现什么不同？？？
- 如果没有用var 声明，那么程序会直接将该变量作为全局变量。会导致变量定义混乱，并且会额外占用全局资源
- 一个良好的编程，无论是否是全局变量或其他的语法，都应该遵守一个严格的规则。
概念
- 严格模式时JavaScript1.8(后续是ES3)引入的一种可选的模式。该模式下修复了JavaScript设计的一些不合理 的地方。但是当时JavaScript已经普及了，所以为了照顾以前的版本，所以严格模式只是可选，而不是必须。
使用
如何触发严格模式
"use strict";一般写在当前作用域的第一行，会将当前的作用域作为严格模式来执行
严格模式的作用
- 消除非严格模式下的一些不合理的地方
- 让代码编写更加规范
- 提高程序运行速度
主要内容
变量必须声明
"use strict"; var a=1; b=a;//报错变量名不允许使用关键字
"use strict"; var while = 1;//报错不允许删除全局变量或函数
var a= 1; delete a;//报错this指向问题
function demo(){ "use strict"; console.log(this);//undefined }
