我最近开始保持别人的JavaScript代码,我正在修复错误,添加功能,也试图更新代码并使其更加一致。

以前的开发人员使用了两种方式来宣布功能,我无法解决是否有原因。

兩種方式是:

var functionOne = function() {
    // Some code
};
function functionTwo() {
    // Some code
}

使用这两种不同的方法的原因是什么?每个方法的优点和缺点是什么?可以用一种方法做些什么,不能用另一种方法做些什么?


当前回答

函数内所宣布的变量/函数在页面内是全球性的,可以访问该页面中的任何地方.函数内所宣布的变量/函数具有本地范围. 也就是说,它们在函数体内可用/可用,它们不在函数体外可用。

变量

JavaScript 被称为顺利打字语言,这意味着 JavaScript 变量可以保留任何数据类型的值,JavaScript 会自动根据运行时间提供的值/字体来改变变量类型。

global_Page = 10;                                               var global_Page;      « undefined
    « Integer literal, Number Type.   -------------------       global_Page = 10;     « Number         
global_Page = 'Yash';                 |   Interpreted   |       global_Page = 'Yash'; « String
    « String literal, String Type.    «       AS        «       global_Page = true;   « Boolean 
var global_Page = true;               |                 |       global_Page = function (){          « function
    « Boolean Type                    -------------------                 var local_functionblock;  « undefined
global_Page = function (){                                                local_functionblock = 777;« Number
    var local_functionblock = 777;                              };  
    // Assigning function as a data.
};  

功能

function Identifier_opt ( FormalParameterList_opt ) { 
      FunctionBody | sequence of statements

      « return;  Default undefined
      « return 'some data';
}

function globalAccess() {                                  function globalAccess() {      
}                                  -------------------     }
globalAccess();                    |                 |     function globalAccess() { « Re-Defined / overridden.
localAccess();                     «   Hoisted  As   «         function localAccess() {
function globalAccess() {          |                 |         }
     localAccess();                -------------------         localAccess(); « function accessed with in globalAccess() only.
     function localAccess() {                              }
     }                                                     globalAccess();
}                                                          localAccess(); « ReferenceError as the function is not defined

功能表达

        10;                 « literal
       (10);                « Expression                (10).toString() -> '10'
var a;                      
    a = 10;                 « Expression var              a.toString()  -> '10'
(function invoke() {        « Expression Function
 console.log('Self Invoking');                      (function () {
});                                                               }) () -> 'Self Invoking'

var f; 
    f = function (){        « Expression var Function
    console.log('var Function');                                   f ()  -> 'var Function'
    };

(function selfExecuting(){
    console.log('IIFE - Immediately-Invoked Function Expression');
}());

var anonymous = function (){
    console.log('anonymous function Expression');
};

var namedExpression = function for_InternalUSE(fact){
    if(fact === 1){
        return 1;
    }

    var localExpression = function(){
        console.log('Local to the parent Function Scope');
    };
    globalExpression = function(){ 
        console.log('creates a new global variable, then assigned this function.');
    };

    //return; //undefined.
    return fact * for_InternalUSE( fact - 1);   
};

namedExpression();
globalExpression();

JavaScript 被解释为

var anonymous;
var namedExpression;
var globalExpression;

anonymous = function (){
    console.log('anonymous function Expression');
};

namedExpression = function for_InternalUSE(fact){
    var localExpression;

    if(fact === 1){
        return 1;
    }
    localExpression = function(){
        console.log('Local to the parent Function Scope');
    };
    globalExpression = function(){ 
        console.log('creates a new global variable, then assigned this function.');
    };

    return fact * for_InternalUSE( fact - 1);    // DEFAULT UNDEFINED.
};

namedExpression(10);
globalExpression();


ES5 Constructor 功能类:使用 Function.prototype.bind 创建的功能对象

function Shape(id) { // Function Declaration
    this.id = id;
};
    // Adding a prototyped method to a function.
    Shape.prototype.getID = function () {
        return this.id;
    };
    Shape.prototype.setID = function ( id ) {
        this.id = id;
    };

var expFn = Shape; // Function Expression

var funObj = new Shape( ); // Function Object
funObj.hasOwnProperty('prototype'); // false
funObj.setID( 10 );
console.log( funObj.getID() ); // 10

ArrowFunction : ArrowParameters => ConciseBody. const fn = (item) => {返回项目 & 1? 'Odd' : 'Even'; }; console.log( fn(2) ); // Even console.log( fn(3) ); // Odd

其他回答

在其他答案中没有提到的另一个区别是,如果您使用匿名函数

var functionOne = function() {
    // Some code
};

用它作为一个建筑师

var one = new functionOne();

Function.name 是非标准的,但由 Firefox、Chrome、其他 Webkit 衍生浏览器和 IE 9+ 支持。

function functionTwo() {
    // Some code
}
two = new functionTwo();

可以以 two.constructor.name 的字符串获取建筑师的名称。

這只是兩種可能的方式來宣告功能,第二種方式,你可以在宣告之前使用功能。

尝试 { console.log(“成功:”,添加(1, 1)); } 捕捉(e) { console.log(“错误:” + e); } var add=function(a, b){ return a + b; }

你在那里发布的两个代码剪辑,几乎所有目的都会以相同的方式行事。

然而,行为的差异是,在第一个变量(有函数One = 函数() {}),该函数只能在代码中的那个点之后被称为。

第二个选项(函数Two()),函数可用于代码,运行在函数被宣布的地方。

这是因为第一种变量,函数在运行时分配给变量foo;第二种函数在运行时分配给这个识别器,foo。

更多技术信息

JavaScript 有三种方式来定义功能。

你的第一个剪辑显示一个函数表达式. 这意味着使用“函数”操作员创建一个函数 - 该操作员的结果可以存储在任何变量或对象属性. 函数表达式是强大的这种方式. 函数表达式经常被称为“匿名函数”,因为它不需要一个名字, 你的第二个例子是一个函数声明。

我用我的代码中的变量方法出于一个非常具体的原因,其理论已经以抽象的方式被覆盖,但一个例子可以帮助一些像我这样的人,有有限的JavaScript专业知识。

有些品牌需要特定的功能,而有些则不。有时我需要添加新的功能来做新的品牌特定的事情.我很高兴更改共享编码,但我不想需要更改所有160套品牌文件。

使用变量合成,我可以在共享代码中宣言变量(基本上是函数指标),并分配一个三位一体函数,或设置为零。