在对象中引用Javascript对象的正确方法

Question

我是JavaScript的新手,我不太确定在我的应用程序中使用的以下遗留淘汰赛和JS代码:

file1.js:

var FbPicturesObj = {
    fbPicturesVM: new FbPicturesVM(),
    initialize: function () {
        ko.applyBindings(FbPicturesObj.fbPicturesVM, $("#fb-albums")[0]);
        ko.applyBindings(FbPicturesObj.fbPicturesVM, $("#fb-album-photos")[0]);
    },
    Reset: function Reset() {
        FbPicturesObj.fbPicturesVM.albums([]);
        FbPicturesObj.fbPicturesVM.photos([]);
    }
}

file2.js:

function FbPicturesVM() { 

...... some code ....
 }

我的问题是:

1. 每次调用FbPicturesObj.fbPicturesVM都会在内存中创建fbPicturesVM的新实例吗？
2. 是ko.applyBindings调用正确写入？(在代码优化方面)

非常感谢.

Answer 1

File1.js包含 JavaScript 对象的定义，更准确地说是“文字对象创建”。

在其中，每一propertyName: value对声明一个新属性，以便在创建对象时代码仅运行一次。例如fbPicturesVM: new FbPicturesVM()

JavaScript 对象的属性可以是函数，如下所示：initialize: function () {...},. 在这种情况下，无论何时运行FbPicturesObj .initialize此函数都会运行。

对的调用ko.applyBindings是正确的。此方法需要 viewmodel 对象和可选的 DOM 元素作为第二个参数。jQuery 表达式（不完全是）是选定 DOM 元素的数组，因此$("#fb-album-photos")[0]根据ko.applyBindings.

注意：正如您所怀疑的，至少可以说，定义模型的方法并不是最好的。您可以使用揭示模块模式，这使事情变得更加容易。

揭示模块模式

简而言之：

var vm = (function() { // declare a function
   // create variables and functions
   var name = ko.observable();
   var age = ko.observable();
   var _privateVar = 'Yuhu'; // won't be revealed
   var incAge = function() {
      age = age + 1;
   };
   // reveal only what you want, by returning it in an object
   return {
     name: name,
     age: age,
     incAge: incAge
     // note that _privateVar is not exposed, but could be
   }
})(); // This invokes the function, so that it return the model

请注意立即调用函数表达式 (IIFE)模式。

var value = (function() {/*return something*/})(); 

这个模式定义了一个匿名函数，它返回一些东西。最后运行它()，以便返回值，并将其存储在value;

我推荐这个模式，因为它非常容易使用并且很少出错。经典的原型继承、构造函数以及类似的东西更难使用。

()您可以通过删除最后的调用并存储函数定义，轻松地在视图模型工厂（类似于构造函数，但不完全是 js 构造函数）中转换它，以便您可以重复调用它。

var factory = function() {/*return something*/}; 

var vm1 = factory();
var vm2 = factory();