1. 说出至少 5 个 ES6 的新特性, 并简述它们的作用.
, let 关键字, 用于声明只在块级作用域起作用的变量.
, const 关键字, 用于声明一个常量.
, 结构赋值, 一种新的变量赋值方式. 常用于交换变量值, 提取函数返回值, 设置默认值.
, Symbol 数据类型, 定义一个独一无二的值.
, Proxy 代理, 用于编写处理函数, 来拦截目标对象的操作.
, for...of 遍历, 可遍历具有 iterator 接口的数据结构.
, Set 结构, 存储不重复的成员值的集合.
, Map 结构, 键名可以是任何类型的键值对集合.
, Promise 对象, 更合理, 规范地处理异步操作.
,Class 类定义类和更简便地实现类的继承.
2. 使用结构赋值, 实现两个变量的值的交换
答案:
- let a = 1;
- let b = 2;
- [a,b] = [b,a];
3. 使用结构赋值, 完成函数的参数默认值
- function demo({name="前端君"}){
- console.log(name);
- }
4. 利用数组推导, 计算出数组 [1,2,3,4] 每一个元素的平方并组成新的数组
- var arr1 = [1, 2, 3, 4];
- var arr2 = [for (i of arr1) i * i];
- console.log(arr2);
5. 使用模板字符串改写下面的代码
- let iam = "我是";
- let name = "前端君";
- let str = "大家好,"+iam+name+", 多指教.";
改写成:
let iam = ` 我是 `;
let name = ` 前端君 `;
let str = ` 大家好,${iam+name}, 多指教.`;
6. 用对象的简洁表示法改写下面的代码
- let name = "前端君";
- let obj = {
- "name":name,
- "say":function(){
- alert('hello world');
- }
- };
改写成:
- let name = "前端君";
- let obj = {
- name,
- say(){
- alert('hello world');
- }
- };
7. 用箭头函数的形式改写下面的代码.
- arr.forEach(function (v,i) {
- console.log(i);
- console.log(v);
- });
改写成:
- arr.forEach((v,i) => {
- console.log(i);
- console.log(v);
- });
8. 设计一个对象, 键名的类型至少包含一个 symbol 类型, 并且实现遍历所有 key.
- let name = Symbol('name');
- let product = {
- [name]:"洗衣机",
- "price":799
- };
- Reflect.ownKeys(product);
9. 有一本书的属性为:{"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 改成它.
- 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 系列".
13. 定义一个类 Animal, 通过传参初始化它的类型, 如:"猫科类". 它有一个实例方法: run,run 函数体内容可自行定义.
- class Animal {
- constructor(type){
- this.type = type;
- }
- run(){
- alert('I can run');
- }
- }
14. 基于第 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');
- }
- }
15. 利用 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 的相对路径";
来源: https://www.cnblogs.com/gavinjay/p/9588136.html