ES6-ES10

ES6

• let&&const
• delete 全局变量不能删除，用var 定义的全局变量不能删除；没有用var 定义的可以用delete 删除，是定义到window上的属性,不是正真意义上的全局变量，不管是在函数内部还是函数外部
• this作用域 动态作用域
• bind call apply的区别
• 用var定义的全局变量a可以用window.a访问，用let定义的全局变量c不可以用window.c访问；用var定义的变量可以重复定义，let定义的变量不可以重复定义
• let 定义的变量是有作用域，没有变量提升，不可以重复定义
• const具有let的特点，必须定义时赋值，且不能修改，是常量
• js的词法作用域与动态作用域 作用域链 this关键字

数组

• es5数组遍历有几种？优势和缺点？

1、for支持break，continue 2、forEach不支持break，只能遍历到结束 3、every()
arr.every(function(item){//只输出一个
  console.log(item)
})// every遍历数组能不能继续遍历取决于返回值，默认是false，只遍历一次，要想遍历所有元素，只能返回true；
arr.every(function(item){
  if(item===2){
    return false;
  }
  console.log(item);
  return true;
})
//数组是对象的一种
4、for in//遍历object遍历;可以遍历数组，但是会有瑕疵，主要是数组的下标是任意的，arr.a = 8, 支持break和continue,但是注意获取的index是字符串；输出键；遍历常规数据结构，比如数组、对象
  var a = {
    name: '111',
    age: '222'
  }
  for(let i in a){
    console.log(i)//输出 name age
  }
 for(let index in arr){
   if(index == 2){
     continue;
   }
   console.log(index, arr[index])
 }

* ES5中遍历数组的7个方法 
* 1. forEach
* 2. map (映射)  有返回值(数组),  个数和之前的一样，返回处理后的值
* 3. filter (过滤)  有返回值(数组) 个数和之前的可能不一样  
* 
* 判断
* 4. some  判断是否有一个以上(>=1)满足条件的 true/false
* 5. every 判断是否都满足条件.  true / false
	  
* 查找
* 6. find : 查找满足条件的的一个元素 (找不到undefined)
* 7. findIdex : 查找满足条件的一个索引

• 对象是否可遍历
• es6 遍历方法

1、for of遍历 //输出值
var a = {
    name: '111',
    age: '222'
  }
for(let i of a ) {// 遍历object或其他数据结构(自定义)，
  console.log(i)//输出111 222
}

• es6允许自定义数据结构 可以用for of遍历
• ES5将伪数组转成数组

1、let arrs = [].slice.call(arguments);//将arguments转成数组,arguments是以个伪数组

• es6将伪数组转成数组

1、Array.from(arguments);//将伪数组转数组
Array.from(arrLike,mapFn,thisArg);//三个参数，第二个是遍历函数，如果第三个参数存在，第二个函数的this就指向它

let arr = Array.from({length: 5}, function() {return 1;})//初始化一个长度为5的数组，初始值为1

let arr = Array(5)//初始化数组长度为5

• es5如何创建一个新数组

1、let array = []//不能指定长度，除非填充数值 
2、let arr = Array(5);//可以用for循环初始化数值

• es6如何创建新数组

1、let arr = Array.from({length: 5}, function() {return 1;})//初始化一个长度为5的数组，初始值为1
2、(Array.prototype.of)查MDN 
let arr = Array.of(1,2,3,4,5);//生成数组，可以接受一个或多个参数
3、(Array.prototype.fill);//填充数组
let arr = Array(5).fill(1);//生成一个长度为5的数组，并填充1
Array.fill(value,start,end);//从start开始填充，不包括end

• ES5如何查找一个元素

1、通过遍历查找
2、var arr = [];
let find = arr.filter(function(item){//将所有满足条件的元素返回，不是高效的
  return item%2 === 0;
});

• es6新增查找方法

1、let find = arr.find(function(item){//查找 但是只执行一次,只查找满足条件的第一个值
  return item%2 === 0
});
2、查找位置 Array.prototype.findIndex()//查找位置,只查找满足条件的第一个值
let index = arr.findIndex(function(item){
  return item === 2;
})

document.querySelector(’.red’);//NodeList可以遍历

• es5如何声明一个类 操作属性

let Aminal = function(name, age){
  this.name = name;
  this.age = age;
 // this.eat = function(){//不建议写在这里面 实例方法
   // console.log('吃饭');
  //}
}
Animal.say = function(){//静态方法
  console.log('哈哈哈')
}
Animal.prototype.eat = function(){//函数复用，原型链继承 实例方法
  console.log('吃饭')
}
let dog = new Aminal('dog',3);
console.log(Animal.say());
//所有的公用的东西(函数)，放在prototype上，不放在函数体上
//独用的东西放在函数体上

//继承
let Dog = function(){//继承父类部分属性
  Animal.call(this,'dog');//初始化父类的构造函数，执行父类的造函数传参
}
Dog.prototype = Animal.prototype;
Dog.prototype.constructor

• es6如何声明一个类 操作属性

class Animal {
  let _age = 4;//私有属性private
  constructor(name){
    this.name = name;//public属性
  }
  eat(){//各自的方法 
    console.log(this.name+'吃饭')
  }
  static say(){//静态方法
    console.log('aaa')
  }
  get age(){
    return _age;
  }
  set age(val){
    _age = val;
  }
  
}
let dog = new Animal();
console.log(dog.age);
console.log(dog.eat())
console.log(Animal.say())
dog._age;//获取不到值，私有属性获取不到
class声明的类属于function
> es6的getter与setter

//继承
class Cat extends Animal {
  constructor(name){
    super(name); 
  }
}

• ES6函数参数默认值

function f(x = 1, y = 2, z=x+y){//若是不传参数，默认值x=1,y=2
    console.log(f.length);//输出的是没有默认值的参数的数量??arguments呢？
}
f(1,undefined, 2);//传undefined就会默认值

• ES5函数参数默认值

function f(x, y, z){
  x= x || 1;
  y = y || 2;
}
console.log(f(,,2);

• es5如何处理不确定参数：使用arguments

function sum(){
  let num = 0;
  // ES5写法
  Array.prototype.forEach.call(arguments,function(item){
    num+=item;
  })
  // ES6写法
  Array.prototype.from(arguments).forEach(function(item){
    num+=item;
  })
}
console.log(sum(1,2,3))

• es6不让使用arguments获取不定参数 ,改用参数剩余法

function sum(base,...nums){
  let num = 0;
  nums.forEach(function(item){
    num+=item
  });
  return base*2+num;
}
console.log(sum(1,2,3,4,5));
let data = [1, 2, 3];
> console.log(sum(...data));
> console.log(sum.apply(this,data));

• es6中的箭头函数

let say = () => {
  console.log('哈哈哈哈')
}
say();

• es6 Object属性能简写吗？

 let x = 1, let y = 2; let z = 3;
let obj = {
  'x': x,
  y,//属性简写
  [z + Y]: 6,//特殊写法，属性值支持遍历与表达式
  * hello(){//用*表示异步方法
    console.log('hello');
  },
  say(){
    console.log('哈哈')
  }
}
function *hello(){//generator函数 简写成*
  
}

• es6 Set数据结构

set数据唯一，不允许重复
let s = new Set([1,2,3,4]);将数组转成set结构
s.add('hello');//添加数据
s.add('1').add(2);//支持级联操作
s.delete('hello')//删除指定数据
s.clear();//清空数据

s.has('hello');//判断set是否含有输入的数据
s.size;//获取有多少项数据
遍历：
s.keys();//输出键
s.values();//输出值
s.entries();//输出键跟值
s.forEach( item => {
  console.log(item);//遍历
})
for(let i of s){
  console.log(i);//输出值
}
set没有提供修改数据的方法，若要修改必须先删除在修改
数组去重：
let arr = [1, 2, 3, 5, 2, 1];
arr = Array.from(new Set(arr));或arr = [...new Set(arr)]

• ES6 map数据结构(必须是key value形式)

let map = new Map([[1, 2], [3, 4]);
其中1跟3是键，2、4是值
map.set(5, 6);//5是键，6是值，添加数据
map.clear();//清空数据
map.set(1, 3);//修改数据，只要键值存在
map.delete(3);//删除数据，根据键来删除
map.keys();//输出所有键
map.size;//获取数据条数
map.has(3);//查找键值是否有3；
map.get(1);//获取索引为1的值
map.values();//输出所有值
map.entries();//输出所有键跟值
map.forEach((value, key) => {//遍历，注意第一个参数是值
    console.log(value, key);
});
for(let [key, value] of map){//遍历
    console.log(key, value)
}
// map的键值(key)是任意的, 
let o = function(){
    console.log('0');
}
map.set(o, 2);
//键的顺序：按照初始化的顺序来遍历，不是按照键值大小
// map一般比object性能好一点(大家认为) 

• es5对象复制到另一个对象(对象拷贝)

遍历再拷贝，深度拷贝

• es6 复制对象

const target = {}
const source = {b: 4, c: 5}
const source1 = {d: 3, e: {f: {g: 5}}}
Object.assign(target, source);//将source数据拷贝到target,soouce后面还可以有参数，都把他复制到target上
Object.assign(target, source, source1);//有缺陷，可以拷贝复杂数据，如果target目标对象为空； 如果target目标对象不为空，源对象会覆盖目标对象，将目标对象的数据都被删除了
Object.assign();//是浅复制，如果是值类型，就值替换，如果是引用类型，就将引用地址替换
？？如果目标对象或源对象传入undefined或null会怎样，
？？如果目标对象是个嵌套对象，子对象的属性会被覆盖吗？
WeakSet,WeakMap()??基本一样，api一样，
WeakSet只允许接收对象，WeakMap只允许接收对象类型的key

• es6中的y修饰符是什么含义？es5支持y修饰符吗？

let str = 'aaa_aaa_a';
const reg = /a+/g;
const reg2 = /a+/y;
console.log(reg.exe(str));//从0开始匹配
console.log(reg2.exe(str));//第一次结果一样

console.log(reg.exe(str));//从4开始匹配
console.log(reg2.exe(str));//结果为null 
y表示sticky，粘连的意思，从当前字符串条到下一个断开的位置开始，比如空格隔开的
？？es5如何在正则中处理中文字符，如果是多个字节呢？可以使用unicode编码匹配，但是不能匹配多个字节
？？es6有什么高招？

• es5如何在正则中处理中文字符，如果是多个字节呢？

可以使用unicode编码匹配，但是不能匹配多个字节

• es6如何处理多字符字节识别？

使用u修饰符  能识别\uffff以上的字符
吉的异性字：