《JavaScript启示录》——1.4 用户自定义/非原生对象构造函数

最新推荐文章于 2024-10-11 17:39:47 发布

weixin_34356138

最新推荐文章于 2024-10-11 17:39:47 发布

阅读量86

点赞数

文章标签： javascript ViewUI

原文链接：https://yq.aliyun.com/articles/96284

版权

本节书摘来自异步社区《JavaScript启示录》一书中的第1章，第1.4节，作者：【美】Cody Lindley著，更多章节内容可以访问云栖社区“异步社区”公众号查看

1.4 用户自定义/非原生对象构造函数

正如在Person()构造函数中所看到的，我们可以创建自己的构造函数，从中可以生成不只一个，而是多个自定义对象。

下面列出了熟悉的Person()构造函数：

<!DOCTYPE html><html lang="en"><body><script>
var Person = function (living, age, gender) {
    this.living = living;
    this.age = age;
    this.gender = gender;
    this.getGender = function () { return this.gender; };
};

var cody = new Person(true, 33, 'male');
console.log(cody); // 输出Object {living=true, age=33, gender="male", ...}

var lisa = new Person(true, 34, 'female');
console.log(lisa); // 输出Object {living=true, age=34, gender="female", ...}

</script></body></html>

正如你所看到的，通过传递特定的参数和调用Person()构造函数，可以轻松地创建大量的特定people对象。当需要两个或三个以上具有相同属性但具有不同值的对象时，这样做是非常有用的。细想一下，这正是JavaScript使用原生对象所发挥的作用。Person()构造函数与Array()构造函数一样也遵循同样的原则。因此new Array('foo','bar')与new Person(true, 33, 'male')确实没有多大差异。创建自定义构造函数只是在使用JavaScript本身在原生构造函数中所使用的相同的模式。

注意

虽然这不是必需的，但当创建将要与new操作符一起使用的自定义构造函数时，最佳做法是保持构造函数名称的第一个字符大写：是Person()，而不是person()。
关于构造函数比较复杂的一点就是this值在函数内部的使用方式。请记住，构造函数只是一个饼干模具，在将它与new关键字一起使用时，它会创建一个拥有构造函数内部定义的属性和值的对象。在使用new关键字时，this值的字面意思是基于构造函数内部的语句创建的新对象/新实例。另一方面，如果创建一个构造函数，且不使用new关键字进行调用，那么this值将引用包含该函数的“父”对象。更多细节内容请参考第6章。
可以放弃使用new关键字和构造函数的概念，方法是使该函数显式地返回一个对象。必须显式地编写构建并返回Object()对象的函数：var myFunction = function(){return {prop: val}};。但是，这样做会避开原型继承的使用。