一:声明属性let const

var let const 区别

1.var声明变量会发生变量提升,let、const不会发生变量提升
2.var允许重复声明变量,let不可以
3.const声明变量不可以被改变

二:字符串模板

用反引号创建字符串,其中可用${'变量'}

console.log(`your name is ${name}`);

三:解构赋值对数组和对象的优化

四:箭头函数

与普通函数的区别

1、书写上用=>代替了function

2、普通函数的this指向window 而ES6箭头函数里面的this指向定义时的那个对象 而不是运行时的那个对象

//普通函数
var test = function(x){
return x+2;
}
使用箭头函数:
var test = x=>x+2;

五:新增了class

ES6中添加了对类的支持,引入了class关键字

以前编写一个构造函数(类)
function Pad(color){
this.color = color;
}
现在的写法跟Java更接近了
class Iphone{
constructor(color, size){
this.color = color;
this.size = size;
}
playgame(){
//.............
}
toString(){
return `这台手机的颜色是${this.color} 屏幕大小是${this.size}`;
}
}
我们定义了一个类,名字叫Iphone
通过类生成一个实例:
var iphone = new Iphone("白色", 5); 其中constructor被称之为构造方法,在我们new 一个对象的时候,自动被调用
不过本质上,JS依然使用了原型来实现,也就是说,这不过是一个新的写法而已 跟以前的构造函数没有区别。
要注意的是,使用了class来定义类,必须先定义再使用

六:ES6中的set方法

一般用于数组去重

var arr = [1,2,3,3,4,5];
var newarr = new Array.from(set arr)
console.log(new arr)//[1,2,3,4,5]

七:promise用来解决异步问题

1、什么是promise?

  异步操作的同步代码

2、promise的基本使用

  通过new promise创建一个promise对象,里面有一个参数,参数是一个回调函数,回调函数中有2个参数,resolve,reject resolve()当

  异步执行成功的时候调用的方法,reject()当异步失败的时候调用的方法。

  除此之外promise有一个then方法,当成功的时候执行第一个回调函数,当失败的时候执行第二个回调函数。第二个回调函数也可以通过

  promise对象.catch调用

3、Promise.all():当所有的异步代码都执行完毕以后才会执行.then中的操作

4、Promise.race():只要有一个promise执行完毕后就会执行.then操作

如何实现多个异步同步执行
var p1 = new Promise(function(resolve,reject){
  setTimeout(function(){
     console.log('1');
     resolve()
  },3000)
})
function p2(){
   return new Promise(function(resolve,reject){
    setTimeout(function(){
      console.log("2");
      resolve();
    },2000)
   })
}
function p3(){
  return new Promise(function(resolve,reject){
    setTimeout(function(){
       console.log("3");
       resolve();
    },1000)
  })
}
function p4(){
  return new Promise(function(resolve,reject){
     setTimeout(function(){
        console.log("4");
        resolve();
      },500)
  })
}
p1.then(function(){
  return p2()
})
.then(function(){
  return p3();
})
.then(function(){
  return p4();
})

八:ES6新增的Set、Map方法

set:
  set是ES6提供的一种新的数据结构,类似于数组,但是成员的值是唯一的没有重复的,接受的参数是一个数组方法有:
  add():添加
  delete():删除
  size:长度
  has():查找
  clear:清除所有
map:
  map类似于对象,也是键值对的集合, 但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键方法有:
  set():设置
  get():获取
  delete():删除
  has():查找
  clear():清除所有

九:for ...of...

for of 和for in区别

for in 可以用来遍历数组,但是会有以下几个问题

  1.index索引为字符串型数字,不能直接进行几何运算

  2.遍历顺序有可能不是按照实际数组的内部顺序

  3.使用for in会遍历数组所有的可枚举属性,例如下面例子上的原型方法method和name属性都会被遍历出来
Array.prototype.method  = function(){
console.log(this.length)
} var myArray = [1,2,3,4,5] myArray.name = "数组"
for (var key in myArray) {
console.log(key)
}

输出结果:

如果我们不想要method和name呢,这样的话我们可以使用ES6的for of

十:symbol函数

Symbol函数会生成一个唯一的值

可以理解为Symbol类型跟字符串是接近的

但每次生成唯一的值,也就是每次都不相等,至于它等于多少,并不重要

ES6新增常见特性的更多相关文章

  1. ES6新增特性

    ES6:  ECMA 第六次改版   块级作用域:   凡是被{ }包裹住的代码都是块级作用域,除了对象       特点:会造成一个暂时性死区    新增声明变量的两种方式: let:     a. ...

  2. ES6常用新特性

    https://segmentfault.com/a/1190000011976770?share_user=1030000010776722 该文章为转载文章!仅个人喜好收藏文章! 1.前言 前几天 ...

  3. ES6的新特性(8)——数组的扩展

    数组的扩展 扩展运算符 含义 扩展运算符(spread)是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. console.log(...[1, 2, 3]) / ...

  4. ES6 && ECMAScript2015 新特性

      ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015. 也就是说,ES6就是ES201 ...

  5. 浅谈ES6新增数据类型:Symbol

    面试中喜闻乐见的问题就是问我们的ES6新增了哪些个新特性 这篇文章一起学习一下新增的数据类型:Symbol JS的原始数据类型:6种Boolean,String,Undefined,NULL,Numb ...

  6. ES6常用七大特性

    ES6可谓是对JS语言的一个颠覆性改变,增加了Module改善JS一直被诟病的模块化.Promise解决异步函数的回调地狱.Class的面相对象编程... 在学习ES6的过程中,大家或多或少都有看过阮 ...

  7. ES6的新特性(13)——Symbol

    Symbol 概述 ES5 的对象属性名都是字符串,这容易造成属性名的冲突.比如,你使用了一个他人提供的对象,但又想为这个对象添加新的方法(mixin 模式),新方法的名字就有可能与现有方法产生冲突. ...

  8. ES6的新特性(9)——对象的扩展

    对象的扩展 属性的简洁表示法 ES6 允许直接写入变量和函数,作为对象的属性和方法.这样的书写更加简洁. const foo = 'bar'; const baz = {foo}; baz // {f ...

  9. ES6的新特性(2)——let 与 const 增强变量声明

    let 与 const 增强变量声明 ES6 新增了let命令,用来声明局部变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效,而且有暂时性死区的约束. 先看个var的常见 ...

随机推荐

  1. OpenGL入门第一天:环境

    本文是个人学习记录,学习建议看教程 https://learnopengl-cn.github.io/ 非常感谢原作者JoeyDeVries和各位翻译提供的优质教程 近况(牢骚 这几天教母校初中的OI ...

  2. Netty基础系列(5) --零拷贝彻底分析

    前言 上一节(堆外内存与零拷贝)当中我们从jvm堆内存的视角解释了一波零拷贝原理,但是仅仅这样还是不够的. 为了彻底搞懂零拷贝,我们趁热打铁,接着上一节来继续讲解零拷贝的底层原理. 感受一下NIO的速 ...

  3. [HNOI2009]双递增序列(动态规划,序列dp)

    感觉这个题还蛮难想的. 首先状态特别难想.设\(dp[i][j]\)表示前i个数,2序列的长度为j的情况下,2序列的最后一个数的最小值. 其中1序列为上一个数所在的序列,2序列为另外一个序列. 这样设 ...

  4. 入门MySQL——用户与权限

    前言:  前面几篇文章为大家介绍了各种SQL语法的使用,本篇文章将主要介绍MySQL用户及权限相关知识,如果你不是DBA的话可能平时用的不多,但是了解下也是好处多多. 1.创建用户 官方推荐创建语法为 ...

  5. application.yml 增加数据库连接,重启日志卡死

    SpringBoot引入JPA,application.ymlapplication.yml增加数据库链接参数,启动卡死,日志没有动,如下图 折腾好久,后面发现用 Maven的package 过程中 ...

  6. 【转】python爬虫之腾讯视频vip下载

    本文转自如下:作者:jia666666 原文:https://blog.csdn.net/jia666666/article/details/82466553 版权声明:本文为博主原创文章,转载请附上 ...

  7. [Python] 将视频转成ASCII符号形式、生成GIF图片

    一.简要说明 简述:本文主要展示将视频转成ASCII符号形式展示出来,带音频. 运行环境:Win10/Python3.5. 主要模块: PIL.numpy.shutil. [PIL]: 图像处理 [n ...

  8. JDK中的Proxy技术实现AOP功能

    1.需求,用户在执行某个业务方法时我们需要对这个用户进行判断是否具有权限(或者说用户是否登录了)? 例如修改用户信息,我们在update()方法前判断当前用户user是否为null(表示没有权限或者没 ...

  9. JavaScript入门之AJAX:原生ajax

    背景 传统的Web应用允许用户端填写表单(form),当提交表单时就向网页服务器发送一个请求.服务器接收并处理传来的表单,然后送回一个新的网页,但这个做法浪费了许多带宽,因为在前后两个页面中的大部分H ...

  10. P2467 [SDOI2010]地精部落 DP

    传送门:https://www.luogu.org/problemnew/show/P2467 参考与学习:https://www.luogu.org/blog/user55639/solution- ...