语法

  1. 具有一个参数的简单函数

    var single = a => a
    single('hello, world') // 'hello, world'
  2. 没有参数的需要用在箭头前加上小括号

    var log = () => {
    alert('no param')
    }
  3. 多个参数需要用到小括号,参数间逗号间隔,例如两个数字相加

    var add = (a, b) => a + b
    add(3, 8) //
  4. 函数体多条语句需要用到大括号

    var add = (a, b) => {
    if (typeof a == 'number' && typeof b == 'number') {
    return a + b
    } else {
    return 0
    }
    }
  5. 返回对象时需要用小括号包起来,因为大括号被占用解释为代码块了

    var getHash = arr => {
    // ...
    return ({
    name: 'Jack',
    age: 33
    })
    }
  6. 直接作为事件handler

    document.addEventListener('click', ev => {
    console.log(ev)
    })
  7. 作为数组排序回调

    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]

特性

  1. this:用function生成的函数会定义一个自己的this,而箭头函数没有自己的this,而是会和上一层的作用域共享this。

  2. apply & call:由于箭头函数已经绑定了this的值,即使使用apply或者call也不能只能起到传参数的作用,并不能强行改变箭头函数里的this。

  3. arguments:普通函数里arguments代表了调用时传入的参数,但是箭头函数不然,箭头函数会把arguments当成一个普通的变量,顺着作用域链由内而外地查询。

  4. 不能被new:箭头函数不能与new关键字一起使用,会报错。

  5. typeof运算符和普通的function一样:

    var func = a => a
    console.log(typeof func); // "function"
  6. instanceof也返回true,表明也是Function的实例:

    console.log(func instanceof Function); // true

ES6标准之箭头函数的更多相关文章

  1. [js高手之路] es6系列教程 - 箭头函数详解

    箭头函数是es6新增的非常有意思的特性,初次写起来,可能会觉得别扭,习惯之后,会发现很精简. 什么是箭头函数? 箭头函数是一种使用箭头( => )定义函数的新语法, 主要有以下特性: 不能通过n ...

  2. ES6学习之箭头函数

    ES6学习笔记--箭头函数 箭头函数一直在用,最近突然想到重新看一下箭头函数的用法,所以这里做一些总结. 箭头函数长这个样子: let fn = a => a++; // fn 是函数名, a= ...

  3. 前端项目中常用es6知识总结 -- 箭头函数及this指向、尾调用优化

    项目开发中一些常用的es6知识,主要是为以后分享小程序开发.node+koa项目开发以及vueSSR(vue服务端渲染)做个前置铺垫. 项目开发常用es6介绍 1.块级作用域 let const 2. ...

  4. ES6系列之箭头函数

    本系列是在平时阅读.学习.实际项目中有关于es6中的新特性.用发的简单总结,目的是记录以备日后温习:本系列预计包含let/const.箭头函数.解构.常用新增方法.Symbol.Set&Map ...

  5. JS ES6中的箭头函数(Arrow Functions)使用

    转载这篇ES6的箭头函数方便自己查阅. ES6可以使用“箭头”(=>)定义函数,注意是函数,不要使用这种方式定义类(构造器). 一.语法 基础语法 (参数1, 参数2, …, 参数N) => ...

  6. es6学习笔记--箭头函数

    基本用法 ES6允许使用“箭头”(=>)定义函数. var f = v => v; 上面的箭头函数等同于: var f = function(v) { return v; }; 如果箭头函 ...

  7. codewars--js--Reverse or rotate?----es6变量,箭头函数,正则取块

    问题描述: 对输入的str按照sz个数进行分块,若一块内所有数字的立方和是偶数,则倒序:否则,向左移动一位.然后将修改过的块整合到一个字符串,作为输出. The input is a string s ...

  8. 从 ES6 高阶箭头函数理解函数柯里化

    前言:第一次看到多个连续箭头函数是在一个 react 项目中,然鹅确认了下眼神,并不是对的人,因为看得一脸懵逼.em......于是开始各种搜索,先是知道了多个连续箭头函数就是 es6 的多次柯里化的 ...

  9. ES6中的箭头函数

    关于函数表达式中的this:自动引用正在调用当前方法的.前的对象1.obj.fun()中的this fun中的this -> obj2.new Fun() Fun中的this -> 正在创 ...

随机推荐

  1. ERP项目实施记录09

    今天报价软件测试版本出来了,可看上去不怎么像是一款报价的软件,整个界面上都没有"报价"相关的字眼: 软件标题就不说了,反正影响不大,就当没看见,可左边这一大片菜单里也找不到和报价有 ...

  2. java 和 c++ 实现的各种基础数据结构和算法

    https://github.com/phishman3579/java-algorithms-implementation https://github.com/xorz57/forest

  3. PowerBI更新 - 解决方案架构 - PowerBI Solution Architecture(一图胜万字!)

    2019/04更新 参见这里 今天发福利啦!发福利啦!发福利啦! 企业的各种数据整合到PowerBI显示,浏览器,移动端显示关键指标. 一个很好的PowerBI解决方案的图!一图胜万字!你所需要知道的 ...

  4. ajax 显示,删除,批量删除,修改反填功能实现

    1.页面代码 <body> <h1>显示所有员工信息</h1> <input id="Button1" type="button ...

  5. Qt 半模式对话框

    今天看视频,学习好半模式对话框,好新奇哟,这里记录下来. 半模式对话框,介于模式对话框和飞模式对话框之间.半模式对话框会像模式对话框一样阻塞主界面的事件响应,同时,半模式对话框会像非模态对话框一样,立 ...

  6. DoubleDQN---tensorflow实现

    完整代码:https://github.com/zle1992/Reinforcement_Learning_Game 开山之作: <Playing Atari with Deep Reinfo ...

  7. tensorflow神奇问题

    运行tensorflow程序时,遇到了各种奇葩的问题,比如: 1.Import Error: DLL load failed: The specified module could not be fo ...

  8. String 常用方法

    // 不会改变原字符串string.substring(startIndex, endIndex) —— 根据头尾位置返回一个字符串 string.substr(startIndex, length) ...

  9. week_one-python格式化输出

    1.多行格式化输出 (1) # Author:larlly name = input("input your name :") age = input("input yo ...

  10. spring jar包依赖