一小时学会ECMAScript6新特性(一)
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新特性(一)的更多相关文章
- 一小时学会ECMAScript6新特性
ECMAScript 简介 简称es,是一套标准,javascript就是使用这套标准的语言.主流的浏览器使用的是ECAMScript5,ECAMScript6(ECAMScript2015)是一涛新 ...
- 一小时学会ECMAScript6新特性(二)
1.对象属性名 es5中我们为一个对象添加属性可以用如下代码: let foods = {}; foods.dessert = '蛋糕'; console.log(foods) 但是属性名中间有空格则 ...
- ECMAScript6新特性之let、const
第一次在博客园写博客,想把自己每一天学习到的知识点记录下来,心里有点紧张(PS:不知道自己能不能写好......嘿嘿).言归正传,咱们先来说说"ECMAScript"这到底是啥玩意 ...
- 轻松学会ES6新特性之生成器
生成器虽然是ES6最具魔性的新特性,但也是最难懂得的一节,笔者写了大量的实例来具体化这种抽象的概念,能够让人一看就懂,目的是希望别人不要重复或者减少笔者学习生成器的痛苦经历. 在说具体的ES6生成器之 ...
- web全栈架构师[笔记] — 01 ECMAScript6新特性
ES6新特性 一.变量 var:重复定义不报错:没有块级作用域:不能限制修改 let:变量,不能重复定义,有块级作用域 const:常量,不能重复定义,有块级作用域 二.函数/参数 箭头函数——简写: ...
- ECMAScript6 | 新特性(部分)
新特性概览 参考文章:http://www.cnblogs.com/Wayou/p/es6_new_features.html 这位前辈写的很好,建议深入学习 ———————————————————— ...
- ECMAscript6新特性之解构赋值
在以前,我们要对变量赋值,只能直接指定值.比如:var a = 1;var b = 2;但是发现这种写法写起来有点麻烦,一点都不简洁,而在ECMAScript6中引入了一种新的概念,那就是" ...
- ECMAScript6新特性之Array API
一 填充数组 var arr = new Array(5); arr.fill('abc',2,4); console.log('Array.prototype.fill',arr); // [und ...
- ECMAScript6新特性之Reflect
一 Reflect.ownKeys()获取对象属性. 可枚举的.不可枚举的.自有的.继承的. let fruit = { '2' : 'mango', [Symbol.for('pink')] : ' ...
随机推荐
- Java(15) 多态
一.多态 1.1 多态:一个事物的多种形态 1.2 多态的表现 行为(方法)多态:重写和重载. 引用多态(动态绑定):编译时的类型和运行时不一致的这种现象 例:父类 = 子类 Pet p = ne ...
- 彻底解决MacOS上应用程序快捷键冲突的问题,自定义快捷键设置
1看图操作 上面选择好你要修改的应用程序的快捷键 ,我以Chrome为例子 最后点击下ADD 然后回到Chrome的菜单,发现刷新页的快捷键变成了F5 注意,快捷键的名字要和你Chrome菜单上的名字 ...
- Python的re模块中search与match的区别
1.search和match: search:在整个字符中匹配,如果找不到匹配的就返回None match:在字符串开始位置匹配如果不匹配就返回None 2.效率对比: search: match:
- 清北学堂2019NOIP提高储备营DAY1
今天是第二次培训的第一天,关于NOIP的基础算法,主要内容如下: $1.枚举 $2.搜索 $3.贪心 $1.枚举: •定义: 枚举又叫做穷举,是一种基础的算法,其思路主要是:从问题中有可能的解集中一一 ...
- iOS 单选框
iOS 单选框,可自定义横向和纵向显示,可定义显示的个数和内容,自定义间距,提供block 和代理方法可供使用,欢迎拍砖! github地址: https://github.com/joshuaGen ...
- zabbix3.2利用自动发现功能对fastcgi模式的php状态进行集中监控
zabbix3.2利用自动发现功能对fastcgi模式的php状态进行集中监控 前端nginx虚拟主机引用后端多个php接口,为了方便监控,将后端服务器集中配置在nginx中,具体配置如下: [roo ...
- @RunWith注解作用
@RunWith就是一个运行器 @RunWith(JUnit4.class)就是指用JUnit4来运行 @RunWith(SpringJUnit4ClassRunner.class),让测试运行于Sp ...
- 基于用户的协同过滤电影推荐user-CF python
协同过滤包括基于物品的协同过滤和基于用户的协同过滤,本文基于电影评分数据做基于用户的推荐 主要做三个部分:1.读取数据:2.构建用户与用户的相似度矩阵:3.进行推荐: 查看数据u.data 主要用到前 ...
- 在django中uwsgi的使用,以及安装
首先了解wsgi是一个python web服务器,uwsgi实现了wsgi所有的功能,性能稳定,效率高的服务器: 1.安装uwsgi pip install uwsgi 2.配置uwsgi [uwsg ...
- selenium截图
文件结构 1.DateUtil.py # cncoding = utf-8 import time from datetime import datetime ''' 本文件主要用于获取当前的日期以及 ...