对js里function的length属性的理解

相信大家对数组里的length属性应该不陌生,它表示数组元素的个数,但是你有没有留意过,function里也有一个length属性,下面是我对该属性的一点理解,希望对大家有所帮助。

function的length属性(指实例对象/已定义的函数)

它表示该函数的形参个数,我们来看一下下面的例子

function fn(a, b, c) {
	return a + b + c;
}
console.log(fn.length);    // 输出3

那么这个length属性哪来的呢?
因为function它是一个对象,所以这个length属性可以往它的原型找

function原型的length属性

根据原型链往上找

console.log(fn.__proto__.length);  // 输出0

因为函数的形参个数是定义函数时才定的,所以function的原型length值理所当然的为0

function构造器的length属性

再打印一下Funtion的length属性康康

console.log(Function.length);   // 输出1
console.log(fn.__proto__.constructor.length);  // 同样输出1

至于这里的length为什么是1呢?
在这我需要解释一下:
Function这个构造器本身也是一个函数,它接受至少一个参数,这个参数便是定义函数后的函数体
比如说:

var fn = new Function('return 1+2+3');  // 注意参数类型必须为字符串形式
// 等同于
function fn() {
	return 1+2+3;
}
// 带参数的函数写法
var fn = new Function('a', 'b', 'c', 'console.log("我是函数体");return a+b+c');  // 函数体语句之间用分号隔开
// 等同于
function fn(a, b, c) {
	return a + b + c;
}

但是!请注意,这种写法并不支持闭包哦
例如:

var i = 1;
+function(a, b, c) {
	var j = 2;
	var fn = new Function('a', 'b', 'c', 'console.log(i);console.log(j);console.log(a+b+c)');
	fn(a, b, c);
}(1, 2, 3);    // 此时函数只能访问全局的 i,无法访问内部的 j

使用Function构造器生成的函数,并不会在创建它们的上下文中创建闭包;它们一般在全局作用域中被创建。当运行这些函数的时候,它们只能访问自己的本地变量和全局变量,不能访问Function构造器被调用生成的上下文的作用域

害,扯远了。换台换台!!
再首尾呼应一下:因为构造器Function接受至少一个参数(作为无参函数的函数体),所以它的length打印出来的结果就是 1 啦

function的arguments的length属性

写到这里有必要区别一下另外一个东西,那就是 arguments
它表示函数传入实际参数的个数,注意哦是实参个数

来人!上祖传栗子!!

fn(1, 2, 3);

function fn(a, b, c) {
	console.log(arguments.length);  // 输出3
	console.log(fn.length);  // 输出3
	return a + b + c;
}

有小同学可能要举手了,“欸,老师!这俩不一样么???”
“当然不一样啦”(推眼镜)
“来人!!再上一颗金牌栗子!!”

fn(1, 2);

function fn(a, b, c) {
	console.log(arguments.length);  // 输出2
	console.log(fn.length);  // 输出3
	return a + b + c;
}

小同学s:“哦~~~秒懂!”
以上就是本文所有内容,感谢大家捧场~

发布了20 篇原创文章 · 获赞 6 · 访问量 4034

猜你喜欢

转载自blog.csdn.net/CanMoHaiYan/article/details/105157908