如果JS中的函数是一流的,那么在定义它们之前允许它们被调用的是什么?

时间:2021-10-24 22:03:55

Don't first class functions mean that they behave as variables? Clearly they don't behave exactly like variables though, since this:

第一类函数是否意味着它们表现为变量?显然,它们的行为与变量完全不同,因为:

console.log(foo);
var foo = 'bar';

...doesn't work, whereas this:

......不起作用,而这个:

console.log(foo());
function foo() {
 return('bar');
}

...does.

...一样。

That said, this:

那说,这个:

console.log(foo());
var foo = function() { return 'bar'; };

doesn't work, which is more consistent.

不起作用,这更加一致。

What gives?

是什么赋予了?

4 个解决方案

#1


10  

Because you don't compare the same thing. In your example - you compare function declaration function foo()... with variable declaration and assignment in var foo = 'bar';

因为你不比较同样的事情。在您的示例中 - 您将函数声明函数foo()...与var foo ='bar'中的变量声明和赋值进行比较;

A more correct comparison would be of:

更正确的比较是:

console.log(foo);
var foo = 'bar';

with

console.log(foo());
var foo = function() {
 return 'bar';
}

The functional declaration is interpreted differently due to the way hoisting works. Hoisting moves all declarations to the top of the closest scope, while leaving assignments in their place.

由于提升工作的方式,功能声明的解释不同。提升将所有声明移动到最近范围的顶部,同时将分配保留在其位置。

Function declaration is special in that sense, since it's both declaration and expression/assignment in one statement and thus hoisted together.

函数声明在这个意义上是特殊的,因为它在一个语句中都是声明和表达/赋值,因此一起提升。

As an example: you can look at expressions like:

举个例子:你可以看看像这样的表达式:

console.log(foo);
var foo = 'bar';

as this:

这样:

var foo;
console.log(foo); //prints undefined
foo = 'bar';

and

console.log(foo());
var foo = function() {
 return 'bar';
}

as this:

这样:

var foo;
console.log(foo());
foo = function() {
 return 'bar';
}

#2


18  

What you're experiencing is called hoisting. When using a function declaration like:

你所经历的是被称为吊装。使用函数声明时:

function foo() {}

foo will be moved to the top of the closest scope (function).

foo将被移动到最近的范围(函数)的顶部。

On the other hand when you use a function expression or function assignment like:

另一方面,当您使用函数表达式或函数赋值时,如:

var foo = function() {}

the variable foo will be moved to the top but the assignment will occur when is needed.

变量foo将移动到顶部,但在需要时将进行赋值。

Learn more

学到更多

#3


6  

Function declarations are automatically bumped to top of the scope in JS

函数声明自动碰到JS的范围顶部

console.log(foo());
function foo() {
 return('bar');
}

is actually interpreted as

实际上被解释为

function foo() {
 return('bar');
}
console.log(foo());

the second bit of code is working that way, because foo is variable, not a function (it just happens to have an anonymous function as a value). Variables are also bumped to top, so

第二位代码就是这样工作,因为foo是变量,而不是函数(它恰好有一个匿名函数作为值)。变量也被撞到顶部,所以

console.log(foo());
var foo = function() { return 'bar'; };

becomes

var foo; //empty variable
console.log(foo()); //undefined
foo = function() { return 'bar'; }; //creates a function without name and assigns it to foo

#4


4  

Function declaration and variable declaration will always be moved to the top of their scope.

函数声明和变量声明将始终移动到其作用域的顶部。

console.log(foo());
function foo() {
   return 'bar';
}

is interpreted as:

被解释为:

function foo() {
   return 'bar';
}
console.log(foo());

console.log(foo());
var foo = function () {
   return 'bar';
};

is interpreted as:

被解释为:

var foo;
console.log(foo());
foo = function () {
   return 'bar';
};

#1


10  

Because you don't compare the same thing. In your example - you compare function declaration function foo()... with variable declaration and assignment in var foo = 'bar';

因为你不比较同样的事情。在您的示例中 - 您将函数声明函数foo()...与var foo ='bar'中的变量声明和赋值进行比较;

A more correct comparison would be of:

更正确的比较是:

console.log(foo);
var foo = 'bar';

with

console.log(foo());
var foo = function() {
 return 'bar';
}

The functional declaration is interpreted differently due to the way hoisting works. Hoisting moves all declarations to the top of the closest scope, while leaving assignments in their place.

由于提升工作的方式,功能声明的解释不同。提升将所有声明移动到最近范围的顶部,同时将分配保留在其位置。

Function declaration is special in that sense, since it's both declaration and expression/assignment in one statement and thus hoisted together.

函数声明在这个意义上是特殊的,因为它在一个语句中都是声明和表达/赋值,因此一起提升。

As an example: you can look at expressions like:

举个例子:你可以看看像这样的表达式:

console.log(foo);
var foo = 'bar';

as this:

这样:

var foo;
console.log(foo); //prints undefined
foo = 'bar';

and

console.log(foo());
var foo = function() {
 return 'bar';
}

as this:

这样:

var foo;
console.log(foo());
foo = function() {
 return 'bar';
}

#2


18  

What you're experiencing is called hoisting. When using a function declaration like:

你所经历的是被称为吊装。使用函数声明时:

function foo() {}

foo will be moved to the top of the closest scope (function).

foo将被移动到最近的范围(函数)的顶部。

On the other hand when you use a function expression or function assignment like:

另一方面,当您使用函数表达式或函数赋值时,如:

var foo = function() {}

the variable foo will be moved to the top but the assignment will occur when is needed.

变量foo将移动到顶部,但在需要时将进行赋值。

Learn more

学到更多

#3


6  

Function declarations are automatically bumped to top of the scope in JS

函数声明自动碰到JS的范围顶部

console.log(foo());
function foo() {
 return('bar');
}

is actually interpreted as

实际上被解释为

function foo() {
 return('bar');
}
console.log(foo());

the second bit of code is working that way, because foo is variable, not a function (it just happens to have an anonymous function as a value). Variables are also bumped to top, so

第二位代码就是这样工作,因为foo是变量,而不是函数(它恰好有一个匿名函数作为值)。变量也被撞到顶部,所以

console.log(foo());
var foo = function() { return 'bar'; };

becomes

var foo; //empty variable
console.log(foo()); //undefined
foo = function() { return 'bar'; }; //creates a function without name and assigns it to foo

#4


4  

Function declaration and variable declaration will always be moved to the top of their scope.

函数声明和变量声明将始终移动到其作用域的顶部。

console.log(foo());
function foo() {
   return 'bar';
}

is interpreted as:

被解释为:

function foo() {
   return 'bar';
}
console.log(foo());

console.log(foo());
var foo = function () {
   return 'bar';
};

is interpreted as:

被解释为:

var foo;
console.log(foo());
foo = function () {
   return 'bar';
};