ES6系列15道进阶应用题

1.说出至少5个ES6的新特性,并简述它们的作用。(简答题)

答:
1、 let关键字,用于声明只在块级作用域起作用的变量。
2、 const关键字,用于声明一个常量。
3、 结构赋值,一种新的变量赋值方式。常用于交换变量值,提取函数返回值,设置默认值。
4、 Symbol数据类型,定义一个独一无二的值。
5、 Proxy代理,用于编写处理函数,来拦截目标对象的操作。
6、 for...of遍历,可遍历具有iterator 接口的数据结构。
7、 Set结构,存储不重复的成员值的集合。
8、 Map结构,键名可以是任何类型的键值对集合。
9、 Promise对象,更合理、规范地处理异步操作。
10、Class类定义类和更简便地实现类的继承。
可自行补充....
 
  1. 使用结构赋值,实现两个变量的值的交换(编程题)。
答案:
let a = 1;
let b = 2;
[a,b] = [b,a];

3.使用结构赋值,完成函数的参数默认值(编程题)。

function demo({name="前端君"}){
    console.log(name);
}
  1. 利用数组推导,计算出数组 [1,2,3,4] 每一个元素的平方并组成新的数组。(编程题)
var arr1 = [1, 2, 3, 4];
var arr2 = [for (i of arr1) i * i];
console.log(arr2);

5.使用模板字符串改写下面的代码。(ES5 to ES6改写题)

let iam = "我是";
let name = "前端君";
let str = "大家好,"+iam+name+",多指教。";
改写成:
let iam  = `我是`;
let name = `前端君`;
let str  = `大家好,${iam+name},多指教。`;

6.用对象的简洁表示法改写下面的代码。(ES5 to ES6改写题)

let name = "前端君";
let obj = {
   "name":name,
   "say":function(){
       alert('hello world');
   }
};
改写成:
let name = "前端君";
let obj = {
   name,
   say(){
       alert('hello world');
   }
};

7.用箭头函数的形式改写下面的代码。(ES5 to ES6改写题)

arr.forEach(function (v,i) {
   console.log(i);
   console.log(v);
});
改写成:
arr.forEach((v,i) => {
   console.log(i);
   console.log(v);
});
  1. 设计一个对象,键名的类型至少包含一个symbol类型,并且实现遍历所有key。(编程题)
答:
let name = Symbol('name');
let product = {
   [name]:"洗衣机",
   "price":799
};

Reflect.ownKeys(product);
  1. 有一本书的属性为:{“name”:“《ES6基础系列》”, ”price”:56 };要求使用Proxy对象对其进行拦截处理,name属性对外为“《ES6入门到懵逼》”,price属性为只读。(练习题)
答:
let book  = {"name":"《ES6基础系列》","price":56 };
let proxy = new Proxy(book,{
   get:function(target,property){
       if(property === "name"){
           return "《入门到懵逼》";
       }else{
           return target[property];
       }
   },
   set:function(target,property,value){
       if(property === 'price'){
           target[property] = 56;
       }
   }
});

10.阅读下面的代码,并用for...of改成它。(ES5 to ES6改写题)

let arr = [11,22,33,44,55];
let sum = 0;
for(let i=0;i<arr.length;i++){
   sum += arr[i];
}
改写:
let arr = [11,22,33,44,55];
let sum = 0;
for(value of arr){
   sum += value;
}

11.关于Set结构,阅读下面的代码,回答问题。(代码阅读题)。
let s = new Set();
s.add([1]);
s.add([1]);
console.log(s.size);
问:打印出来的size的值是多少?

答:2。如果回答为1的同学,多必是记得Set结构是不会存储相同的值。
其实在这个案例中,两个数组[1]并不是同一个值,它们分别定义的数组,
在内存中分别对应着不同的存储地址,因此并不是相同的值。
所以都能存储到Set结构中,size为2。

12.关于Map结构,阅读下面的代码,回答问题。(代码阅读题)
let map = new Map();
map.set([1],"ES6系列");
let con = map.get([1]);
console.log(con);
问:打印出来的变量con的值是多少,为什么?

答:undefined。因为set的时候用的数组[1]和get的时候用的数组[1]是分别两个不同的数组,只不过它们元素都是1。它们是分别定义的两个数组,并不是同一个值。新手避免在这里犯错。如果想达到预期的效果,你要保证get的时候和set的时候用同一个数组。比如:
let map = new Map();
let arr = [1];
map.set(arr,"ES6系列");

let con = map.get(arr);
console.log(con);
这样的得到的变量con的值就是:“ES6系列”。
  1. 定义一个类Animal,通过传参初始化它的类型,如:“猫科类”。它有一个实例方法:run,run函数体内容可自行定义。
    答:
class Animal {
   constructor(type){
       this.type = type;
   }

   run(){
       alert('I can run');
   }
}
  1. 基于第12题的Animal类,定义一个子类Cat并继承Animal类。初始化Cat类的昵称name和年龄age。并拥有实例方法eat,eat函数体内容可自行定义。
答:
class Cat extends Animal{
   constructor(type,name,age){
       super(type);
       this.name = name;
       this.age = age;
   }
  
   eat(){
       alert('I am eating');
   }
}
  1. 利用module模块,实现两个模块A和B,A模块导出变量name,age和say方法。B模块只导入变量name和say方法,并且重命名name为nickname。
答:
//-----模块A-------//
var name = "kitty";
var age = 15;
var say = function(){
   //....
};
export {name,age,say}
 
//---module-B.js文件---
import { name as nickname, say } from "模块A的相对路径";
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,242评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,769评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,484评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,133评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,007评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,080评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,496评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,190评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,464评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,549评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,330评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,205评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,567评论 3 298
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,889评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,160评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,475评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,650评论 2 335

推荐阅读更多精彩内容