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允许使用“箭头”(=>)定义函数: 函数不带参数 定义方法:函数名称 = () => 函数体 ...
随机推荐
- Spring Boot 2.x零基础入门到高级实战教程
一.零基础快速入门SpringBoot2.0 1.SpringBoot2.x课程全套介绍和高手系列知识点 简介:介绍SpringBoot2.x课程大纲章节 java基础,jdk环境,maven基础 2 ...
- C++大数问题
1.大数的加法 语法:add(char a[],char b[],char s[]); 参数: a[]:被加数,用字符串表示,位数不限 b[]:加数,用字符串表示,位数不限 s[]:结果,用字符串表示 ...
- django+xadmin在线教育平台(三)
通过留言版功能回顾django基础知识 将对于django目录结构,使用Django快速搭建可以提交的表单页面,models.py , urls.py, views.py. 从数据库中取出数据展示到h ...
- spark实战之网站日志分析
前面一篇应该算是比较详细的介绍了spark的基础知识,在了解了一些spark的知识之后相必大家对spark应该不算陌生了吧!如果你之前写过MapReduce,现在对spark也很熟悉的话我想你再也不想 ...
- codeforces 258D DP
D. Little Elephant and Broken Sorting time limit per test 2 seconds memory limit per test 256 megaby ...
- C++从键盘读入数组并存储
C++从键盘读取任意长度的数组,现总结如下: //读取指定长度的数组 int main() { int n = 0; cin >> n; vector<int> p(n); f ...
- 码农与UI沟通的日常
事情是这样的,这是一个兴趣群组的效果图. 我看了一眼没有帖子时的提示,觉得这样的提示 不走心 不能展现出我们团队对于人生及世界的深度理解和高尚的品格. 于是,我选择了表达内心的真实感受. 我觉得这完美 ...
- 【Decode Ways】cpp
题目: A message containing letters from A-Z is being encoded to numbers using the following mapping: ' ...
- php 实现栈与队列
<?php class queueOp{ /* * 队尾入队 * Return:处理之后队列的元素个数 */ public function tailEnquque($arr,$val){ re ...
- C# 中的 #region 和 #endregion 的作用
C#中的 #region 和 #endregion 表示一块区域,这样在 Visual Studio 中可以将这块区域的代码折叠起来,便于查看. 虽然Visual Studio 也响应大括号的折叠,但 ...