我最近开始保持别人的JavaScript代码,我正在修复错误,添加功能,也试图更新代码并使其更加一致。
以前的开发人员使用了两种方式来宣布功能,我无法解决是否有原因。
兩種方式是:
var functionOne = function() {
// Some code
};
function functionTwo() {
// Some code
}
使用这两种不同的方法的原因是什么?每个方法的优点和缺点是什么?可以用一种方法做些什么,不能用另一种方法做些什么?
一个重要原因是添加一个和只有一个变量作为你的名称空间的“根”。
var MyNamespace = {}
MyNamespace.foo= function() {
}
或
var MyNamespace = {
foo: function() {
},
...
}
有很多技术来搜索名称,它变得更加重要,有许多可用的JavaScript模块。
此分類上一篇: 如何在JavaScript中宣告名稱空間?
名称功能 vs. 匿名功能
第一函数合成是匿名函数表达式:
var functionOne = function() {
// do something...
};
但是,第二个是功能宣言:
function functionTwo () {
// do something...
}
兩者之間的主要區別是函數名稱,因為匿名函數沒有呼叫的名稱. 匿名函數是快速且容易宣告的,許多圖書館和工具往往鼓勵這種愚蠢的代碼風格. 然而,匿名函數有一些缺點:
可读性:匿名函数忽略了一个名称,可能会导致更少可读的代码。 解密: 匿名函数没有名称,可以使解密更困难。
名称函数表达式
為您的功能表達提供一個名稱,非常有效地解決所有這些缺點,並且沒有實際的缺點。
setTimeout(function timeHandler() { // <-- look, a name here!
console.log("I've waited 1 second");
}, 1000);
名称 IIFEs(即时启发功能表达)
(function IIFE(str) { // <-- look, always name IIFEs!
console.log(str); // "Hello!"
})('Hello!');
对于一个变量的函数,这个函数的名称,在这种情况下,不太常见,可能会导致混乱,在这种情况下,箭头函数可能是一个更好的选择。
一个描述什么时候优先于第一种方法,而不是第二种方法,是当你需要避免超越一个函数的以前定义时。
与
if (condition){
function myfunction(){
// Some code
}
}
,这个定义的微功能将超越任何以前的定义,因为它将在时间段进行。
虽然
if (condition){
var myfunction = function (){
// Some code
}
}
正确的定义功能工作只有在条件满足时。
二是定义函数的不同方式,区别在于浏览器如何解释并将其加载到执行背景中。
第一個案例是函數表達,只有當翻譯者達到這個代碼線時才會充電,因此,如果你這樣做,你會發現函數一不是函數的錯誤。
functionOne();
var functionOne = function() {
// Some code
};
原因在于,在第一行中,没有值被分配到函数One,因此它是不定义的,我们试图称之为函数,因此我们得到一个错误。
在第二行中,我们将匿名函数的参考归分为函数One。
第二个案例是功能声明,在任何代码执行之前加载,所以如果你喜欢下一个,你不会得到任何错误,因为声明加载,在代码执行之前。
functionOne();
function functionOne() {
// Some code
}
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() {} 定义在部分时间。
// Run-Time function declaration
functionOne(); // Calling functionOne function here will give an Error
var functionOne = function () {
// Some code
};
// Parse-Time function declaration
functionTwo(); // Calling functionTwo function will not give an Error
function functionTwo() {
// Some code...
}
此分類上一篇: Run-time vs Parse-time javascript run-time vs parse-time