es6--箭头函数

基本用法

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

var f = v => v;

上面的箭头函数等同于:

var f = function(v) {return v;
};

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

复制代码
var f = () => 5;
// 等同于
var f = function () { return 5 };var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2) {return num1 + num2;
};
复制代码

如果箭头函数的代码块部分多于一条语句,就要使用大括号将它们括起来,并且使用return语句返回。

var sum = (num1, num2) => { return num1 + num2; }

由于大括号被解释为代码块,所以如果箭头函数直接返回一个对象,必须在对象外面加上括号。

var getTempItem = id => ({ id: id, name: "Temp" });

箭头函数可以与变量解构结合使用。

复制代码
const full = ({ first, last }) => first + ' ' + last;// 等同于
function full(person) {return person.first + ' ' + person.last;
}
复制代码

使用注意点

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

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

(2)不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误。

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

(4)不可以使用yield命令,因此箭头函数不能用作Generator函数。

this指向的固定化,并不是因为箭头函数内部有绑定this的机制,实际原因是箭头函数根本没有自己的this,导致内部的this就是外层代码块的this。正是因为它没有this,所以也就不能用作构造函数。

除了this,以下三个变量在箭头函数之中也是不存在的,指向外层函数的对应变量:argumentssupernew.target

复制代码
function foo() {setTimeout(() => {console.log('args:', arguments);}, 100);
}foo(2, 4, 6, 8)
// args: [2, 4, 6, 8]
复制代码

上面代码中,箭头函数内部的变量arguments,其实是函数fooarguments变量。

另外,由于箭头函数没有自己的this,所以当然也就不能用call()apply()bind()这些方法去改变this的指向。

复制代码
(function() {return [(() => this.x).bind({ x: 'inner' })()];
}).call({ x: 'outer' });
// ['outer']
复制代码

上面代码中,箭头函数没有自己的this,所以bind方法无效,内部的this指向外部的this

长期以来,JavaScript语言的this对象一直是一个令人头痛的问题,在对象方法中使用this,必须非常小心。箭头函数”绑定”this,很大程度上解决了这个困扰。

函数绑定

箭头函数可以绑定this对象,大大减少了显式绑定this对象的写法(callapplybind)。但是,箭头函数并不适用于所有场合,所以ES7提出了“函数绑定”(function bind)运算符,用来取代callapplybind调用。虽然该语法还是ES7的一个提案,但是Babel转码器已经支持。

函数绑定运算符是并排的两个双冒号(::),双冒号左边是一个对象,右边是一个函数。该运算符会自动将左边的对象,作为上下文环境(即this对象),绑定到右边的函数上面。

复制代码
foo::bar;
// 等同于
bar.bind(foo);foo::bar(...arguments);
// 等同于
bar.apply(foo, arguments);const hasOwnProperty = Object.prototype.hasOwnProperty;
function hasOwn(obj, key) {return obj::hasOwnProperty(key);
}
复制代码

如果双冒号左边为空,右边是一个对象的方法,则等于将该方法绑定在该对象上面。

复制代码
var method = obj::obj.foo;
// 等同于
var method = ::obj.foo;let log = ::console.log;
// 等同于
var log = console.log.bind(console);
复制代码

由于双冒号运算符返回的还是原对象,因此可以采用链式写法。

尾调用优化

什么是尾调用?

尾调用(Tail Call)是函数式编程的一个重要概念,本身非常简单,一句话就能说清楚,就是指某个函数的最后一步是调用另一个函数。

function f(x){return g(x);
}

上面代码中,函数f的最后一步是调用函数g,这就叫尾调用。

“尾调用优化”(Tail call optimization),即只保留内层函数的调用帧。如果所有函数都是尾调用,那么完全可以做到每次执行时,调用帧只有一项,这将大大节省内存。这就是“尾调用优化”的意义。

严格模式

ES6的尾调用优化只在严格模式下开启,正常模式是无效的。

这是因为在正常模式下,函数内部有两个变量,可以跟踪函数的调用栈。

  • func.arguments:返回调用时函数的参数。
  • func.caller:返回调用当前函数的那个函数。

尾调用优化发生时,函数的调用栈会改写,因此上面两个变量就会失真。严格模式禁用这两个变量,所以尾调用模式仅在严格模式下生效。

复制代码
function restricted() {"use strict";restricted.caller;    // 报错restricted.arguments; // 报错
}
restricted();
复制代码
 

箭头函数与常规函数对比

一个箭头函数与一个普通的函数在两个方面不一样:

  • 下列变量的构造是词法的: arguments , super , this , new.target
  • 不能被用作构造函数:没有内部方法 [[Construct]] (该方法允许普通的函数通过 new 调用),也没有 prototype 属性。因此, new (() => {}) 会抛出错误。

除了那些意外,箭头函数和普通的函数没有明显的区别。例如, typeof 和 instanceof 产生同样的结果:

复制代码
> typeof () => {}
//'function'
> () => {} instanceof Function
//true> typeof function () {}
//'function'
> function () {} instanceof Function
//true
复制代码

函数表达式和对象字面量是例外,这种情形下必须放在括号里面,因为它们看起来像是函数声明和代码块。

转载于:https://www.cnblogs.com/weirdoQi/p/6876887.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/254558.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

halcon Bit图位像素处理算子,持续更新

目录bit_andbit_lshiftbit_maskbit_notbit_orbit_rshiftbit_slicebit_xorbit_and 功能:输入图像的所有像素的逐位与。 bit_lshift 功能:图像的所有像素的左移。 bit_mask 功能:使用位掩码的每个像素的逻辑与。 bit_not 功能&#xff1…

NYOJ题目839合并

--------------------------- AC代码: 1 import java.util.Scanner;2 3 public class Main {4 5 public static void main(String[] args) {6 7 8 Scanner scnew Scanner(System.in);9 10 int timessc.nextInt(); 11 …

指针的魅力

序 指针说:love me,love me! 但是他对指针说:I hate u,I hate u! …… 指针仅仅是作为指针,我们可以把它当做有用的工具,为我们提供便利与好处。说起工具不得不让我想起一样东西—…

python多进程

2019独角兽企业重金招聘Python工程师标准>>> python多进程 进程简介 进程是程序在计算机上的一次执行活动。当你运行一个程序,你就启动了一个进程。显然,程序是死的(静态的),进程是活的(动态的)。进程可以分为系统进程和用户进程。…

halcon彩色图像颜色处理算子,持续更新

目录apply_color_trans_lutcfa_to_rgbtrans_to_rgbclear_color_trans_lutcreate_color_trans_lutgen_principal_comp_translinear_trans_colorprincipal_comprgb1_to_grayrgb3_to_graytrans_from_rgbapply_color_trans_lut 功能:申请使用颜色查找表。 cfa_to_rgb …

夺命雷公狗---node.js---20之项目的构建在node+express+mongo的博客项目5mongodb在项目中实现添加数据...

我们上一步就引入了mongodb了,那么下一步就要开始写添加数据了,不过有个前提是先将表单的数据处理好: 最基本的这部现在已经成功了,因为最基本的这步就是先将表单处的提交方式和提交地址给处理好,这里和PHP的基本上是一…

重新绑定ItemsSource先设置ItemsSource = null;的原因

即报错信息为:在使用 ItemsSource 之前,项集合必须为空。原因:Items和ItemSource,只能有一个生效,想用其中一个,另一个必须是空。重新绑定ItemSource,虽然绑定的集合对象Clear了,但是…

敏捷开发学习

Scrum 敏捷开发,绩效管理,团队管理,企业管理,ASP.net MVC 敏捷开发 培训|咨询 工具开发 课题研讨 http://blog.csdn.net/cheny_com/article/category/794542 http://blog.csdn.net/vincetest/article/category/650747 http://blog…

Git commit后,本地代码丢失解决方法

问题描述: 提交代码时,rebase了两次,本地代码丢失了,吓得我差点跳起来。解决方法如下: 1、执行命令: git reflog d6ea731 (HEAD -> dev, origin/dev, master) HEAD{0}: checkout: moving from master to…

Edges图像边缘处理halcon算子,持续更新

目录close_edgesclose_edges_lengthderivate_gaussdiff_of_gaussedges_coloredges_color_sub_pixedges_imageedges_sub_pixfrei_ampfrei_dirhighpass_imageinfo_edgeskirsch_ampkirsch_dirlaplacelaplace_of_gaussprewitt_ampprewitt_dirrobertsrobinson_amprobinson_dirsobel_…

Android存储数据方式

可以查看Android开发文档中的:/docs/guide/topics/data/data-storage.html Android provides several options for you to save persistent application data. The solution you choose depends on your specific needs, such as whether the data should be privat…

防止cpu 一直被占用 sleep(0) 和 yield

在java的Thread类中有两个有用的函数,sleep和yield,sleep就是线程睡眠一定的时间,也就是交出cpu一段时间,yield用来暗示系统交出cpu控制权。这两个函数在多线程开发的时候特别有用,可以合理的分配cpu,提高程…

做一个有胆识的有为青年

1、一个年轻人,如果在这四年的时间里,没有任何想法,他这一生,就基本这个样子,没有多大改变了。 2、成功者就是胆识加魄力,曾经在火车上听人谈起过温州人的成功,说了这么三个字,“胆…

jstack应用-查找CPU飚高的原因

场景 在系统上线后,经常会遇到运维的同学跑过来说:“这次发版后,cpu线程使用率到一场,到100%了”。这时候不要慌,可以使用堆转储来分析到底是哪个线程引起的。 查找元凶 [rootjava_mofei_01 test]# top Mem: 16333644…

Enhancement增强图形halcon算子,持续更新

目录coherence_enhancing_diffemphasizeequ_histo_imageilluminatemean_curvature_flowscale_image_max_shock_filtercoherence_enhancing_diff 功能:执行一个图像的一个一致性增强扩散。 emphasize 功能:增强图像对比度。 equ_histo_image 功能&am…

音频中采样位数,采样率,比特率的名词解释(转)

采样位数(采样大小): 采样位数可以理解为采集卡处理声音的解析度。这个数值越大,解析度就越高,录制和回放的声音就越真实。我们首先要知道:电脑中的声音文件是用数字0和1来表示的。所以在电脑上录音的本质就…

WebSocket实时异步通信

WebSocket实时异步通信 【一】WebSocket简介 WebSocket是HTML5推出一个协议规范,用来B/S模式中服务器端和客户端之间进行实时异步通信。 众所周知,传统的HTTP协议中,服务器端和客户端通信只能是在客户端发送一个请求之后,服务器端…

多线程和多进程的区别(小结)

分类: linux 2009-06-19 09:33 11501人阅读 评论(15) 收藏 举报 很想写点关于多进程和多线程的东西,我确实很爱他们。但是每每想动手写点关于他们的东西,却总是求全心理作祟,始终动不了手。 今天终于下了决心,写点东西…

redis-cli使用密码登录

redis-cli使用密码登录 注意IP地址要写正确! 学习了: https://blog.csdn.net/lsm135/article/details/52932896 https://blog.csdn.net/zyz511919766/article/details/42268219 https://zhidao.baidu.com/question/756651357338691604.html 登录后 auth pass 或者 r…

FFT快速傅式变换算法halcon算子,持续更新

目录convol_fftconvol_gaborcorrelation_fftdeserialize_fft_optimization_dataenergy_gaborfft_genericfft_imagefft_image_invgen_bandfiltergen_bandpassgen_derivative_filtergen_filter_maskgen_gaborgen_gauss_filtergen_highpassgen_lowpassgen_mean_filtergen_sin_band…