Question

我是JavaScript的新手，在使用默认值定义基础对象的属性和方法时，试图了解对象构造函数与原型。

// base object
function Animal (nameArg, typeArg) {
    this.name = nameArg,
    this.type= typeArg,
    this.sayHello = function() {
        console.log("Hello my name is", this.name, " and I am an ", this.type);
    }
}
// Setting defaults
Animal.prototype.name = "Anonymous";
Animal.prototype.type = "Animal";

//instantiating an animal WITHOUT any arguments passed in
var cat = new Animal; // I am getting undefined when I try to access properties like name

//instantiating an animal WITH argguments passed in
var lion = new Animal("Jimmy", "Lion"); // works as expected

Answer 1

如果要实例化该功能，则无需使用原型。此外，我之后通过添加括号调用 Animal构造函数：

// base object
function Animal (nameArg, typeArg) {
    this.name = nameArg || "Anonymous";
    this.type= typeArg || "Animal";
    this.sayHello = function() {
        console.log("Hello my name is", this.name, " and I am an ", this.type);
    };
}

//instantiating an animal WITHOUT any arguments passed in
var cat = new Animal(); // <-- note the brackets

//instantiating an animal WITH argguments passed in
var lion = new Animal("Jimmy", "Lion");

您的代码版本无效的原因是，尽管您没有传递任何参数，但Animal的构造方法是将原始变量设置为undefined，覆盖原型默认值。

Answer 2

function Animal (args) {
    if(typeof args === 'object') {
        this.name = 'nameArg' in args ? args.nameArg : default_value,
        this.type = 'typeArg' in args ? args.typeArg : default_value,
    }
    else
    {
        this.name = default_value;
        this.name = default_value;
    }
}

new Animal({});
new Animal({nameArg: 'hehe'});
new Animal({typeArg: 'hehe'});
new Animal({nameArg: 'hehe', typeArg: 'hehe'});

Answer 3

你做错了什么

您将其设置为undefined：它本身就是一个值。你根本不应该定义它来工作：

// base object
function Animal (nameArg, typeArg) {
    if (nameArg) this.name = nameArg;
    if (typeArg) this.type = typeArg;
    // could be added to prototype, it's the same for each instance
    this.sayHello = function () { console.log("Hello my name is " + this.name + " and I am an " + this.type); }; // don't use commas here, use the + operator instead
}

// Setting defaults
Animal.prototype.name = "Anonymous";
Animal.prototype.type = "Animal";

var cat = new Animal(); // passing no arguments to constructor
cat.sayHello(); // now gives correct result ("Hello my name is Anonymous and I am an Animal")

//instantiating an animal WITH argguments passed in
var lion = new Animal("Jimmy", "Lion"); // always worked

为什么会这样？

设置为undefined的变量与未定义的变量之间实际上存在差异，足够有趣 - 这是JavaScript的另一个常见怪癖。要说明未定义变量和未定义变量之间的区别，请采用以下示例：

var foo = { x: undefined };
console.log('x' in foo); // true, x has been defined as "undefined"
console.log('y' in foo); // false, foo.y has never been defined

JavaScript中的参数默认为undefined，类似于最初定义变量时没有为其设置值或明确设置为undefined：

function test(arg)
{   console.log(arg); // undefined
    console.log(doesNotExist); // ReferenceError: doesNotExist is not defined
}
test(); // run and see

通过分配给它，JavaScript会记录它被分配给它的记录，因此不会查找原型链以查看该属性是否存在（reference）。

Answer 4

将构造函数更改为：

function Animal (nameArg, typeArg) {
    this.name = nameArg || this.name; // if nameArg is not defined take default instead
    this.type= typeArg || this.type; // if typeArg is not defined take default instead
    this.sayHello = function() {
        console.log("Hello my name is", this.name, " and I am an ", this.type);
    }
}

然后：

var cat = new Animal();

Answer 5

您可以以正确的方式设置默认值，但是在构造函数中覆盖它们。试试这个：

function Animal (nameArg, typeArg) {
    if (nameArg != null) this.name = nameArg,
    if (typeArg != null) this.type = typeArg,
    this.sayHello = function() {
        console.log("Hello my name is", this.name, " and I am an ", this.type);
    }
}

此外，在原型上设置sayHello方法是一个巨大的胜利，不仅仅是使用默认的原型。

Answer 6

cat = new Animal()基本上是cat = new Animal( undefined, undefined )，这些参数用作this.name和this.type。要不覆盖原型的默认值，只需检查是否提供了参数：

function Animal (nameArg, typeArg) {
    if(nameArg) this.name = nameArg;
    if(typeArg) this.type= typeArg;
    this.sayHello = function() {
        console.log("Hello my name is", this.name, " and I am an ", this.type);
    }
}

http://jsfiddle.net/K6Wu8/

Answer 7

如果传入了undefined，您可以使用||将默认值设置为原型值。

function Animal (nameArg, typeArg) {
    this.name = nameArg || this.name,
    this.type= typeArg || this.type,
    this.sayHello = function() {
        console.log("Hello my name is", this.name, " and I am an ", this.type);
    }
}
// Setting defaults
Animal.prototype.name = "Anonymous";
Animal.prototype.type = "Animal";

//instantiating an animal WITHOUT any arguments passed in
var cat = new Animal; // I am getting undefined when I try to access properties like name

//instantiating an animal WITH argguments passed in
var lion = new Animal("Jimmy", "Lion"); // works as expected

示例小提琴 - http://jsfiddle.net/LwsRE/

如何设置基础对象的默认值？

7 个答案:

你做错了什么

为什么会这样？