ES6为一些已有的功能提供了非破坏性更新,这类新语法能做的事情其实用ES5也可以做,只是会稍微复杂一些,称之为语法糖。

对象属性的简洁表示法

声明的对象中包含若干属性,其属性值由变量表示,且变量名和属性名一样的只写一个变量名即可。比如,var a=[], var obj={a:a},可以简写为var obj={a};

箭头函数

ES6 为我们提供了一种写匿名函数的新方法就是箭头函数,不需要使用function关键字,其参数和函数体之间以=>相连接。

箭头只允许它们赋值给一个变量;

箭头头函数不能用做构造函数,你不能对箭头函数使用new关键字;

箭头函数也没有prototype属性;

箭头函数绑定了词法作用域,不会修改this的指向。

箭头函数返回值为一个对象时,你需要用小括号括起你想返回的对象。

解构赋值

对象解构:对象赋值给用大挂号包裹变量,对象的属性会把对应的属性值赋值给变量。比如

let person = { name: '李白', age: 18 };

let { name, age } = person;

console.log(name); // '李白'

console.log(age);  //18

数组解构,允许你跳过你不想用到的值,在对应地方留白即可,比如

let [a,b,c]=[1,2,3];
console.log(a)//1
console.log(b)//2
console.log(c)//3

块级作用域

const具有和let一致的块作用域,区别在于const声明的变量在声明时必须赋值,不能再被赋予别的值,否则会报错。

通过const声明的变量值并非不可改变,声明的数组本身还是可以添加元素,只是数组的指向不变,引用不变,即内存地址不变。

if(true){
let a=10;
console.log(a);//10
}
console.log(a);//undefined

模板字符串

用反撇号声明,通过模板字符串,你可以在模板中插入任何JavaScript表达式了;插入变量${变量},因为模板字符串本身也是JavaScript表达式,故可以嵌套模板字符串;模板字符串默认支持多行。

var str = `this is ${name}`;

拓展运算符

...,可以把任意可枚举对象转换为数组

把arguments对象换成数组,arguments对象是函数的参数的类数组,包含传递给函数的每个参数,arguments[0],就是函数第一个参数

把字符串转换为由每一个字母组成的数组,

把数组中嵌套的数组合并在一个数组中

function num(n1,n2,n3,n4,n5){
console.log(n1,n2,n3,n4,n5)
}
num(1,2,3,4,5)
const arr=[100,200,300,400,500]
num(arr[0],arr[1],arr[2],arr[3],arr[4])// 100 200 300 400 500
num(...arr) // 100 200 300 400 500

es6语法糖的更多相关文章

  1. ES6 语法糖

    重新认识ES6中的语法糖:https://segmentfault.com/a/1190000010159725

  2. ES6语法糖集锦

    sublime3安装Es6插件 javascriptNext,然后安装即可 Java​Script​Next - ES6 Syntax()高亮插件 -------------------------- ...

  3. 常用处理数据用法es6 语法糖总结

    一 循环(数组 ,集合)   1 forEach-----------可以遍历得到vaue和index   const arr = ['red', 'green', 'blue'];arr.forEa ...

  4. ES6深入浅出-3 三个点运算 & 新版字符串-1.函数与对象的语法糖

    主要讲的内容 时间充裕的话就讲,模板字面量 默认参数值 首先讲es6之前,我们是怎么做的.例如我们要写一个求和的函数, 请两个参数的和,但是如果有的人就是穿一个参数呢? 那么b没有传值,b的值是多少呢 ...

  5. ES6语法的新特性

    ES6 就是ECMAScript 6是新版本JavaScript语言的标准.虽然目前已经更新到ES7,但是很多浏览器还不知处ES7语法,该标准仍在更新中,但目前部门网站都指出ES6的语法.目前ES6也 ...

  6. 详解es6 class语法糖中constructor方法和super的作用

    大多数面向对象的编程语言都支持类和类继承的特性,而JS却不支持这些特性,只能通过其他方法定义并关联多个相似的对象,这种状态一直延续到了ES5.由于类似的库层出不穷,最终还是在ECMAScript 6中 ...

  7. ES6之对象的语法糖

    本文介绍下ES6中对象的一些拓展功能. 这三个语法糖在实际的项目开发中经常会见到.

  8. ES6 class 语法糖不能直接定义原型上的属性

    今天注意到两个东西: 1.为了模拟面向对象,JavaScript的class语法糖屏蔽了原型的概念 class A{ a = 1   // 注意!!这里定义的不是在prototype上的属性,而是给实 ...

  9. 把JavaScript代码改成ES6语法不完全指南

    目录 * 核心例子 * 修改成静态变量(const)或块级变量(let) * 开始修改 * 疑问解释(重复定义会发生什么) * 疑问解释(let的块级作用域是怎样的) * 疑问解释(const定义的变 ...

随机推荐

  1. 1. 线性DP 300. 最长上升子序列 (LIS)

    最经典单串: 300. 最长上升子序列 (LIS) https://leetcode-cn.com/problems/longest-increasing-subsequence/submission ...

  2. Spring第四天,BeanPostProcessor源码分析,彻底搞懂IOC注入及注解优先级问题!

  3. centos 6系统下新磁盘分区(MBR格式)

    添加新磁盘后,fdisk -l查看所有磁盘列表( fdisk只能分区2T以下磁盘,超过2T的用parted命令来进行GPT分区) 然后fdisk -cu /dev/sdb选择要分区的磁盘,按m显示菜单 ...

  4. CURLOPT_FOLLOWLOCATION

    curl爬取过程中,设置CURLOPT_FOLLOWLOCATION为true,则会跟踪爬取重定向页面,否则,不会跟踪重定向页面

  5. ABBYY FineReader 15如何比较文档?

    ABBYY FineReader 15 OCR文字识别软件能帮助用户快速地对比两个文档间的差异,适合用于审阅.修改文档,发现新旧版本差异,预防输出错误版本等情况.此功能既能用于对比同一格式文档的不同版 ...

  6. 细说FL Studio中的Wasp合成器功能

    FL Studio 简称FL,因其Logo像水果,故国人亲切的叫他"水果"本章节采用图文结合的方式给大家讲解FL Studio中的Wasp合成器功能.感兴趣的朋友可以一起来交流哦. ...

  7. H5系列之contenteditable

    其实这个属性很简单,既然把它放到一个单独的文章来说,他肯定有一些注意点要讲 兼容性很好,兼容所有主流浏览器. 用法很简单,只需要给你需要的标签填上即可. <div contenteditable ...

  8. zabbix 用Telegram报警!!!

    第一步:先在Telegram 注册个机器人!!! @BotFather在Telegram中添加联系人并按"开始",然后键入: /newbot输入你要新建的机器人名称在电报中@你的机 ...

  9. LeetCode周赛#208

    本周周赛的题面风格与以往不太一样,但不要被吓着,读懂题意跟着模拟,其实会发现并不会难到哪里去. 1599. 经营摩天轮的最大利润 #模拟 题目链接 题意 摩天轮\(4\)个座舱,每个座舱最多可容纳\( ...

  10. 容器中实现拉取其它服务器的jar包程序

    缘由:在做接口自动化测试时,若业务场景有一个前置仓库,在该仓库内完成一系列的场景测试,一旦某一场景测试失败,脏数据对环境造成影响则需要清理: 1.我容器的内核系统为Debian GNU/Linux 1 ...