ES6箭头函数及模版字符串
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箭头函数及模版字符串的更多相关文章
- es6箭头函数讲解
es6箭头函数的用法 箭头函数是es6的一种函数的简写方法. 如下: var f = v = > v; //等同于 var f = function(v){ return v; } var su ...
- es6箭头函数 this 指向问题
es5中 this 的指向 var factory = function(){ this.a = 'a'; this.b = 'b'; this.c = { a:'a+', b:function(){ ...
- ES6 — 箭头函数
一 为什么要有箭头函数 我们在日常开发中,可能会需要写类似下面的代码 const Person = { 'name': 'little bear', 'age': 18, 'sayHello': fu ...
- 前端分享----JS异步编程+ES6箭头函数
前端分享----JS异步编程+ES6箭头函数 ##概述Javascript语言的执行环境是"单线程"(single thread).所谓"单线程",就是指一次只 ...
- ES6 箭头函数 this 指向
ES6 箭头函数 this 指向 箭头函数有几个使用注意点: 函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象. 不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个 ...
- ES6 箭头函数(Arrow Functions)
ES6 箭头函数(Arrow Functions) ES6 可以使用 "箭头"(=>)定义函数,注意是函数,不要使用这种方式定义类(构造器). 一.语法 具有一个参数的简单函 ...
- ES6箭头函数基本用法
ES6箭头函数基本用法 ``` window.onload = function(){ alert(abc); } //箭头函数 window.onload = ()=>{ alert(&quo ...
- ES6 箭头函数this指向问题
var name = "window"; var person1 = { name: "person1", show1: function() { consol ...
- Vue ES6箭头函数使用总结
Vue ES6箭头函数使用总结 by:授客 QQ:1033553122 箭头函数 ES6允许使用“箭头”(=>)定义函数: 函数不带参数 定义方法:函数名称 = () => 函数体 ...
随机推荐
- Java基础面试题:String 和StringBuffer的区别
package com.swift; import java.util.Date; public class Getclass_Test extends Date { public static vo ...
- 记录JQ-WEUI中滚动加载的一个BUG
最近写微信公众号,用到的技术栈是jq+vue的混合开发,采用的UI是移动端比较火的WEUI,在微信开发中应该较广泛.个人看惯了elementUI文档,相对于饿了么组件文档的详细,WEUI的文档还是比较 ...
- Binary Agents-freecodecamp算法题目
Binary Agents 1.要求 传入二进制字符串,翻译成英语句子并返回. 二进制字符串是以空格分隔的. 2.思路 用.split(' ')将输入二进制字符串转化为各个二进制数字符串组成的数组 用 ...
- Java中json前后端日期传递处理
这里推荐2种方式 依赖包 <dependency> <groupId>com.fasterxml.jackson.core</groupId> <artifa ...
- gitLab 服务器搭建 (自己服务器上搭建gitLab)
环境 lunix(ubuntu) 1:添加文件 在 /etc/apt/sources.list.d/gitlab-ce.list 中添加一行 deb https://mirrors.tuna.ts ...
- 16.VUE学习之-v-show的使用与v-if的差异对比
v-show的使用与v-if的差异对比 相同点: 都可以达到隐藏和显示的效果. 不同点: v-show 会用display:none 来隐藏元素节点,推荐使用这种方式 v-if 会移除节点,可以配合v ...
- 迭代器Iterator与语法糖for-each
一.为什么需要迭代器 设计模式迭代器 迭代器作用于集合,是用来遍历集合元素的对象.迭代器迭代器不是Java独有的,大部分高级语言都提供了迭代器来遍历集合.实际上,迭代器是一种设计模式: 迭代器模式提供 ...
- Python之路--Python初识
Python简介 python的创始人为吉多·范罗苏姆(Guido van Rossum).1989年的圣诞节期间,吉多·范罗苏姆(中文名字:龟叔)为了在阿姆斯特丹打发时间,决心开发一个新的脚本解释程 ...
- 问题 B: 分组统计
分组统计 问题 B: 分组统计时间限制: 1 Sec 内存限制: 32 MB 提交: 416 解决: 107 [提交][状态][讨论版][命题人:外部导入] 题目描述 先输入一组数,然后输入其分组,按 ...
- BZOJ - 2744 朋友圈 (二分图上的最大团)
[题目大意] 在很久很久以前,曾经有两个国家和睦相处,无忧无虑的生活着.一年一度的评比大会开始了,作为和平的两国,一个朋友圈数量最多的永远都是最值得他人的尊敬,所以现在就是需要你求朋友圈的最大数目.两 ...