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

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

2.使用结构赋值,实现两个变量的值的交换

  1. 答案:
  2. let a = ;
  3. let b = ;
  4. [a,b] = [b,a];

3.使用结构赋值,完成函数的参数默认值

  1. function demo({name="前端君"}){
  2. console.log(name);
  3. }

4.利用数组推导,计算出数组 [1,2,3,4] 每一个元素的平方并组成新的数组

  1. var arr1 = [, , , ];
  2. var arr2 = [for (i of arr1) i * i];
  3. console.log(arr2);

5.使用模板字符串改写下面的代码

  1. let iam = "我是";
  2. let name = "前端君";
  3. let str = "大家好,"+iam+name+",多指教。";
  4. 改写成:
  5. let iam = `我是`;
  6. let name = `前端君`;
  7. let str = `大家好,${iam+name},多指教。`;

6.用对象的简洁表示法改写下面的代码

  1. let name = "前端君";
  2. let obj = {
  3. "name":name,
  4. "say":function(){
  5. alert('hello world');
  6. }
  7. };
  8. 改写成:
  9. let name = "前端君";
  10. let obj = {
  11. name,
  12. say(){
  13. alert('hello world');
  14. }
  15. };

7.用箭头函数的形式改写下面的代码。

  1. arr.forEach(function (v,i) {
  2. console.log(i);
  3. console.log(v);
  4. });
  5. 改写成:
  6. arr.forEach((v,i) => {
  7. console.log(i);
  8. console.log(v);
  9. });

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

  1. let name = Symbol('name');
  2. let product = {
  3. [name]:"洗衣机",
  4. "price":
  5. };
  6.  
  7. Reflect.ownKeys(product);

9.有一本书的属性为:{“name”:“《ES6基础系列》”, ”price”:56 };要求使用Proxy对象对其进行拦截处理,name属性对外为“《ES6入门到懵逼》”,price属性为只读。

  1. let book = {"name":"《ES6基础系列》","price": };
  2. let proxy = new Proxy(book,{
  3. get:function(target,property){
  4. if(property === "name"){
  5. return "《入门到懵逼》";
  6. }else{
  7. return target[property];
  8. }
  9. },
  10. set:function(target,property,value){
  11. if(property === 'price'){
  12. target[property] = ;
  13. }
  14. }
  15. });

10.阅读下面的代码,并用for...of改成它。

  1. let arr = [,,,,];
  2. let sum = ;
  3. for(let i=;i<arr.length;i++){
  4. sum += arr[i];
  5. }
  6. 改写:
  7. let arr = [,,,,];
  8. let sum = ;
  9. for(value of arr){
  10. sum += value;
  11. }

11.关于Set结构,阅读下面的代码,回答问题。。

let s = new Set();
s.add([1]);
s.add([1]);
console.log(s.size);
问:打印出来的size的值是多少?

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

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

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

13.定义一个类Animal,通过传参初始化它的类型,如:“猫科类”。它有一个实例方法:run,run函数体内容可自行定义。

  1. class Animal {
  2. constructor(type){
  3. this.type = type;
  4. }
  5.  
  6. run(){
  7. alert('I can run');
  8. }
  9. }

14.基于第12题的Animal类,定义一个子类Cat并继承Animal类。初始化Cat类的昵称name和年龄age。并拥有实例方法eat,eat函数体内容可自行定义。

  1. 答:
  2. class Cat extends Animal{
  3. constructor(type,name,age){
  4. super(type);
  5. this.name = name;
  6. this.age = age;
  7. }
  8.  
  9. eat(){
  10. alert('I am eating');
  11. }
  12. }

15.利用module模块,实现两个模块A和B,A模块导出变量name,age和say方法。B模块只导入变量name和say方法,并且重命名name为nickname。

  1. 答:
  2. //-----模块A-------//
  3. var name = "kitty";
  4. var age = ;
  5. var say = function(){
  6. //....
  7. };
  8. export {name,age,say}
  9.  
  10. //---module-B.js文件---
  11. import { name as nickname, say } from "模块A的相对路径";

ES6进阶之路的更多相关文章

  1. nodejs打包成桌面程序(exe)的进阶之路

    nodejs打包成桌面程序(exe)的进阶之路 node js bat 前端 计划任务 前言:最近的研究,请大佬们细品 第一篇 - 任务计划程序篇 说真的研究到将nodejs打包成可执行的exe文件是 ...

  2. JavaScript进阶之路(一)初学者的开始

    一:写在前面的问题和话 一个javascript初学者的进阶之路! 背景:3年后端(ASP.NET)工作经验,javascript水平一般般,前端水平一般般.学习资料:犀牛书. 如有误导,或者错误的地 ...

  3. OpenCV进阶之路:神经网络识别车牌字符

    1. 关于OpenCV进阶之路 前段时间写过一些关于OpenCV基础知识方面的系列文章,主要内容是面向OpenCV初学者,介绍OpenCV中一些常用的函数的接口和调用方法,相关的内容在OpenCV的手 ...

  4. MVC进阶之路:依赖注入(Di)和Ninject

    MVC进阶之路:依赖注入(Di)和Ninject 0X1 什么是依赖注入 依赖注入(Dependency Injection),是这样一个过程:某客户类只依赖于服务类的一个接口,而不依赖于具体服务类, ...

  5. 【SSH进阶之路】Hibernate映射——多对一单向关联映射(四)

    [SSH进阶之路]Hibernate基本原理(一) ,小编介绍了Hibernate的基本原理以及它的核心,採用对象化的思维操作关系型数据库. [SSH进阶之路]Hibernate搭建开发环境+简单实例 ...

  6. 【SSH进阶之路】一步步重构容器实现Spring框架——彻底封装,实现简单灵活的Spring框架(十一)

    文件夹      [SSH进阶之路]一步步重构容器实现Spring框架--从一个简单的容器開始(八)      [SSH进阶之路]一步步重构容器实现Spring框架--解决容器对组件的"侵入 ...

  7. 2017PHP程序员的进阶之路

    2017PHP程序员的进阶之路 又是一年毕业季,可能会有好多毕业生即将进入开发这个圈子,踏上码农这个不归路.根据这些年在开发圈子总结的LNMP程序猿发展轨迹,结合个人经验体会,总结出很多程序员对未来的 ...

  8. 浅谈Android进阶之路

    过去十年是移动互联网蓬勃发展的黄金期,相信每个人也都享受到了移动互联网红利,在此期间,移动互联网经历了曙光期.成长期.成熟期.现在来说已经进入饱和期.依然记得在 2010-2013 年期间,从事移动开 ...

  9. 处女作《Web全栈开发进阶之路》出版了!

    书中源码下载地址:https://github.com/qinggee/WebAdvanced 01. 当初决定写博客的原因非常的纯洁:只要每个月写上 4 篇以上博客,月底的绩效奖金就多 500 块. ...

随机推荐

  1. Springboot & Mybatis 构建restful 服务四

    Springboot & Mybatis 构建restful 服务四 1 前置条件 成功执行完Springboot & Mybatis 构建restful 服务三 2 restful ...

  2. windows kafka 环境搭建踩坑记

    版本介绍(64位): Windows 10 JDK1.8.0_171 zookeeper-3.4.8/ kafka_2.11-0.10.0.1.tgz 点击链接进行下载 1. JDK安装和环境搭建 自 ...

  3. jQuery子页面获取父页面元素并绑定事件

    父页面HTML文件: <ul id="faul"> <li class="sonli">子页面列表1</li> <li ...

  4. enum枚举类

    枚举类可用于定义常量ch01 package edu.nf.demo.ch01; /** * * 枚举类型 */ public enum Color { /** * 红色 */ RED, /** * ...

  5. struct,map,json 互相转换

    1.1 struct to json 准备 很简单,使用encoding包可以互相转换,没什么好说的,但是有几点注意: 1.结构体内需要序列化的字段首字母大写(遵循驼峰式命名),不需要序列化的字段小写 ...

  6. Oracle去除重复(某一列的值重复),取最新(日期字段最新)的一条数据

    转自 : http://blog.csdn.net/nux_123/article/details/45037719 问题:在项目中有一张设备检测信息表DEVICE_INFO_TBL, 每个设备每天都 ...

  7. 负载均衡器之 Haproxy

    1. 编译安装haproxy 官网: http://www.haproxy.org 1.1 下载haproxy # wget http://www.haproxy.org/download/1.6/s ...

  8. Python Flask学习笔记之模板

    Python Flask学习笔记之模板 Jinja2模板引擎 默认情况下,Flask在程序文件夹中的templates子文件夹中寻找模板.Flask提供的render_template函数把Jinja ...

  9. How to setup Visual Studio without pain

    Visual Studio (VS) can be very hard to install. If you are lucky, one whole day may be enough to ins ...

  10. Office Web addin 踩坑计:替换后台网站为MVC框架时遇到的问题

    Office Web Addin 模板程序的后台本质上是一个网站,你在调试的时候可以发现它的进程是一个32位的IE进程 所以可以把它替换成Asp.net的网站. 替换方法: 1.点击WordRevie ...