ES6允许使用“箭头”(=>)定义函数

var f = a = > a

//等同于
var f = function(a){
return a;
}

如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分。

//无形参
var f = () => 2;
// 等同于
var f = function () { return 2 }; //多个形参
var sum = (a, b) => a + b;
// 等同于
var sum = function(a, b) {
return a + b;
};

使用箭头函数注意点:

箭头函数有几个使用注意点。

(1)函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。

var name = '张三';
var person = {
name:'李四',
age:18,  
fav:function(){
console.log(this);
console.log(this.name); // 李四
}
} person.fav(); // 此时this指向的是使用它的对象,也就是person对象
var person2 = {
name: '李四',
age: 18,
fav: () => {
// 当前this指向了定义时所在的对象(window)
console.log(this);
}
}; person2.fav();
// 使用箭头函数,它表示定义时所在的对象window。

单体模式:

var person = {
name: '小马哥',
age: 18,
fav(){
console.log(this.name); // 小马哥
}
} person.fav();

(2)不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。

    var p1 = {
name:'张三',
age:18,
fav:function () {
console.log(arguments)
}
}
p1.fav('泡妞','把妹') // Arguments(2) ["泡妞", "把妹", callee: ƒ, Symbol(Symbol.iterator): ƒ] // ******************************************************* var p2 = {
name:'张三',
age:18,
fav:()=>{
console.log(arguments)
}
}
p2.fav('泡妞','把妹') // Uncaught ReferenceError: arguments is not defined

js中箭头函数 及 针对箭头函数this指向问题引出的单体模式的更多相关文章

  1. js中escape对应的C#解码函数 UrlDecode

    js中escape对应的C#解码函数 System.Web.HttpUtility.UrlDecode(s),使用过程中有以下几点需要注意   js中escape对应的C#解码函数 System.We ...

  2. js中各个排序算法和sort函数的比较

    js中要实现数据排序,其实只需要用sort函数就能很好的满足了,但是我今天想知道他和其他排序算法的区别,比如耗时呀等.测了一组数据如下: // ---------- 一些排序算法 Sort = {} ...

  3. js中bind、call、apply函数的用法

    最近一直在用 js 写游戏服务器,我也接触 js 时间不长,大学的时候用 js 做过一个 H3C 的 web的项目,然后在腾讯实习的时候用 js 写过一些奇怪的程序,自己也用 js 写过几个的网站.但 ...

  4. js中bind、call、apply函数的用法 (转载)

    最近看了一篇不错的有关js的文章,转载过来收藏先!!! 最近一直在用 js 写游戏服务器,我也接触 js 时间不长,大学的时候用 js 做过一个 H3C 的 web 的项目,然后在腾讯实习的时候用 j ...

  5. js中this绑定方式及如何改变this指向

    this的绑定方式基本有以下几种: 隐式绑定 显式绑定 new 绑定 window 绑定 箭头函数绑定 隐式绑定 第一个也是最常见的规则称为 隐式绑定. var a = { str: 'hello', ...

  6. js中的join(),reverse()与 split()函数用法解析

    <script> /* * 1:arrayObject.reverse() * 注意: 该方法会改变原来的数组,而不会创建新的数组.此函数可以将数组倒序排列 * 2:arrayObject ...

  7. js中浏览器兼容startsWith 、endsWith 函数

    在做js开发的时候用到了startsWith函数时,发现各个浏览器不兼容问题,因为对开发来说,chrome浏览器最好用,就一直在chrome浏览器中使用这两个函数没有任何问题,但在ie浏览器访问就直接 ...

  8. js中列表控件排序箭头,在wke中不支持的解决办法

    列表中箭头,实际使用的在线css样式,wke不支持排序箭头(实际是字体)的在线css样式,可以客户端安装对应的字体,之后显示就正常了.

  9. 深入解析js中基本数据类型与引用类型,函数参数传递的区别

    ECMAScript的数据有两种类型:基本类型值和引用类型值,基本类型指的是简单的数据段,引用类型指的是可能由多个值构成的对象. Undefined.Null.Boolean.Number和Strin ...

随机推荐

  1. 【crontab】误删crontab及其恢复

    中秋节快到了,首先祝自己中秋快乐. 昨天下午六点,心里正想着加完一个crontab就可以下班了.本来想执行 crontab -e的,没想到手一抖就输入了crontab ,然后就进入了下面这个样子.

  2. node中controller的get和post方法获取参数

    1.get: const body = ctx.query; // get请求   2.post: const body = ctx.request.body; // post请求

  3. linux-PXE-12

    以DHCP+DNS模式管理服务器IP地址和主机名.服务器上架前,以其MAC地址为依据,在DHCP中配置主机保留并分配主机名.DHCP结合TFTP提供的PXE服务,提供PXE引导Linux内核和启动镜像 ...

  4. 【canvas学习笔记五】使用图片

    在canvas里画图有两个步骤: 获得图片源. drawImage()画图. 图片源 canvas支持以下几种图片资源: HTMLImageElement 可以使用Image()方法构造的图片,也可以 ...

  5. Jar包方式运行web项目

    使用Maven进行打包 在自己的电脑终端中进入到pom.xml文件的目录中执行maven打包.命令为: mvn clean package 1 成功的标志为​上面显示BUILD SUCCESS成功打包 ...

  6. 多线程之Tread类和Runnable的区别

    一.run()方法和start()方法的区别 在java中可有两种方式实现多线程,一种是继承Thread类,一种是实现Runnable接口:Thread类是在java.lang包中定义的.一个类只要继 ...

  7. Laravel提交POST请求报错

    提交POST请求出现如下错误: The page has expired due to inactivity Please refresh and try again 这是由于在Laravel框架中有 ...

  8. 小菜鸟 菜谈 KMP->字典树->AC自动机->trie 图 (改进与不改进)

    本文的主要宗旨是总结自己看了大佬们对AC自动机和trie 图 的一些理解与看法.(前沿:本人水平有限,总结有误,希望大佬们可以指出) KMP分割线--------------------------- ...

  9. 如何让你的JS代码写的更漂亮

    感觉这篇文章总结的js的规范写法不错,拿来收藏.转自:https://mp.weixin.qq.com/s/AtR94IL9BW9EXOTnKOilmA 1. 按强类型风格写代码 JS是弱类型的,但是 ...

  10. 一、基础篇--1.1Java基础-自定义注解的场景及实现

    自定义注解使用场景: 类属性自动赋值,例如对上下文.传入参数等赋值 验证对象属性完整性,例如,对参数的校验 代替配置文件功能,像spring基于注解的配置 可以生成文档,例如java 最早提供的注解. ...