当前位置:首页 > 系统运维

JavaScript中几乎一切都是对象:创建对象的三种方式

本文转载自公众号“读芯术”(ID:AI_Discovery)。中乎

Javascript中的切都一切几乎都是对象,无论是对象对象的种数组还是函数。本文将教你使用JavaScript创建对象的创建三种方法。

对象字面量

JavaScript对象字面量是中乎指用大括号括起来的用逗号分隔的名称——值对列表。对象字面量用于封装代码并将其包装在有序的切都包中。

let Person = {    name: "Foziya",对象对象的种   age: 20,   action: ["walk", " run"],   greeting: function() {      console.log("Hello");   } }; 

对象字面量的属性值可以是任何数据类型,包括数组字面量、创建函数字面量和嵌套对象字面量。中乎

let shape = {    name: "rectangle",切都   color: "red",   size: {      length: 10,     breadth: 20   } }; console.log(shape);  // {  name:rectangle,  // color: red,  // size: {  length:10, breadth: 20 } } console.log(shape.size.length) // 10 

简写属性名称

假设必须将不同的变量放在一个对象内,有一种方法是对象对象的种:

let one = 1; let two = 2; let three = 3; let numbers = {    one: one,   two: two,   three: three }; console.log(numbers); //{  one: 1, two: 2, three: 3 } 

使用ECMAScript 2015,可通过较短的创建表示法实现相同的目的:

let one = 1; let two = 2; let three = 3; let numbers = {  one, two, three }; console.log(numbers); //{  one: 1, two: 2, three: 3 } console.log(numbers.one) // 1 console.log(numbers.one === {  one }.one); // true 

用户定义的构造函数

你也可以使用函数在JavaScript中创建对象。仔细想,中乎其实它们本身已经是云服务器切都对象了,因此对象用于创建更多对象。对象对象的种

通常,此方法优于对象构造函数。试想必须创建数百个具有相同属性的对象,使用对象构造函数方法,必须手动将所有属性添加到所有对象,但是使用构造函数可以预定义这些属性。

functionmovies(name, releaseYear, genre, ratings) {    this.name = name;   this.releaseYear =releaseYear;   this.genre = genre;   this.ratings =ratings;   this.watch = () => {      console.log("WatchOnline");   }; } let DPS = new movies("Dead Poets Society", 1989, ["Drama", "Teen"], {    IMDb: "8.1 /10",   Metacritic: "79%" }); console.log(DPS);movies {  //     name: Dead Poets Society, //         releaseYear: 1989, //             genre: [Drama,Teen], //                 ratings: {  IMDb:8.1 / 10, Metacritic: 79% }, //     watch: [Function] // } let rocky = new movies("Rocky", 1976, ["Drama", "Sports"], {    IMDb: "8.1 /10",   Metacritic: "70%" }); console.log(rocky); // movies {  //     name: Rocky, //         releaseYear: 1976, //             genre: [Drama,Sports], //                 ratings: {  IMDb:8.1 / 10, Metacritic: 70% }, //     watch: [Function] // } 

使用相同的构造函数,可以创建任意数量的对象。

重复的属性名称

如果两个属性使用相同的名称,则第二个属性将覆盖第一个属性。

let Person = {    name: "NeyVatsa",   name: "Shashank" }; console.log(Person.name); // Shashank 

New关键字

对象构造函数为给定值创建一个对象封装器。如果该值不存在或未定义,它将创建并返回至一个空对象。否则的话,它将返回至一个与给定值类型一致的对象。

也可以使用new关键字创建对象。使用Javascript中的内置对象构造函数,创建一个新的空对象;或者,此关键字可以与用户定义的构造函数一起使用。服务器租用首先来看一个例子:

let movies = newObject(); console.log(movies) //{ } 

下一步是向此空对象添加属性和方法,可通过简单的点标记来实现:

let movies = newObject(); console.log(movies) //{ } movies.name = "Dead Poets Society"; movies.releaseYear = 1989; movies.genre = ["Drama", "Teen"]; movies.ratings = {    IMDb: "8.1 /10",   Metacritic: "79%" }; movies.watch = () => {    console.log("WatchOnline"); }; console.log(movies); // {  name: Dead Poets Society, //  releaseYear: 1989, //  genre: [ Drama, Teen ], //  ratings: {  IMDb: 8.1 / 10,Metacritic: 79% }, //  watch: [Function] } movies.watch(); // Watch Online 

但我不建议这种做法,因为后台有作用域解析,可以检查构造函数是内置的还是用户定义的。

使用ES6类创建对象

此方法与通过用户定义的构造函数使用new关键字非常类似。类是面向对象编程(OOP)的主要组件,可以创建实际上是对象的许多类实例。在ES6规范的支持下,现在可以用类替换构造函数。

classMovies {    constructor(name,releaseYear, genre, ratings) {      this.name = name;     this.releaseYear = releaseYear;     this.genre = genre;     this.ratings =ratings;   }   watch() {      console.log("WatchOnline");   } } let rocky = new Movies("Rocky", 1976, ["Drama", "Sports"], {    IMDb: "8.1 /10",   Metacritic: "70%" }); console.log(rocky); // Movies {  //     name: Rocky, //         releaseYear: 1976, //             genre: [Drama,Sports], //                 ratings: {  IMDb:8.1 / 10, Metacritic: 70% } // } rocky.watch(); //Watch Online 

上面示例中,我已经定义了构造函数中的所有参数。方法可以是类的一部分,而声明可以稍后添加到类的创建实例中,成为“对象”:

/* above example */ rocky.buy = function() {    console.log("Buy theMovie"); }; rocky.buy(); // Buy the Movie 

而这里方法是对象的一部分,不会影响原始类。服务器托管

图源:unsplash

在JavaScript这一基于原型的继承语言中,类和构造函数都模仿面向对象的继承模型。熟悉类非常有帮助,React这样的流行JavaScript库会经常使用类句法。

你掌握了吗?

分享到:

滇ICP备2023006006号-16