es6测试题！

1.let const var的区别

1. 作用域规则
    let和const 声明的变量 形成 块级作用域，在块级作用域下起作用， var 声明的变量 在 全局作用域或者局部作
    用域 下 起作用
2. 是否存在变量提升
    let 和 const 不存在变量提升， var存在变量提升（在声明之前可以使用）
3. 是否可以重复声明 和 是否可以重复赋值
    var 可以重复声明，也可以重复赋值
    let和const 都不可以重复声明，而 let可以重复赋值，const不可以重复赋值
4. 暂时性死区
    let 和 const存在暂时性死区（let和const声明之前的
区域都称为暂时性死区），而var不存在

2. ECMAScript 和 JavaScript 的关系

ECMAScript 和 JavaScript 的关系是，前者是后者的规格，后者是前者的一种实现（另外的 ECMAScript 方言还有 JScript 和 ActionScript）。日常场合，这两个词是可以互换的。

该标准从一开始就是针对 JavaScript 语言制定的，但是之所以不叫 JavaScript，有两个原因。一是商标，
Java 是 Sun 公司的商标，根据授权协议，只有 Netscape 公司可以合法地使用 JavaScript 这个名字，且
JavaScript 本身也已经被 Netscape 公司注册为商标。二是想体现这门语言的制定者是 ECMA，
不是 Netscape，这样有利于保证这门语言的开放性和中立性。

3.定义变量的方式有几种 分别是什么

6种 var, let, const ,class ,function,import

4.块级作用域以及它的优势

let和const会形成块级作用域，只要含有{}(除了对象的{}之外) 都会形成块级作用域
优势：
1 外层代码块不受内层代码块的影响.
2 外层作用域无法读取内层作用域的变量。
3 内层作用域可以定义外层作用域的同名变量，而不受影响。
4 函数自执行 精简代码

5.箭头函数写法以及箭头函数的this与其他函数this的区别

箭头函数中的this指向定义它的地方（父级作用域），而不指向调用它的地方，此时 this为静态的
箭头函数中的this永远指向箭头函数所在父级作用域所属对象

注意： 1） 用let const var 定义的箭头函数 在全局环境下指向window 
2) 对象的字面量写法 不产生新的作用域
3） 箭头函数中的this不可以使用call apply  bind 改变
4） 构造函数 和 构造函数原型对象中的函数 如果用箭头函数依然只 window
5) 箭头函数中不含arguments

    1) 箭头函数不合适使用在 构造函数和原型对象的函数中
    2） 箭头函数不适合使用在 对象的方法 和 事件后绑定的函数
    3)  适合在闭包函数中使用
    4） 适合在数组方法的回调函数中使用
    5） 适合在计时器的回调函数中使用

6.定义person类 自定义属性和方法 定义一个student类继承person类

class Person{
    constructor(name,age,sex){
        this.name=name;
        this.age=age,
        this.sex=sex;
    }
    say(){
        console.log(this.name+'会说话');
    }
    run(){
        console.log(this.name+'会走路');
    }
    static isPerson(){
        cosnole.log('123');
    }
}
class Student extends Person{
    constructor(name,age,sex,score){
        super(name,age,sex);
        this.score=score
    }
    score(){
        console.log(this.name+'考了'+this.score)
    }
}

let s1=new Student('张三',18,'男',100);
let p1=new Person('李四',30,'男');

7.写出你对解构赋值的理解

解构赋值 ： 主要是针对数组和对象的解构 ， 可以看成是一种匹配模式 ，对其中的变量进行赋值是 对赋值运算符的一种扩展

优点： 在代码的书写上更加易读，语义更加清晰明了，方便从数组和对象中取数据
保持两边一致
	解构源 ： 等号右边
	解构目标 :  等号的左边

可以嵌套  可忽略
可以不完全解构
可以写默认值
可以交换变量
扩展运算符 剩余运算符  取数组中剩余的数据添加给一个变量, 此时应在元素的最后
可以解析字符串
对对象的操作  提取json数据

8.map结构和set结构的区别

Map 数据结构。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都
可以当作键。
Set 是es6 提供了新的数据结构。它类似于数组，但是成员的值都是唯一的，没有重复的值。
Set函数可以接受一个数组（或者具有 iterable 接口的其他数据结构）作为参数，用来初始化。

9.描述promise如何使用 举例说明

Promise对象是一个构造函数，用来生成Promise实例。
Promise构造函数接受一个函数作为参数，该函数的两个参数分别是resolve和reject。
resolve函数的作用是，将Promise对象的状态从“未完成”变为“成功”（即从 pending 变为 resolved），在异步操作成功时调用，并将异步操作的结果，作为参数传递出去；reject函数的作用是，将Promise对象的状态从“未完成”变为“失败”（即从 pending 变为 rejected），在异步操作失败时调用，并将异步操作报出的错误，作为参数传递出去。
Promise实例生成以后，可以用then方法分别指定resolved状态和rejected状态的回调函数。
then方法可以接受两个回调函数作为参数。第一个回调函数是Promise对象的状态变为resolved时调用，第二个回调函数是Promise对象的状态变为rejected时调用。这两个函数都是可选的，不一定要提供。它们都接受Promise对象传出的值作为参数。

10.设置一个person类 使得该类可迭代，可以使用for…of循环属性方法

class person{
            constructor(name,age){
                this.name=name;
                this.age=age;
            }
            show(){
                console.log(this.name);
            }
            [Symbol.iterator](){
                let props=Object.getOwnPropertyNames(this);
                console.log(props);
                let index=0;
                let that=this;
                return {
                    next(){
                        if(index<props.length){
                            let result= {value:that[props[index]],done:false}
                            index++;
                            return result;
                        }else{
                            return {value:undefined,done:true}
                        }
                    }
                }
            }
        }

11.es6提供的数组方法有哪些，分别是什么意思

Array.from()方法用于将两类对象转为真正的数组：类似数组的对象（
array-like object）和可遍历（iterable）的对象
（包括 ES6 新增的数据结构 Set 和 Map）。
Array.of()方法用于将一组值，转换为数组。
copyWithin() 将指定位置的成员复制到其他位置（会覆盖原有成员），然后返回当前数组。
target（必需）：从该位置开始替换数据。如果为负值，表示倒数。
start（可选）：从该位置开始读取数据，默认为 0。如果为负值，表示从末尾开始计算。
end（可选）：到该位置前停止读取数据，默认等于数组长度。如果为负值，表示从末尾开始计算。
forEach()  循环  没有返回值
findIndex()// 找出第一个满足条件的下标
fill() 用指定的值 将数组中的数据替换
keys() 获取数组中的每一项
//map() 映射 返回新数组 循环结束 每一项的返回值组成数组
 // some 遇真则停
 // every遇假则停

12.写出es6中module的导出文件和导入文件的写法

Export  let a=10
导出方式  三种  
分别暴露、export let a=10;
统一 暴露、export {obj,a}
默认暴露 export default {obj,a}

导入方式 
解构赋值的方式导入 、// import {a} from "./js/a.js"
通用的方式进行导入// import * as a from "./js/a.js"
当重名时，起别名  
import {a as aa,b as bb} from "./js/a.js"

13.分别通过generator，promise，async/await实现回调地狱（结合jQuery的ajax,加入请求文件为p1.json,p2.json,p3.json）

//第1种解决方案： generator实现回调地狱
        function one(){
            $.ajax({
                url:'../data/p1.json',
                type:'get',
                dataType:'json',
                success(res){
                    console.log(res.con); 
                    iterator.next();
                }
            })
        }
        function two(){
            $.ajax({
                url:'../data/p2.json',
                type:'get',
                dataType:'json',
                success(res){
                    console.log(res.con);
                    iterator.next();
                }
            })
        }
        function three(){
            $.ajax({
                url:'../data/p3.json',
                type:'get',
                dataType:'json',
                success(res){
                    console.log(res.con);
                }
            })
        }
       
        function* fn(){
            yield one();
            yield two();
            yield three();
        }
        let iterator = fn();
        iterator.next();


 //第2种解决方  使用promise


        function getPromise2(url){
            return  new Promise(function(resolve,reject){
                $.ajax({
                    url,
                    type:'get',
                    dataType:'json',
                    success(res){
                        resolve(res);
                    },
                    error(res){
                        reject(res)
                    }
                })
            })
        }
        let p1=getPromise2('../data/p1.json');
        let p2=getPromise2('../data/p2.json');
        let p3=getPromise2('../data/p3.json');
        let p4=getPromise2('../data/p4.json');
        // any()成功一个之后就停止了 所以用all()
        let p=Promise.all([p1,p2,p3,p4]).then(function(res){
            console.log(res);
            console.log(res[0].con);
            console.log(res[1].con);
            console.log(res[2].con);
            console.log(res[3].con);
        },function(res){
            console.log(res);
        });




 //第3种解决方案： 使用async ...{ await ... } 方法


        const getPromise= function (url){
            return  new Promise(function(resolve,reject){
                $.ajax({
                    url,
                    type:'get',
                    dataType:'json',
                    success(res){
                        resolve(res);
                    },
                    error(res){
                        reject(res)
                    }
                })
            })
        }
        async function gen(){
           let p1= await getPromise('../data/p1.json');
           console.log(p1);
           let p2= await getPromise('../data/p2.json');
           console.log(p2);
           let p3= await getPromise('../data/p3.json');
           console.log(p3);
        }
        gen();

14.通过defineProperty设置响应式数据

let obj={
    name:'张三',
    age:18
}
let _name=obj.name;
// value属性 和 get方法不可以同时存在
Object.defineProperty(obj,'name',{
    // value:'123',
    // set(){
    // },
    get(){
        return _name;
    },
    set(value){
        _name=value; 
        ipt.value=value;
        box.innerHTML=value;
    }
})

ipt.value=_name;
box.innerHTML=_name;

console.log(obj);
console.log(obj.name);
obj.name="lisi";
console.log(obj); 
ipt.addEventListener('input',function(){
    obj.name=ipt.value;
})