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. Bootstrap历练实例:简单的可折叠

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  2. opencv anaconda

    from: http://blog.csdn.net/fairylrt/article/details/43560525 Anaconda是一个python的一个包装,或者不单单是这样.你可以认为An ...

  3. 详解JVM工作原理和特点

    在我们运行和调试Java程序的时候,经常会提到一个JVM的概念.本文将为大家讲解JVM工作原理和特点,希望对大家有所帮助. AD:网+线下沙龙 | 移动APP模式创新:给你一个做APP的理由>& ...

  4. java内存模型原理阅读总结

    Java内存模型可以理解为在特定操作协议下,对特定的内存或高速缓存进行读写访问的过程抽象.不同架构的物理计算机可以有不一样的内存模型,java虚拟机也有自己的内存模型,java虚拟机规范中试图定义一种 ...

  5. 抽屉head部分,hover应用,鼠标放上变色

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. JZOJ 3385. 【NOIP2013模拟】黑魔法师之门

    3385. [NOIP2013模拟]黑魔法师之门 (Standard IO) Time Limits: 1000 ms  Memory Limits: 131072 KB  Detailed Limi ...

  7. DRF工程搭建

    环境安装与配置 DRF需要以下依赖: Python (2.7, 3.2, 3.3, 3.4, 3.5, 3.6) Django (1.10, 1.11, 2.0) DRF是以Django扩展应用的方式 ...

  8. ubuntu版本查看

    cat /proc/version uname -a lsb_release -a

  9. CCPC 2016-2017, Finals

    A. HDU 5999 The Third Cup is Free 简单模拟. B. HDU 6000 Wash n 件衣服, m 个洗衣机,k 个烘干机.每个洗衣机和烘干机需要不同的时间.问 n 件 ...

  10. SpringCloud 微服务一:spring boot 基础项目搭建

    spring cloud是建立在spring boot的基础上的,而之前虽然听说过,也随便看了一下spring boot,却没有真正使用,因此还必须先花时间学一下spring boot. spring ...