ECMAScript 简介

  简称es,是一套标准,javascript就是使用这套标准的语言。主流的浏览器使用的是ECAMScript5,ECAMScript6(ECAMScript2015)是一涛新的标准,添加了新的特性。借助bable和jspm可以使用它的新特性。

1、块的作用域

作用域,即变量有效的范围(声明的变量在什么地方可以使用)。之前js只有全局作用域和函数作用域,es6中有了块级作用域。

    

  只能在块中访问。

  另外var命令会发生”变量提升“现象,即变量可以在声明之前使用,值为undefined。这种现象多多少少是有些奇怪的,按照一般的逻辑,变量应该在声明语句之后才可以使用。

2、恒量(常量)

  const声明恒量,声明的恒量不能被分配新的值。

    

  不能重新分配恒量的值,单可以改变其值。如下

    

3、解构数组(分解其解构)

  把 ['蛋糕', '咖啡', '苹果'] 数组分配给其他变量,老方法如下:

   

  新方法如下:

  

  结果:

  

4、解构对象(分别使用对象中的属性值)

    

5、模板字符串 Template Strings

  旧方法:

  

  新特性:

  

  结果:

  

  自动识别换行,方便我们多行显示

    

6、带标签的模板字符串  Tagged Templates

  可以在模板字符前面插入一个标签来处理模板字符串里边的字符,这里的标签其实就是一个函数。

    

  raw中表现如下:

  早餐后加\n换行 raw中是没有处理的

    

  输出模板字符串的内容:

    

7、判断字符串里是否包含其他字符串(includs、startsWith、endsWith)

    includs判断一个字符串中是否包含另一个字符串

  startsWith判断某个字符串中是不是已另一个字符串开头

  endsWith判断某个字符串中是不是已另一个字符串结尾

    

    

8、默认参数 Default Parameter Values

  可以为定义的函数的参数设置默认值

    

    

9、展开操作符 spread(...)

  比如我们要展开数组中的每一项:

    

  第一个输出的是数组,第二个输出的是数组中的内容,他的功能显而易见了。

  那么想把fruit展开放入另一个数组怎么做呢:

    

10、剩余操作符  Rest(...)

一般用在函数的参数里边:

    

  上面函数出了可以传dessert和drink两个参数之外, 还可传其他参数,其他参数都会被放在foods的数组里边

  当然这边还可以使用spread操作符来展开:

    

11、解构参数 Destructured Parameters

  

12、函数的名字(name属性)

  使用匿名函数的方式,name属性函数的名字是变量名

    

  声明函数名字时,name属性对应函数的函数名(优先级)

    

13、箭头函数 Arrow Functions

  普通箭头函数

    

  多个参数的箭头函数

    

14、对象表达式

  声明一个对象,对象内容可以直接引用定义的变量值:

  之前需要这样引用  

  es6里面不需要冒号后面的东西   

  在对象中添加一个方法之前是

let dessert = '蛋糕', drink = '咖啡';

let foods = {
dessert,
drink,
breakfast: function(){console.log(1)}
} console.log(foods)

  es6中可以省掉function

let dessert = '蛋糕', drink = '咖啡';

let foods = {
dessert,
drink,
breakfast(){console.log(1)}
}
console.log(foods)

一小时学会ECMAScript6新特性(一)的更多相关文章

  1. 一小时学会ECMAScript6新特性

    ECMAScript 简介 简称es,是一套标准,javascript就是使用这套标准的语言.主流的浏览器使用的是ECAMScript5,ECAMScript6(ECAMScript2015)是一涛新 ...

  2. 一小时学会ECMAScript6新特性(二)

    1.对象属性名 es5中我们为一个对象添加属性可以用如下代码: let foods = {}; foods.dessert = '蛋糕'; console.log(foods) 但是属性名中间有空格则 ...

  3. ECMAScript6新特性之let、const

    第一次在博客园写博客,想把自己每一天学习到的知识点记录下来,心里有点紧张(PS:不知道自己能不能写好......嘿嘿).言归正传,咱们先来说说"ECMAScript"这到底是啥玩意 ...

  4. 轻松学会ES6新特性之生成器

    生成器虽然是ES6最具魔性的新特性,但也是最难懂得的一节,笔者写了大量的实例来具体化这种抽象的概念,能够让人一看就懂,目的是希望别人不要重复或者减少笔者学习生成器的痛苦经历. 在说具体的ES6生成器之 ...

  5. web全栈架构师[笔记] — 01 ECMAScript6新特性

    ES6新特性 一.变量 var:重复定义不报错:没有块级作用域:不能限制修改 let:变量,不能重复定义,有块级作用域 const:常量,不能重复定义,有块级作用域 二.函数/参数 箭头函数——简写: ...

  6. ECMAScript6 | 新特性(部分)

    新特性概览 参考文章:http://www.cnblogs.com/Wayou/p/es6_new_features.html 这位前辈写的很好,建议深入学习 ———————————————————— ...

  7. ECMAscript6新特性之解构赋值

    在以前,我们要对变量赋值,只能直接指定值.比如:var a = 1;var b = 2;但是发现这种写法写起来有点麻烦,一点都不简洁,而在ECMAScript6中引入了一种新的概念,那就是" ...

  8. ECMAScript6新特性之Array API

    一 填充数组 var arr = new Array(5); arr.fill('abc',2,4); console.log('Array.prototype.fill',arr); // [und ...

  9. ECMAScript6新特性之Reflect

    一 Reflect.ownKeys()获取对象属性. 可枚举的.不可枚举的.自有的.继承的. let fruit = { '2' : 'mango', [Symbol.for('pink')] : ' ...

随机推荐

  1. ie浏览器部分图片不显示

    前言 前几天做项目时,发现一个奇怪的现象,从后台获取的图片,在IE浏览器端,有一部分不会显示,仔细研究发现是图片本来是.jpg格式,后台传过来的图片后缀已经被改成了.png格式或者其它格式导致IE浏览 ...

  2. UOJ #450「集训队作业2018」复读机

    UOJ #450 题意 有$ k$台复读机,每时每刻有且只有一台复读机进行复读 求$ n$时刻后每台复读机的复读次数都是$ d$的倍数的方案数 $ 1\leq d \leq 3,k \leq 5·10 ...

  3. python模块------shutil

    说明 shutil -- High-level file operations 是一种高层次的文件操作工具 类似于高级API,而且主要强大之处在于其对文件的复制与删除操作更是比较支持好. copy() ...

  4. python算法&二分查找法

    import random def random_list(n): result = [] ids = list(range(1001,1001+n)) a1 = ["赵",&qu ...

  5. OnePlus5刷机后一直检查更新

    大概是由于爱折腾,上一个手机是Nexus5,现在又是Oneplus5,闲来无事就爱刷机. 昨天看OnePlus官网的氧OS更新到Android9.0,于是又开启了刷机旅程. 显然这次没有之前那么顺利, ...

  6. pmi-ACP考试知识点梳理(部分)

    敏捷宣言 个体和互动 高于流程和工具 工作的软件 高于详尽的文档 客户合作 高于合同谈判 响应变化 高于遵循计划 十二条敏捷原则 1 我们最重要的目标,是通过持续不断地及早交付有价值的软件使客户满意. ...

  7. grep、awk、sed的巩固练习

    作者:邓聪聪 提取日志或文本中的关键内容 Apr :: localhost NetworkManager[]: <info> (eno16777736): Activation: star ...

  8. 利用Owin解决CORS报错问题

    我的项目是vue + ASP.NET .在 Vue调试时,由于vue开启的调试用的服务器端口号 和 后台.NET程序的端口号是不同的,发送Ajax请求时,就会报错.这里就不提报错的原因了,网上有很多, ...

  9. es6 总结知识点

    1. let  和 const 只在代码块中有效  {}   js块级作用域. const 定义的对象是可以改变其属性的 const a =[], b={} ; a.push(1); b.a=1; / ...

  10. windows10中微软小娜cortana如何彻底卸载删除?

    windows10中的Cortana可以通过语音干很多事情,但是对于我们来说用处不大,而且开机十分占用内存,下面教大家如何彻底的卸载并删除: 首先下载卸载Cortana的软件,下载链接:http:// ...