在 Javascript 中制作对象的方式有何不同？

Question

经过一些研究，我发现了四种初始化对象的方法 Javascript:

1.

var Game = { // I guess everything here is made public?
    canvas : document.createElement("canvas"),

    render : function(){

    }
}

2.

var Game  = function(){ //if this function isn't a self invoking one, how should it be called?
    var canvas = document.createElement("canvas");

    return {
    render : function(){ // why this does not work when being called? says it's undefined
        alert("a");
    }
  }
}

3.

var Game  = (function(){
    var canvas = document.createElement("canvas");

    function init_properties(){ // why is this not called?
        alert("test");
    }

    return {
    // whatever you want to be made public

    render : function(){
        alert(canvas);
    }
    }
}) ()

4.

function Game(){
    var privateVar = 10;
    this.publicVar = 20;

    this.render = function(){

    }
}

除了评论中的问题，每一个应该在什么情况下使用？使用一个比另一个有明显的性能差异吗？

Answer 1

你的第一个和第三个方法return对象，你的第二个和第四个方法是实例化函数。第三个与第二个相同，但会立即调用以解析为对象。这称为立即调用函数表达式 (IIFE)。它用于创建可供 returned 对象的方法访问的私有变量，而无需单独定义初始化函数。确实没有实际理由这样做。

在 JavaScript 中实例化对象有两种方法：直接和通过初始化函数。

当您不需要跟踪与对象关联的私有变量时，您想使用直接实例化。如果确实需要私有变量，请通过调用对象的初始化函数 return 来实例化对象。

直接（你的第一种方法）：

const Game = {
    canvas : document.createElement("canvas"),
    render : () => alert('a')
}

通过初始化函数（你的第二种和第四种方法）：

const initGame = () => {
    const privateCounter = 0
    const canvas = document.createElement("canvas")
    return {
      render: () => alert('a')
    }
}

const Game = initGame()

在 Javascript 中制作对象的方式有何不同？

What are the differences in ways to make an object in Javascript?

javascript

constructor

object-literal