var f = v => v;

等同于:

var f = function(v) {
return v;
};

箭头函数可以与变量解构结合使用:

const full = ({ first, last }) => first + ' ' + last;

// 等同于
function full(person) {
return person.first + ' ' + person.last;
}

箭头函数的一个用处是简化回调函数:

// 正常函数写法
var result = values.sort(function (a, b) {
return a - b;
}); // 箭头函数写法
var result = values.sort((a, b) => a - b);

函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象

箭头函数里面根本没有自己的this,而是引用外层的this

如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分:

var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2) {
return num1 + num2;
};

2

a 模板字符串(template string)

用反引号(`)来标识起始,用${}来引用变量

$("#result").append(`
There are <b>${basket.count}</b> items
in your basket, <em>${basket.onSale}</em>
are on sale!
`);

b ES6 允许为函数的参数设置默认值,即直接写在参数定义的后面

function log(x, y = 'World') {
console.log(x, y);
} log('Hello') // Hello World
log('Hello', 'China') // Hello China
log('Hello', '') // Hello

3 其他特性

1 let为js增加了快级作用域
2 var命令会发生变量提升现象,即变量可以在声明之前使用,值为undefined,let命令不存在命令提升
3 let不允许在相同作用域内,重复声明同一个变量
4 没有块级作用域:a ES5 只有全局作用域和函数作用域,没有块级作用域 内层变量可能会覆盖外层变量 b用来计数的循环变量泄露为全局变量
const:
1 const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值
2 为了保持兼容性,var命令和function命令声明的全局变量,依旧是顶层对象的属性;
另一方面规定,let命令、const命令、class命令声明的全局变量,不属于顶层对象的属性
解构赋值
用途:a:交换变量的值 b 从函数返回多个值 c 提取JSON数据 d 函数参数的定义 e

ES6箭头函数及模版字符串的更多相关文章

  1. es6箭头函数讲解

    es6箭头函数的用法 箭头函数是es6的一种函数的简写方法. 如下: var f = v = > v; //等同于 var f = function(v){ return v; } var su ...

  2. es6箭头函数 this 指向问题

    es5中 this 的指向 var factory = function(){ this.a = 'a'; this.b = 'b'; this.c = { a:'a+', b:function(){ ...

  3. ES6 — 箭头函数

    一 为什么要有箭头函数 我们在日常开发中,可能会需要写类似下面的代码 const Person = { 'name': 'little bear', 'age': 18, 'sayHello': fu ...

  4. 前端分享----JS异步编程+ES6箭头函数

    前端分享----JS异步编程+ES6箭头函数 ##概述Javascript语言的执行环境是"单线程"(single thread).所谓"单线程",就是指一次只 ...

  5. ES6 箭头函数 this 指向

    ES6 箭头函数 this 指向 箭头函数有几个使用注意点: 函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象. 不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个 ...

  6. ES6 箭头函数(Arrow Functions)

    ES6 箭头函数(Arrow Functions) ES6 可以使用 "箭头"(=>)定义函数,注意是函数,不要使用这种方式定义类(构造器). 一.语法 具有一个参数的简单函 ...

  7. ES6箭头函数基本用法

    ES6箭头函数基本用法 ``` window.onload = function(){ alert(abc); } //箭头函数 window.onload = ()=>{ alert(&quo ...

  8. ES6 箭头函数this指向问题

    var name = "window"; var person1 = { name: "person1", show1: function() { consol ...

  9. Vue ES6箭头函数使用总结

    Vue ES6箭头函数使用总结   by:授客 QQ:1033553122   箭头函数 ES6允许使用“箭头”(=>)定义函数: 函数不带参数 定义方法:函数名称 = () => 函数体 ...

随机推荐

  1. JS中进行浮点数计算式,遇到的问题

    今天在做项目时,需要在页面进行计算,但是当两个数都是小数时,计算的结果却不是想象中的: 比如1371.3-0.9算出来却是1370.39999999,后来上网搜一下,原来js是弱类型语言,没有那么高的 ...

  2. React后台管理系统-ajax请求封装

    1.新建文件夹 util , 在util里边新建 mm.jsx文件 2.使用jquery里边的ajax发送请求,回调用promise,返回一个promise对象 request(param){     ...

  3. 问题007:JDK版本与JRE版本不同导致java.exe执行类文件错误 java.lang.UnsupportedClassVersionError错误

    版本不同的原因是,Windows 系统之前安装了JRE 是别的版本的 解决方法,将其卸载,卸载后可以正常使用,不再错误提示.

  4. CURLOPT_PROGRESSFUNCTION

    Author:李强(李祥祥) Date   :2012-12-15 17:26 LIBCURL官方网站都没有说清楚道明白进度函数的参数的作用,这点我感觉文档很片面,经总结如下: size_t CUpl ...

  5. GNU汇编逻辑或算数左移右移

    lsl 左移 .text .global  _start _start: mov r1,#0b1 mov r1,r1,lsl#2 ROR循环右移 .text .global  _start _star ...

  6. spring MVC体系结构和请求控制器

    MVC处理过程 spring MVC架构模式都进行了分层设计如下 数据访问接口:DAO层 处理业务逻辑层:service层 数据实体:POJO 负责前端请求的接受并处理:servlet 负责前端页面展 ...

  7. 如何禁止用户连续点击一个按钮事件详细JS

    <input type="button" id="submit" value="提交"> <script> $(do ...

  8. Fakeapp 入门教程(2):使用篇!

    Fakeapp软件的使用主要分成了三个步骤, 使用之前请确保你的电脑配置还可以,推荐配置是:一张显存大于4G的N卡.Fakeapp是有支持CPU选项,但是用CPU跑非常慢. 获取脸部图片 训练模型 生 ...

  9. A1009 Product of Polynomials (25)(25 分)

    A1009 Product of Polynomials (25)(25 分) This time, you are supposed to find A*B where A and B are tw ...

  10. 3 ways of including JavaScript in HTML

    Code written in JavaScript must be executed from a document written in HTML. There are three ways of ...