码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript最佳做法—创建对象

时间:2020-05-18 12:37:32      阅读:51      评论:0      收藏:0      [点我收藏+]

标签:style   创建   运算   为我   传递   文字   实例   运算符   str   

Don‘t Use the Object 建设者

Object构造函数允许我们创建一个对象。但是,由于有更短的创建对象的方法,因此不需要创建对象。

例如,代替使用Object构造函数创建对象来编写以下内容,我们可以编写为:

const obj = new Object();obj.a = 1;obj.b = 2;

 

我们也可以这样写:

const obj = { a:1, b:2};

 

如我们所见,通过直接创建对象文字而不是使用Object构造函数,我们避免了很多额外的代码输入。

我们还可以创建构造函数或类来创建模板函数,以用于创建新对象。

例如,我们可以Person使用类语法创建构造函数,以便可以Person使用new运算符创建新的对象。

我们可以编写以下代码来创建Person构造函数:

class Person { constructor(name) { this.name = name; }}

 

在上面的类中,我们有name用于在name实例中设置实例变量的参数Person。

然后,我们可以Person使用它创建多个实例,如下所示:

const jane = new Person(‘jane‘);const joe = new Person(‘joe‘);const alex = new Person(‘alex‘);

 

在上面的代码中,我们创建了3个新Person实例,它们具有不同的值,this.name这些值是通过name参数传递的。

我们还可以通过编写以下代码将实例方法添加到类中:

class Person { constructor(name) { this.name = name; } greet(greeting) { return `${greeting} ${this.name}`; }}

 

在上面的代码中,我们有greetinstance方法,该方法接受一个greeting字符串并将其与this.nameinstance变量组合。

然后我们可以这样称呼它:

console.log(jane.greet(‘hi‘));console.log(joe.greet(‘hi‘));console.log(alex.greet(‘hi‘));

 

然后我们得到:

hi janehi joehi alex

 

记录在控制台日志输出中,如我们所说greet的那样传递‘hi‘为的值greeting。

如我们所见,使用JavaScript类,我们可以创建具有相同实例变量和方法的对象。

创建对象的另一种方法是使用Object.create方法。此方法很有用,因为我们可以在创建对象时设置对象的原型。

例如,如果我们要创建一个以另一个对象作为原型的对象,则可以编写以下代码:

const bar = { a:1}const foo = Object.create(bar);foo.b = 1;foo.c = 2;

 

在上面的代码中,我们有了bar对象,该foo对象通过使用Object.create方法用作对象的原型。

然后我们增加额外的属性b和c对foo对象本身。b并且c是foo自己的,还是非继承财产,a是原型的财产foo。

原型是子对象的模板对象。对象从其原型继承属性。

如果我们记录该foo对象,则会得到foo的__proto__属性具有a其值设置为1的属性。

如果要创建没有原型的对象,则可以Object.create使用参数调用该方法,null以便__proto__不设置该属性。

例如,我们可以编写以下代码来创建对象:

const foo = Object.create(null);foo.b = 1;foo.c = 2;

 

然后,如果我们记录的值foo,我们将看到它没有__proto__属性,这意味着该对象没有原型。

结论

有很多方法可以简洁地创建对象。我们不应该只使用Object构造函数来创建对象。

这是因为与定义对象文字相比,它没有任何好处。它们都继承Object和使用构造函数是完成同一件事,但他们各自方法有所不同。

创建对象的替代方法,包括使用类作为新对象的模板。

最后,我们可以使用Object.create来创建具有所需原型的对象

JavaScript最佳做法—创建对象

标签:style   创建   运算   为我   传递   文字   实例   运算符   str   

原文地址:https://www.cnblogs.com/xiewangfei123/p/12909686.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!