ES6---基础知识3

1、箭头函数内部的this

（1）箭头函数里面没有自己的this，而是引用外层的this。

在对象内部，自定义的方法中，不是使用箭头函数时，this指向的是当前使用的他的对象（指向他的对象）

let obj = {
    username : "zs",
    //say,  //属性简写 say : say
    say(){     //指向当前的js的模块对象，每一个js文件就是一个模块
                console.log(this);
            },
    objSay(){
        console.log(this);
    },
    objSayLj :(function (){
        console.log("+++++",this);//指向当前的global对象
        return () => console.log("+++++",this);//指向global对象
    })(),
    objSayLj2 : ( () => {
        console.log("-------",this);  
        return () => console.log("-------",this);
    })()
}
//指向当前的js的模块对象，每一个js文件就是一个模块
obj.say();

//在对象内部，自定义的方法中，不是使用箭头函数时，this指向的是当前使用的他的对象（指向它的对象）
obj.objSay();

//在对象内部定义一个立即执行函数 ，因为立即执行函数不依赖任何东西，依赖global对象，所以this指向的是global对象
obj.objSayLj();

//在对象
obj.objSayLj2();

（2）不能作为构造函数

2、箭头函数内部的arguments

（1）当使用箭头函数来打印或使用arguments的时候，并不能准确的找到想要的实参函数，因为使用箭头函数时，虽然有arguments ,但不会保存实参

let test  = (a,b) => console.log(arguments);
function test(a,b){
    console.log(arguments);
}

（2）解决方法：可以使用…rest函数接受实参

let test = (...temp) => console.log(temp);
test(1,2,23,4,3);

3、数组扩展

（1）Array.from()

用于将两类对象转为真正的数组：类似数组的对象（array-like object）和可遍历（iterable）的对象（包括ES6新增的数据结构Set和Map

let  str = "helolo";
console.log(Array.from(str));

（2）Array.of()

用于将一组值，转换为数组。这个方法的主要目的，是弥补数组构造函数Array()的不足。因为参数个数的不同，会导致Array()的行为有差异。

let result = new Array(20);  //[ <20 empty items> ]
let result = Array.of(20);   //[ 20 ]

4、数组扩展的实例方法

（1）find()

用于找出第一个符合条件的数组成员；符合条件的返回元素，不符合的返回undefined

let result = arr.find((item) => item>10);
console.log(result);

（2）findIndex()

返回第一个符合条件的数组成员的位置，符合条件的返回元素的位置，不符合的返回-1

let result1 = arr.findIndex((item) => item>10);
console.log(result1)

（3）fill()

填充数组

let arr = [1,2,34,2,12];
console.log("填充前",arr);
arr.fill(10);
console.log("填充后",arr);

（4）includes()

该方法返回一个布尔值，表示某个数组是否包含给定的值，与字符串的includes方法类似

let arr = [1,2,34,2,12];
console.log(arr.includes(10));

5、数组实例的遍历

（1）keys()—是对键名的遍历

（2）values()—是对键值的遍历

（3）entries()—是对键值对的遍历。

let arr  = [123,4,2,5,2];
let keys = arr.keys();
let values = arr.values();
let entries = arr.entries();
console.log(keys,values,entries);

（4）使用for-of 遍历迭代器对象

遍历通过keys（）生成的 [array Iterator]
遍历values
遍历entries

for(let key of keys){
    console.log(key);
}

for(let value of values){
    //console.log(value);
}

for (let [index,item] of entries){
    //console.log(index,item);
}

（5）使用forEach()方法

let arr  = [123,4,2,5,2];
arr.forEach(function(item,index){
    console.log(index,item);
})

一、SET、MAP、Promise的操作

1、创建Set集合实例

Set 本身是一个构造函数，用来生成 Set 数据结构。 Set 结构不会添加重复的值

2、Set的属性以及方法

（1）add(value)

添加某个值，返回Set本身

//使用构造函数创建Set
let set = new Set();
set.add(10);
set.add(10);
set.add("hrloo");
set.add("hrloo");//会自动除重

（2）delete（value）

删除某个值，返回一个布尔值，表示删除是否成功

let set = new Set();
set.delete(10);
console.log(set.delete(10));

（3）has(value)

返回一个布尔值，表示该值是否为Set的成员

let set = new Set();
console.log(set.has(10));

（4）clear()

清除所有成员，没有返回值

let set = new Set();
set.add(10);
set.clear();

（5）keys()

返回键名的遍历器

let keys  = set.keys();
console.log(keys);

（6）values()

返回键值的遍历器

let values  = set.values();
console.log(values);

（7）entries()

返回键值对的遍历器

let entries  = set.entries();
console.log(entries);

（8）使用for-of 进行遍历

//keys()
for(let key of keys){
    console.log(key);
}
//values()
for(let value of values){
    console.log(value);
}
//entries
for(let entrie of entries){
    console.log(entrie);
}

（9）forEach()

使用回调函数遍历每个成员

set.forEach(function(value,key,set){
     console.log(value,key,set);
})
 console.log(set);

（10）size()

数组的去重复

let arr2 = [23,2,3,3,4,2,1,54,3];
let set2 = new Set(arr2);
console.log(set2);
console.log(typeof set2);

let setArray = [...set2];
console.log(setArray);
console.log(typeof setArray);

3、Map

（1）add(value)

添加某个值，返回Set结构本身

let map=new Map();
map.set("test","hello");
let obj = {name : "zs"}
map.set(obj,"worlf");
// Map { 'test' => 'hello', { name: 'zs' } => 'worlf' }
//map解构是一个key值指向一个value值，但是这里的=>不是箭头函数；而是key值指向value值

//这里又放入了一个值，但是与之前的key值相同，会覆盖value值，进行更新
//如果key值有了值，则键值会被更新，否则生成该键值
map.set("test",{});

（2）get(key)

get方法读取key对应的键值，如果找不到key，返回undefined

console.log(map.get("test"));
console.log(map.get(obj));

（3）has(key)

has方法返回一个布尔值，表示某个键是否在当前 Map 对象之中

console.log(map.has("test"));

（4）delete(key)

delete方法删除某个键，返回true。如果删除失败，返回false

map.delete("test");

（5）clear()

清除所有成员，没有返回值

map.clear();

（6）size() 获取元素个数

console.log(map.size);

（7）keys()

返回键名的遍历器

let keys = map.keys();
console.log(keys);

（8）values()

返回键值的遍历器

let values = map.values();
console.log(values);

（9）entries()

返回键值对的遍历器

let entries = map.entries();
console.log(entries);

（10）forEach()

使用回调函数遍历每个成员

//keys
for(let key of keys){
    console.log(key);
}

//value
for(let value of values){
    console.log(value);
}

//entries
for(let entire of entries){
     console.log(entire);
}

（11）forEach

map set 只有forEach方法，没有其他数组的方法 filter等

map.forEach(function(value,key,map){
    console.log(value,key,map);
})

4、Iterator

遍历器/迭代器
主要为for-of 提供，set和map的keys，values，entries以及数组的keys,values,entries也是迭代方法

//获取到一个遍历对象 对遍历器进行操作
let values = set.values();
console.log(values);

// values有没有next()的方法
console.log(values.next()); //{ value: 23, done: false }
//使用next（）方法 一次取值
console.log(values.next());  //{ value: 5, done: false }
console.log(values.next());  //{ value: 65, done: false }
console.log(values.next());  //{ value: 2, done: false }
console.log(values.next());  //{ value: undefined, done: true }