我最近开始保持别人的JavaScript代码,我正在修复错误,添加功能,也试图更新代码并使其更加一致。
以前的开发人员使用了两种方式来宣布功能,我无法解决是否有原因。
兩種方式是:
var functionOne = function() {
// Some code
};
function functionTwo() {
// Some code
}
使用这两种不同的方法的原因是什么?每个方法的优点和缺点是什么?可以用一种方法做些什么,不能用另一种方法做些什么?
你在那里发布的两个代码剪辑,几乎所有目的都会以相同的方式行事。
然而,行为的差异是,在第一个变量(有函数One = 函数() {}),该函数只能在代码中的那个点之后被称为。
第二个选项(函数Two()),函数可用于代码,运行在函数被宣布的地方。
这是因为第一种变量,函数在运行时分配给变量foo;第二种函数在运行时分配给这个识别器,foo。
更多技术信息
JavaScript 有三种方式来定义功能。
你的第一个剪辑显示一个函数表达式. 这意味着使用“函数”操作员创建一个函数 - 该操作员的结果可以存储在任何变量或对象属性. 函数表达式是强大的这种方式. 函数表达式经常被称为“匿名函数”,因为它不需要一个名字, 你的第二个例子是一个函数声明。
对格雷格的答案有更好的解释
functionTwo();
function functionTwo() {
}
為什麼沒有錯誤?我們總是被教導,表達從上到底(??)
因为:
函数声明和变量声明总是由JavaScript翻译器无视地移动到其内容范围的顶部。
这就是这样的代码:
functionOne(); --------------- var functionOne;
| is actually | functionOne();
var functionOne = function(){ | interpreted |-->
}; | like | functionOne = function(){
--------------- };
请注意,提交声明的部分未被提交;只有名称被提交。
但是,在函数声明的情况下,整个函数身体也将被包围:
functionTwo(); --------------- function functionTwo() {
| is actually | };
function functionTwo() { | interpreted |-->
} | like | functionTwo();
---------------
一个函数声明和一个函数表达,在一个变量行为被定义后,相同。
基本上,所有函数声明和变量声明都被插入到声明发生函数的顶部(这就是为什么我们说JavaScript具有函数范围)。
当一个函数声明被拍摄时,函数体“跟随”,因此当函数体被评估时,变量将立即与函数对象联系起来。当一个变量声明被拍摄时,启动不会跟随,而是“左后面”。变量在函数体的开始时被启动到未定义,并将在其原始位置分配一个值。
一些例子......
var foo = 1;
function bar() {
if (!foo) {
var foo = 10 }
return foo; }
bar() // 10
function f() {
return a;
function a() {return 1};
var a = 4;
function a() {return 2}}
f()() // 2
function f() {
return a;
var a = 4;
function a() {return 1};
function a() {return 2}}
f()() // 2
函数声明优先于变量声明,最后的函数声明“粘贴”。
function f() {
var a = 4;
function a() {return 1};
function a() {return 2};
return a; }
f() // 4
在此例子中, a 与第二个函数声明的评估结果的函数对象开始,然后分配为 4.
var a = 1;
function b() {
a = 10;
return;
function a() {}}
b();
a // 1
a = 10
output : 10
(1 + 3)
output = 4
声明/声明:不返回值的东西 示例:
if (1 > 2) {
// do something.
}
此分類上一篇
同样,我们有函数声明/声明 vs 函数表达 请举一个例子:
// test.js
var a = 10;
// function expression
var fun_expression = function() {
console.log("Running function Expression");
}
// funciton expression
function fun_declaration() {
console.log("Running function Statement");
}
重要:在JavaScript引擎运行上面的JS文件时会发生什么。
现在,假设我们更新JS到。
// test.js
console.log(a) //output: udefined (No error)
console.log(fun_expression) // output: undefined (No error)
console.log(fun_expression()) // output: Error. As we trying to invoke undefined.
console.log(fun_declaration()) // output: running function statement (As fun_declaration is already hoisted in the memory).
var a = 10;
// function expression
var fun_expression = function() {
console.log('Running function expression')
}
// function declaration
function fun_declaration() {
console.log('running function declaration')
}
console.log(a) // output: 10
console.log(fun_expression()) //output: Running function expression
console.log(fun_declaration()) //output: running function declaration
在评论中提到的结果,应该有助于理解函数表达与函数声明/声明之间的区别。
区别在于,函数One 是一种函数表达式,因此只有在到达该行时才定义,而函数Two 是一种函数声明,并在其周围函数或脚本执行后才定义。
例如,函数表达式:
// TypeError: functionOne 不是函数函数One(); var 函数One = 函数() { console.log(“Hello!”); };
还有一个功能声明:
// 输出: “Hello!”函数Two();函数函数Two() { console.log(“Hello!”); }
“使用严格”; { // 注意此区块! 函数三() { console.log(“Hello!”); } } 函数三(); // 参考错误