目 录CONTENT

文章目录

ES6练习题三

Administrator
2021-01-28 / 0 评论 / 0 点赞 / 5718 阅读 / 4690 字

ES6练习题(三)

  • 出题人:杨标
  • 时间:2021年1月28日
  • 内容:ECMAScript6
  • 适用班级:H2003

一、简答题

  1. let、const、var定义变量的区别是什么?
  2. promise分为几种状态?什么时候会进入catch方法?
  3. 箭头函数和普通函数的区别是什么?
  4. == 和=== 有什么区别?
  5. Set和数组有什么区别?set中如何增加、删除元素?
  6. Map中如何设置元素,如何获取元素?
  7. 如何在多个Promise执行完成之后做一些操作?多个Promise同时执行有一个执行完了就进行一些操作?
  8. 如何获取对象的所有key值?
  9. ES6中如何实现类的继承?
  10. 类中static关键字有什么作用?
  11. 类中的静态方法和普通方法有什么区别?如何定义静态方法?

二、看程序写结果

  1. 下图代码执行完成后打印的结果是?

    const obj = {
        id:123,
        age:20,
        name:"cyrus",
        school:"河北科技大学"
    }
    let obj1 = {
        age:18,
        ...obj,
        name:"李四"
    }
    console.log(obj1.age);
    console.log(obj1.id);
    console.log(obj1.name);
    
  2. 下图代码打印的内容分别是什么?

    const promise = new Promise((resolve, reject) => {
        console.log(1);
        resolve(3);
        console.log(2);
        reject(4)
    })
    promise.then((res) => {
        console.log(res);
    }).catch(err=>{
        console.log(err);
    })
    console.log(5);
    
  3. 下图打印的结果是什么?

    let name = Symbol('name')
    let name1 = Symbol.for('name')
    console.log(name == name1);
    
  4. 下图打印的内容分别是什么?

    function * gen(){
        let params = yield 2
        let params1 = yield 3
        let params2 = yield params1 + 6
        let params3 = yield 7
        return params2 * params + params3
    }
    let lt = gen();
    console.log(lt.next());
    console.log(lt.next(3));
    console.log(lt.next(lt.next(1).value);
    console.log(lt.next(4));
    
  5. 下图代码的打印结果分别是什么

    let obj = {name:"张三",age:16}
    let proxy = new Proxy(obj,{
        get(target,property){
            if(target.age < 18){
                return "未成年人"
            } 
            return target[property]
        },
        set(target,property,value){
            if(property == 'name'&&target.age< 18){
                console.log("未成年人不允许改名字");
            }
            target[property] = value
        }
    })
    console.log(proxy.name);
    proxy.name = "李四"
    console.log(proxy.name);
    proxy.age = 20
    console.log(proxy.name);
    

三、编程题

  1. 使用解构赋值,实现两个变量的值的交换。

  2. 设计一个对象,键名的类型至少包含一个symbol类型,并且实现遍历所有key。

  3. 使用set实现数组去重

  4. 说一下ES6的导入和导出模块(ESModule),在浏览器端去实现

  5. 编程实现找到所有姓杨的人;找到所有包含天这个字的人;找到周芷若的id

    const list = [
        {id:3,name:"张三丰"},
        {id:5,name:"张无忌"},
        {id:13,name:"杨逍"},
        {id:33,name:"殷天正"},
        {id:12,name:"赵敏"},
        {id:97,name:"周芷若"},
    ]
    
  6. 还是上面的那个数组,要求获取一个新的数组,数组中每一项的id*2,并且增加updateTime属性,值为当前时间。

    const list = [
        {id:3,name:"张三丰"},
        {id:5,name:"张无忌"},
        {id:13,name:"杨逍"},
        {id:33,name:"殷天正"},
        {id:12,name:"赵敏"},
        {id:97,name:"周芷若"},
    ]
    

四、上机题

  1. 现在有用户的角色有数组,如:[{id:1,name:’经理’},{id:2,name:’员工’}],用户已选择的数组[{id:2,name:’经理’}], 要求获取用户未选中的角色列表,和用户已选择的角色的id数组。(使用es6语法实现)map、filter、some

    const roleList = [{
        id: 1,
        name: '老板'
    }, {
        id: 2,
        name: '经理'
    }, {
        id: 3,
        name: '运营总监'
    }, {
        id: 4,
        name: 'CEO'
    }, {
        id: 5,
        name: '销售'
    }, {
        id: 6,
        name: '实施'
    }, {
        id: 7,
        name: '程序员'
    }, {
        id: 8,
        name: 'UI工程师'
    }, {
        id: 9,
        name: '产品经理'
    }];
    // 用户已选择的数组
    const selectedRoleList = [{
        id: 2,
        name: '经理'
    }, {
        id: 3,
        name: '运营总监'
    }, {
        id: 6,
        name: '实施'
    }, {
        id: 7,
        name: '程序员'
    }, {
        id: 9,
        name: '产品经理'
    }];
    
  2. 通过分别通过回调函数、Promise和async/await解决下属异步问题,要求最后打印课程详情中的课程介绍。

// 获取专题列表
function getSubject(){
    setTimeout(() => {
        let subjectList = [{subjectId:3,name:"专题"}]
    }, 1000);
}
// 获取课程列表,依赖专题id
function getCourseBySubjectId(subjectId){
    setTimeout(() => {
        console.log(subjectId);
        let courseList = [{courseId:4,name:"web前端课程"}]
    }, 1000);
}
// 获取课程详情,依赖课程id
function getCourseDetailById(courseId){
    setTimeout(() => {
        console.log(courseId);
        let courseDetail = {courseId:4,name:"web前端课程",intro:"这是一门很不错的课程"}
    }, 1000);
}
0

评论区