ES6入门之函数的扩展
函数js原有的:
属性:arguments[]、caller(调用该函数的引用,注意与callee分别开,callee指的是调用函数本身经常在递归中出现)、length(形参个数)、prototype
方法:apply()、call()、bind()、toString()
函数的扩展:
函数参数的默认值
在es6之前不能给函数的参数给定默认值,一般会采用这样的方法:
function a(x,y){
if(typeof y === 'undefined'){
y = 'world';
}
console.log(x,y);
}
es6允许设置默认值,在解构的时候使用模式匹配
function log(x, y = 'World') {
console.log(x, y);
} log('Hello') // Hello World
log('Hello', 'China') // Hello China
log('Hello', '') // Hello
function foo({x, y = 5}) {
console.log(x, y);
} foo({}) // undefined, 5
foo({x: 1}) // 1, 5
foo({x: 1, y: 2}) // 1, 2
foo() // TypeError: Cannot read property 'x' of undefined
// 写法一:设置了参数对象的解构默认值,但是对象默认为空对象
function m1({x = 0, y = 0} = {}) {
return [x, y];
} // 写法二:设置了参数对象默认是一个不为空的对象
function m2({x, y} = { x: 0, y: 0 }) {
return [x, y];
} m1() //[0,0]
m2() //[0,0]
m1({x:1}) //[1,0]
m2({x:1}) //[1,undefined]
如果设定了默认参数不在arguments的尾部则在引用函数的时候不能省略,可以用undefined代替
这时函数的length就不是全部的arguments的长度了,而是没有设定默认值的长度
函数作用域:一般而言函数作用域大于全局作用域,但是如果函数的参数为另一函数,则这个另一函数的作用域还是全局作用域
rest参数(...变量名)<=> arguments 用于获取函数多余的参数
rest是一个数组,arguments是一个类数组(对象)
rest只能是最后一个参数,length属性不包括rest参数
扩展运算符(...)将一个数组转为用逗号分隔的参数序列
console.log(1, ...[2, 3, 4], 5) // 1 2 3 4 5
可以代替apply方法,将数组转为参数
代替concat <=> [1,2,...[]]
生成数组:[a,...rest] = [1,2,3,4,5]; a= 1;rest = [2,3,4,5];
可以返回多个值,正常函数只能返回数组和对象,但是扩展运算符可以将数组转化
可以将字符串转为数组:[...'he'] = ['h','e'];
name:返回函数名,若为匿名函数则es5返回空字符串,es6返回赋给引用它的变量
构造函数返回函数实例
bind函数返回'bound'+name
箭头函数‘=>’
var f = v => v;
等价于
var f = function(v) {
return v;
};
不需要参数或多个则:用()表示
执行部分不只有返回值,用{},但是如果返回值为对象则需要在外部加() // 正常函数写法
[1,2,3].map(function (x) {
return x * x;
}); // 箭头函数写法
[1,2,3].map(x => x * x);
使用箭头注意点:
(1)函数体内的this
对象,就是定义时所在的对象,而不是使用时所在的对象。
(2)不可以当作构造函数,也就是说,不可以使用new
命令,否则会抛出一个错误。
(3)不可以使用arguments
对象,该对象在函数体内不存在。如果要用,可以用Rest参数代替。
(4)不可以使用yield
命令,因此箭头函数不能用作Generator函数。
没有参数的时候就调用外部函数的,同时这时的this也是外部的
函数绑定'::'左边对象右边函数 <=>bind
foo::bar; // 等同于 bar.bind(foo);
尾调用优化
尾调用:某函数最后一步调用另一函数不一定要出现在函数尾部
调用帧:函数调用会在内存形成一个“调用记录”,保存调用位置和内部变量等信息
调用栈:如果在函数A的内部调用函数B,那么在A的调用帧上方,还会形成一个B的调用帧。等到B运行结束,将结果返回到A,B的调用帧才会消失。如果函数B内部还调用函数C,那就还有一个C的调用帧,以此类推。所有的调用帧,就形成一个“调用栈”(call stack)。
尾调用优化:只保留内层函数的调用帧,节省内存
注意,只有不再用到外层函数的内部变量,内层函数的调用帧才会取代外层函数的调用帧,否则就无法进行“尾调用优化”。
如下代码进行尾调用优化
function f() {
let m = 1;
let n = 2;
return g(m + n);
}
f(); // 等同于
function f() {
return g(3);
}
f(); // 等同于
g(3); 如下代码则不会
function addOne(a){
var one = 1;
function inner(b){
return b + one;
}
return inner(a);
}
尾递归:尾调用自身,不会发生栈溢出
递归非常耗内存,需要同时保存多个调用帧,解决方法:
法一: 确保最后一步只调用自己,把所有用到的内部变量改写成函数的参数
function tailFactorial(n, total) {
if (n === 1) return total;
return tailFactorial(n - 1, n * total);
} function factorial(n) {
return tailFactorial(n, 1);
} factorial(5) //
法二:采用ES6的函数默认值
function factorial(n, total = 1) {
if (n === 1) return total;
return factorial(n - 1, n * total);
} factorial(5) //
尾调用优化只在严格模式下开启,正常模式是无效的。
因为在正常模式下,函数内部有两个变量,可以跟踪函数的调用栈。
func.arguments
:返回调用时函数的参数。func.caller
:返回调用当前函数的那个函数。
function restricted() {
"use strict";
restricted.caller; // 报错
restricted.arguments; // 报错
}
restricted();
函数内部的最后一个参数可以有尾逗号
ES6入门之函数的扩展的更多相关文章
- ES6 入门系列 - 函数的扩展
1函数参数的默认值 基本用法 在ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法. function log(x, y) { y = y || 'World'; console.log( ...
- ES6中对函数的扩展
ES6一路扩展,字符串.数组.数值.对象无一“幸免”,ES6说要雨露均沾,函数也不能落下,今天,就来讲解ES6对函数的扩展. 参数的默认值 在开发中,给函数的参数指定默认值,是很普遍很常见的一个需求, ...
- ES6入门箭头函数
箭头函数: 箭头函数可以与变量结构相结合(箭头函数返回对象的时候必须要在对象外边加()) 注意: 1️⃣函数体内的this是定义时所在的对象,而不是使用时的对象 2️⃣不可以当成构造函数,不可用new ...
- ES6学习笔记(6)----函数的扩展
参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ 函数的扩展 函数的默认值 : ES6可以为函数指定默认值 (1)指定默认值的两种方式 a.函数参 ...
- ES6入门——函数的扩展
1.函数参数的默认值 在ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法.现在ES6可以为函数的参数添加默认值,简洁了许多. ES5 function show(a,b){ b = b ...
- 《ES6标准入门》(阮一峰)--8.函数的扩展
1.函数参数的默认值 基本用法 ES6 之前,不能直接为函数的参数指定默认值,只能采用变通的方法. function log(x, y) { y = y || 'World'; console.log ...
- ES6新特性3:函数的扩展
本文摘自ECMAScript6入门,转载请注明出处. 一.函数参数默认值 1. ES6允许为函数的参数设置默认值,即直接写在参数定义的后面. function log(x, y = 'World') ...
- ES6 - Note3:数组、对象与函数的扩展
一.数组的扩展,ES6在数组扩展了一些API,以实现更多的功能 1.Array.from:可以将类数组和可遍历的数据结构转换成真正的数组,如下所示 var a = { '0':1,'1':1,leng ...
- es6入门3--箭头函数与形参等属性的拓展
对函数拓展兴趣更大一点,优先看,前面字符串后面再说,那些API居多,会使用能记住部分就好. 一.函数参数可以使用默认值 1.默认值生效条件 在变量的解构赋值就提到了,函数参数可以使用默认值了.正常我们 ...
随机推荐
- 这个好像、也许、或许、大概、应该、Maybe真的可以算是传说中的Spring.Net了吧
这个好像.也许.或许.大概.应该.Maybe真的可以算是传说中的Spring.Net了吧 ...
- Crtmp 源码分析
Crtmp Server接收rtmp音视频流,并实现音视频并发,可以作为直播后台的服务.整套代码量并不大,算是轻量级的服务. 花了些时间研究源码,现将研究的结果,记录下来,方便以后查阅. 先不从架构上 ...
- c++ ip地址相关
#include <stdio.h> #include <string.h> #include <arpa/inet.h> #include <sys/typ ...
- Matlab设置网格线密度(坐标精度)
1.不精确 set(gca,'XMinorTick','on') 这样的话知识x轴显示了细的密度,网格线并没有变. 2.精确 set(gca,'xtick',-1:0.1:1); set(gca,'y ...
- 2013ACM/ICPC亚洲区南京站现场赛——题目重现
GPA http://acm.hdu.edu.cn/showproblem.php?pid=4802 签到题,输入两个表,注意细心点就行了. #include<cstdio> #inclu ...
- 发布windows phone应用经历实谈
经过这一次艰辛的发布应用的过程,看来果然这不是个简单的过程,不过经历过了一次之后感觉其实也没这么难,下面我将介绍我通过学生账号发布windows phone 8的应用到商店的全过程,其实整个过程最为困 ...
- ios7 自定义UINavigationBar UIBarButtonItem 10px的偏移纠正
为UINavigationBar 写一个分类.UINavigationItem+correct_offset.h 转载 http://www.colabug.com/thread-1112420-1 ...
- C/C++中内存区域划分大总结
C++作为一款C语言的升级版本,具有非常强大的功能.它不但能够支持各种程序设计风格,而且还具有C语言的所有功能.我们在这里为大家介绍的是其中一个比较重要的内容,C和C++内存区域的划分. 一. 在c中 ...
- 关于IE下AJAX的问题探讨
今天JS练手的时候,想封装一个发送AJAX请求的对象,当然,是想要兼容全浏览器的.代码如下: var Ajax = { xhr: null, callback: null, XMLHttp: func ...
- yum install 与 yum groupinstall 的区别
原文:http://blog.51yip.com/linux/1171.html yum 提供二种安装软件的方式 1,yum install 它安装单个软件,以及这个软件的依赖关系 2,yum gro ...