这是一个功能声明、表达式和对象吗?

Is this a functional declaration, expression, and object?

本文关键字:表达式 对象 声明 功能 一个      更新时间:2023-09-26

我正在学习JavaScript,并试图学习我正在做的事情的正确术语。 有很多方法可以创建函数。

我创建了 3 个做同样事情的示例,但函数的创建方式完全不同。

我的问题是:

  • 这些方法中的任何一种都比另一种更好吗?

  • 为什么我会选择一种或另一种方式?

  • 最后一个"对象"方法叫什么?

  • 你有什么建议可以让这个例子变得更好?

//EXAMPLE 1
// is this called function declaration?
function add( a, b ) {
	return a + b;
}
function subtract( a, b ) {
	return a - b;
}
function compute( a, b ) {
	var sum = add( a, b );
	var difference = subtract( a, b );
	var total = sum + difference;
	return total;
}
compute( 2, 3 ); //returns 4
//EXAMPLE 2
// is this called function expressions?
var add = function ( a, b ) {
	return a + b;
};
var subtract = function ( a, b ) {
	return a - b;
};
var compute = function ( a, b ) {
	var sum = add( a, b );
	var difference = subtract( a, b );
	var total = sum + difference;
	return total;
};
compute( 2, 3 ); //returns 4

//EXAMPLE 3
// what is this method called?
var calculator = {
	add: function ( a, b ) {
		return a + b;
	},
	subtract: function ( a, b ) {
		return a - b;
	},
	compute: function ( a, b ) {
		var sum = this.add( a, b );
		var difference = this.subtract( a, b );
		var total = sum + difference;
		return total;
	}
}
calculator.compute( 2, 3 ); //returns 4

这叫函数声明吗?

function add( a, b ) {
  return a + b;
}

是的。

这叫函数表达式吗?

var add = function ( a, b ) {
  return a + b;
};

是的。请注意,只有function(…){…}部分是函数表达式,其余部分是普通赋值(带有初始化器的变量声明,是迂腐的)。

这个方法叫什么?

… {
    add: function ( a, b ) {
        return a + b;
    },
    …
}

同样,它是一个函数表达式。在此处用作对象文本中的属性值,以定义方法。

这些方法中的任何一种都比另一种更好吗?

函数

声明优先于将函数表达式分配给变量(略有不同)。您应该仅在需要表达式作为表达式的地方使用表达式(例如,在 IIFE、条件赋值、属性赋值、属性定义、return 语句等中)。

函数声明:

function add(a,b) { return a+b; }

函数声明是在解析时为某个脚本块定义的。它可以在块中的任何位置调用而不会产生错误:

(function() {
    add(3,3)    //The function block has already been parsed, add() is available
    function add(a,b) { return a+b; }
})();

函数表达式:

var add = function(a,b) { return a+b; }
函数

表达式将变量分配给匿名函数。它们在运行时进行评估,在声明之前无法调用。

(function() {
    add(3,3)    //Error: add() has not yet been defined.
    var add = function(a,b) { return a+b; }
})();

对象方法:

方法是作为对象的属性的函数。

var obj = {
    propert1: 'property1 value',
    add: function(a,b) {
       return a+b;
    }
};

这些可以通过obj.add(3,3)调用,但不是在通过对象文字声明对象或将方法赋值给属性之前。

有没有预告的方式?

通过函数声明声明函数提供了灵活性。但是,它可能会导致意外的结果,例如(引发的函数):

(function returnVal() {
    function getSomething() {
        return 'foo';
    }
    return getSomething();
    function getSomething() {
        return 'bar';
    }
})();  //returns 'bar'
函数

的返回可能看起来是意外的,但是函数在分析时会引发,getSomething()会被覆盖。

使用函数表达式重写代码会产生所需的结果

(function returnVal() {
    var getSomething = function() {
        return 'foo';
    }
    return getSomething();
    getSomething = function() {
        return 'bar';
    }
})(); //returns 'foo'
另一方面,对象

方法的行为与函数表达式非常相似,但它们可以在对象名称下访问。

var obj = {};
obj.foo = function() { /*code*/ }
obj.bar = function() { /*code*/ }

它们的行为类似于函数表达式,但是这会将代码分组在obj的所有权下。为清楚起见,您可能希望选择此选项。