Javascript对象的属性和功能

Ben*_*awk 4 javascript oop object

在JavaScript中我看到了几种不同的方式,某些任务可以在一个对象中执行,例如,我在下面的对象Egg.

任何人都可以告诉我每一个之间的区别,为什么我会使用一个而不是另一个等

 var Egg = function(){

    //Properties

    var shell = "cracked" // private property 

    this.shell = "cracked" // public property

    shell: "cracked" // what is this??

    //functions

    function cook(){

        //standard function
    }

    cook: function(){
        //what kind of function is this?
    }

    //not sure what this is

    details: {
        //What is this? an array :S it holds 2 elements?
        cost: 1.23,
        make: 'Happy Egg';
    }




}
Run Code Online (Sandbox Code Playgroud)

T.J*_*der 5

您的代码段不是很有效,但以下是它引发的一些事情:

属性初始化器,对象初始化器

你问的是什么shell: cracked.这是一个属性初始化器.您可以在对象初始值设定项(也称为"对象文字")中找到它们,它们的写法如下:

var obj = {
    propName: "propValue"
};
Run Code Online (Sandbox Code Playgroud)

这相当于:

var obj = {};
obj.propName = "propValue";
Run Code Online (Sandbox Code Playgroud)

以上两者都创建了一个带有属性的对象,该属性propName具有字符串值"propValue".请注意,this没有进入它.

功能

有几个地方的功能通常是相对于对象进入的:

构造函数

构造函数,它们是您通过new操作员调用的函数.这是一个例子:

// Constructor function
function Foo(name) {
    this.name = name;
}

// Usage
var f = new Foo("Fred");
Run Code Online (Sandbox Code Playgroud)

注意this在那里使用关键字.那是你见过的(最有可能的).当您通过构造函数调用时new,this指的是由new运算符创建的新对象.

this在JavaScript中是一个很滑的概念(与thisC++,Java或C#完全不同),我在我的博客上推荐这两个(咳嗽)帖子:

生成器/工厂功能

您不必使用构造函数new,而另一种模式使用"builder"或"factory"函数:

// A factory function
function fooFactory(name) {
    var rv = {}; // A new, blank object

    rv.name = name;

    return rv;
}

// Usage
var f = fooFactory("Fred");
Run Code Online (Sandbox Code Playgroud)

私人财产

您在问题中提到了"私人"属性.JavaScript根本没有私有属性(但是,它们正在路上).但是你看到人们模拟它们,通过定义它们在对象上使用的函数作为执行上下文的闭包(通常是对构造函数或工厂函数的调用),其中包含其他人无法看到的变量,如下所示:

// Constructor function
function EverUpwards() {
    var counter = 0;

    this.increment = function() {
        return ++counter;
    };
}

// Usage:
var e = new EverUpwards();
console.log(e.increment()); // "1"
console.log(e.increment()); // "2"
Run Code Online (Sandbox Code Playgroud)

(该示例使用构造函数,但您可以使用工厂函数执行相同的操作.)

请注意,即使我们分配的功能increment可以访问counter,也没有别的可以访问.所以counter实际上是私有财产.这是因为函数是一个闭包.更多:关闭并不复杂


Nor*_*ard 4

当然,本。

这样就深入了解了 JavaScript 的活力。首先,我们将了解基础知识 - 如果您来自了解基于类的语言(例如 Java 或 C++/C#),那么最有意义的就是构造函数模式它很早就包含在内:

function Egg (type, radius, height, weight) {
    // private properties (can also have private functions)
    var cost = (type === "ostrich") ? 2.05 * weight : 0.35 * weight;

    // public properties
    this.type = type;
    this.radius = radius;
    this.height = height;
    this.weight = weight;
    this.cracked = false;

    // this is a public function which has access to private variables of the instance
    this.getCost = function () { return cost; };
}

// this is a method which ALL eggs inherit, which can manipulate "this" properly
// but it has ***NO*** access to private properties of the instance
Egg.prototype.Crack = function () { this.cracked = true; };


var myEgg = new Egg("chicken", 2, 3, 500);

myEgg.cost; // undefined
myEgg.Crack();
myEgg.cracked; // true
Run Code Online (Sandbox Code Playgroud)

这很好,但有时有更简单的方法来解决问题。有时候你真的不需要上课。

如果您只想使用一个鸡蛋,因为这就是您的食谱所要求的,该怎么办?

var myEgg = {};  // equals a new object
myEgg.type = "ostrich";
myEgg.cost = "......";
myEgg.Crack = function () { this.cracked = true; };
Run Code Online (Sandbox Code Playgroud)

太好了,但是仍然有很多重复。

var myEgg = {
    type : "ostrich",
    cost : "......",
    Crack : function () { this.cracked = true; }
};
Run Code Online (Sandbox Code Playgroud)

这两个“myEgg”对象完全相同。

这里的问题是 myEgg 的每个属性和每个方法都是 100% 向任何人公开的。

解决方案是立即调用函数:

// have a quick look at the bottom of the function, and see that it calls itself
// with parens "()" as soon as it's defined
var myEgg = (function () {
    // we now have private properties again!
    var cost, type, weight, cracked, Crack, //.......

    // this will be returned to the outside var, "myEgg", as the PUBLIC interface
    myReturnObject = {
        type : type,
        weight : weight,
        Crack : Crack, // added benefit -- "cracked" is now private and tamper-proof
        // this is how JS can handle virtual-wallets, for example
        // just don't actually build a financial-institution around client-side code...
        GetSaleValue : function () { return (cracked) ? 0 : cost; }
    };

    return myReturnObject;
}());

myEgg.GetSaleValue(); // returns the value of private "cost"
myEgg.Crack();
myEgg.cracked // undefined ("cracked" is locked away as private)
myEgg.GetSaleValue(); // returns 0, because "cracked" is true
Run Code Online (Sandbox Code Playgroud)

希望这是一个良好的开始。