ES6练习题

本文转载自查看原文 2020-09-04 21:01 582 es6

考试题

一、简答题

1、let、const、var定义变量的区别是什么？

块作用域
没有变量提升
不能重复声明
属于顶层对象

const

声明常量，不能修改
必须初始化
块作用域
没有变量提升
不能重复声明
属于顶层对象

没有块的概念
可以夸块访问，但是不能跨函数访问
会进行变量提升

2、promise分为几种状态？什么时候会进入catch方法？

三种状态

pending 等待　　
fulfulled resloved 成功
rejected 失败

状态变为rejected的时候会进入catch方法

3、箭头函数和普通函数的区别是什么？

声明方式不同

普通函数通过function声明
箭头函数通过=>声明

箭头函数不能用于构造函数
this指向不同

普通函数this指向调用这个函数的地方
箭头函数this指向声明这个函数的地方

4、== 和=== 有什么区别?

==比较值是否相同
===全等比较，除了比较值之外还会比较类型

5、Set和数组有什么区别？set中如何增加、删除元素？

set中的数据都不会重复
增加元素

删除元素

delete

6、Map中如何设置元素，如何获取元素？

set(key,value)
get(key)

7、如何在多个Promise执行完成之后做一些操作？多个Promise同时执行有一个执行完了就进行一些操作?

Promise.all([多个Promise]).then(res=>{})
Promise.race([多个Promise]).then(res=>{})

8、如何获取对象的所有key值？

包含Symbol

Reflect.ownKeys()

不包含Symbol

Object.keys()

只有Symbol

Object.getOwnPropertySymbols()

9、ES6中如何实现类的继承？

通过extends关键字实现

10、类中static关键字有什么作用？

声明静态的方法和属性。静态的方法和属性

11. 类中的静态方法和普通方法有什么区别？如何定义静态方法？

静态方法归属于类
普通方法归属于实例
通过static关键字

二、看程序写答案

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

const obj = {  id:123,  age:20,  name:"cyrus",  school:"河北科技大学" }  let obj1 = {  age:18,  ...obj,  name:"李四" }  console.log(obj1.age); //20 console.log(obj1.id); //123 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);  // 1 2 5 3

3、下图打印的结果是什么？

let name = Symbol('name') let name1 = Symbol.for('name') console.log(name == name1);// false

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());// { value: 2, done: false } console.log(lt.next(3)); // { value: 3, done: false } console.log(lt.next(lt.next(1).value))// { value: 7, done: false } console.log(lt.next(4));// { value: 25, done: true }

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、使用解构赋值，实现两个变量的值的交换。

let a=5; let b=3; [a,b]=[b,a]  console.log(a); console.log(b);

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

let name = Symbol()  let obj = {  name:"李白",  [name]:"杜甫" }  Reflect.ownKeys(obj).forEach(key=>{  console.log(key);  console.log(obj[key]) })

3、使用set实现数组去重

let list = [1,3,4,6,2,2,2,3,1,2,3,4] let set = new Set(list) let newList = Array.from(set)

4、说一下ES6的导入和导出模块

// a.js 默认导出 const test = "测试" export default {  name:"李白",  age:18,  test }  普通导出 export function getName(){  console.log(123) }  export const cat = "皮皮"

// b.js  默认导入 import aObj from './a.js' console.log(aObj.name) //李白   普通导入 import {getName,cat} from './a.js' console.log(cat) getName()

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

const list = [  {id:3,name:"张三丰"},  {id:5,name:"张无忌"},  {id:13,name:"杨逍"},  {id:33,name:"殷天正"},  {id:12,name:"赵敏"},  {id:97,name:"周芷若"}, ]  console.log(list.filter(item => item.name.startsWith("杨"))) console.log(list.filter(item => item.name.includes("天"))) console.log(list.find(item => item.name == '周芷若').id)

6、还是上面的那个数组，要求获取一个新的数组，数组中每一项的id*2，并且增加updateTime属性，值为当前时间。

const list = [  {id:3,name:"张三丰"},  {id:5,name:"张无忌"},  {id:13,name:"杨逍"},  {id:33,name:"殷天正"},  {id:12,name:"赵敏"},  {id:97,name:"周芷若"}, ]  console.log(list.map(item=>({...item,id:item.id*2,updateTime:new Date()})));

四、上机题

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: '产品经理' }];   const unSelectedRoles = roleList.filter(item => !selectedRoleList.some(selectedItem => selectedItem.id == item.id)) console.log(unSelectedRoles); const selectedIds = selectedRoleList.map(item=>item.id) console.log(selectedIds);

2、实现对象的深度拷贝？（至少三种方式）

2.1. 使用JSON暴力转换

通过JSON.stringify() 和 JSON.parse() 将对象转为字符串之后在转为对象。

var obj = {name:'123'};  var obj2 = JSON.parse(JSON.stringify(obj))

这种简单粗暴的方式有局限性，当值为undefined、function、symbol会在转换过程中被忽略。

2.2. 使用解构赋值

var obj = {name:'123',age:13}; var obj2 = {...obj}

只能深度拷贝对象的第一层，如果对象中的属性也是对象的话，没有办法进行深度拷贝的。

2.3. 使用对象的合并

利用Object.assign(), 第一个参数必须是空对象

var obj = {name:'123',age:13}; var obj2 = Object.assign({},obj1);