ES6标准之箭头函数
语法
具有一个参数的简单函数
var single = a => a
single('hello, world') // 'hello, world'没有参数的需要用在箭头前加上小括号
var log = () => {
alert('no param')
}多个参数需要用到小括号,参数间逗号间隔,例如两个数字相加
var add = (a, b) => a + b
add(3, 8) //函数体多条语句需要用到大括号
var add = (a, b) => {
if (typeof a == 'number' && typeof b == 'number') {
return a + b
} else {
return 0
}
}返回对象时需要用小括号包起来,因为大括号被占用解释为代码块了
var getHash = arr => {
// ...
return ({
name: 'Jack',
age: 33
})
}直接作为事件handler
document.addEventListener('click', ev => {
console.log(ev)
})作为数组排序回调
var arr = [1, 9 , 2, 4, 3, 8].sort((a, b) => {
if (a - b > 0 ) {
return 1
} else {
return -1
}
})
arr // [1, 2, 3, 4, 8, 9]
特性
this:用function生成的函数会定义一个自己的this,而箭头函数没有自己的this,而是会和上一层的作用域共享this。
apply & call:由于箭头函数已经绑定了this的值,即使使用apply或者call也不能只能起到传参数的作用,并不能强行改变箭头函数里的this。
arguments:普通函数里arguments代表了调用时传入的参数,但是箭头函数不然,箭头函数会把arguments当成一个普通的变量,顺着作用域链由内而外地查询。
不能被new:箭头函数不能与new关键字一起使用,会报错。
typeof运算符和普通的function一样:
var func = a => a
console.log(typeof func); // "function"instanceof也返回true,表明也是Function的实例:
console.log(func instanceof Function); // true
ES6标准之箭头函数的更多相关文章
- [js高手之路] es6系列教程 - 箭头函数详解
箭头函数是es6新增的非常有意思的特性,初次写起来,可能会觉得别扭,习惯之后,会发现很精简. 什么是箭头函数? 箭头函数是一种使用箭头( => )定义函数的新语法, 主要有以下特性: 不能通过n ...
- ES6学习之箭头函数
ES6学习笔记--箭头函数 箭头函数一直在用,最近突然想到重新看一下箭头函数的用法,所以这里做一些总结. 箭头函数长这个样子: let fn = a => a++; // fn 是函数名, a= ...
- 前端项目中常用es6知识总结 -- 箭头函数及this指向、尾调用优化
项目开发中一些常用的es6知识,主要是为以后分享小程序开发.node+koa项目开发以及vueSSR(vue服务端渲染)做个前置铺垫. 项目开发常用es6介绍 1.块级作用域 let const 2. ...
- ES6系列之箭头函数
本系列是在平时阅读.学习.实际项目中有关于es6中的新特性.用发的简单总结,目的是记录以备日后温习:本系列预计包含let/const.箭头函数.解构.常用新增方法.Symbol.Set&Map ...
- JS ES6中的箭头函数(Arrow Functions)使用
转载这篇ES6的箭头函数方便自己查阅. ES6可以使用“箭头”(=>)定义函数,注意是函数,不要使用这种方式定义类(构造器). 一.语法 基础语法 (参数1, 参数2, …, 参数N) => ...
- es6学习笔记--箭头函数
基本用法 ES6允许使用“箭头”(=>)定义函数. var f = v => v; 上面的箭头函数等同于: var f = function(v) { return v; }; 如果箭头函 ...
- codewars--js--Reverse or rotate?----es6变量,箭头函数,正则取块
问题描述: 对输入的str按照sz个数进行分块,若一块内所有数字的立方和是偶数,则倒序:否则,向左移动一位.然后将修改过的块整合到一个字符串,作为输出. The input is a string s ...
- 从 ES6 高阶箭头函数理解函数柯里化
前言:第一次看到多个连续箭头函数是在一个 react 项目中,然鹅确认了下眼神,并不是对的人,因为看得一脸懵逼.em......于是开始各种搜索,先是知道了多个连续箭头函数就是 es6 的多次柯里化的 ...
- ES6中的箭头函数
关于函数表达式中的this:自动引用正在调用当前方法的.前的对象1.obj.fun()中的this fun中的this -> obj2.new Fun() Fun中的this -> 正在创 ...
随机推荐
- HTML、CSS知识点,面试开发都会需要--No.5 文章段落
No.5 文章段落 1.文字属性 文字属性包含font-*和text-*两类. 2.基于font的属性 (1)font-family:字体属性,多个字体之前用逗号隔开.如果第一个字体没找到,则依次找后 ...
- post方式接口测试(二)_参数化
一.在postman中可设置环境变量和全局变量 二.设置好后直接在请求中使用: 三.get请求,需要将参数直接出现在URL上,直接点击 Params
- php 与mysql 数据库
新手上路,php刚学,数据库刚学,花了两天终于读到数据库的数据了. 一路上的坎坷我在这里吐槽吐槽: <?php $mysql_server_name='localhost'; //改成自己的my ...
- -webkit-line-clamp、-webkit-box-orient vue 打包部署后不起作用??
场景分析:实际开发中,文字描述过长,需要两行或三行显示缩略显示: 实现过程: 实现过程遇到的问题:打包到线上后发现并没有-webkit-box-orient属性,导致省略号并没有按预期展示: 解决方法 ...
- CentOS下rpm命令详解
CentOS下rpm命令详解 rpm,Redhat Package Manager,即为红帽公司为RHEL开发的专用包管理器,后来更改为RPM Package Manager,类似于GNU项目,使用递 ...
- 2、jeecg 笔记之 t:dictSelect 或 t:dgCol 自定义字典
1.需求 先说一下需求场景吧,我们知道 jeecg 中提供了下拉,其中包含两种使用场景: 一种是直接通过 t:dictSelect 使用,再就是 t:dgCol 用于表头的列表工具条标签: 总之就是 ...
- .net ML机器学习中遇见错误记录
避免入坑: 1.错误提示 numClasses must be at least 2 大概是训练模型的数据分类必须是两种,如下错误: 正确数据集如下:
- wordpress调用the_excerpt()不带<p>标签
我们知道wordpress调用摘要内容用<?php the_excerpt(); ?>就可以,但是它会自动添加一个p标签,例如<p>这里是description</p&g ...
- A标签中 href 和 onclick用法、区别、优先级别
(内容摘自:https://blog.csdn.net/chenchunlin526/article/details/77346049) Html A标签中 href 和 onclick 同时使用的问 ...
- cocos2d-x 贡献一个oss上传脚本
平常写前端项目和H5游戏时特别频繁的一个操作就是上传到oss上,特别浪费时间.所以用ali-oss写了一个脚本.配置属性后直接npm run oss就能上传到oss上了.再也不需要手动操作.现在是脚本 ...