Maison > interface Web > js tutoriel > Création d'objets - Défis JavaScript

Création d'objets - Défis JavaScript

Susan Sarandon
Libérer: 2024-11-03 14:33:31
original
542 Les gens l'ont consulté

Object creation - JavaScript Challenges

Vous pouvez trouver tout le code dans cet article sur le repo Github.


Méthodes de création d'objets


Basé sur un constructeur

Recommandé avant ES6.

/**
 * @param {string} firstName
 * @param {string} lastName
 * @param {number} age
 */

function Person(firstName, lastName, age) {
  this.firstName = firstName;
  this.lastName = lastName;
  this.age = age;
  this.greet = function () {
    console.log(`Hello, my name is ${this.firstName} ${this.lastName}`);
  };
}

// Usage example
const person1 = new Person("John", "Doe", 30);
person1.greet(); // => Hello, my name is John Doe

const person2 = new Person("Jane", "Smith", 25);
person2.greet(); // => Hello, my name is Jane Smith
Copier après la connexion

Basé sur la classe

Recommandé après ES6.

class Person {
  constructor(firstName, lastName, age) {
    this.firstName = firstName;
    this.lastName = lastName;
    this.age = age;
  }

  greet() {
    console.log(`Hello, my name is ${this.firstName} ${this.lastName}`);
  }
}

// Usage example
const person1 = new Person("John", "Doe", 30);
person1.greet(); // => 'Hello, my name is John Doe'

const person2 = new Person("Jane", "Smith", 25);
person2.greet(); // => 'Hello, my name is Jane Smith'
Copier après la connexion

Initialiseur d'objet

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 30,
  greet: function () {
    console.log(`Hello, my name is ${this.firstName} ${this.lastName}`);
  },
};

person.greet(); // => 'Hello, my name is John Doe'
Copier après la connexion

Objet.create()

const personPrototype = {
  greet: function () {
    console.log(`Hello, my name is ${this.firstName} ${this.lastName}`);
  },
};

const person = Object.create(personPrototype);
person.firstName = "John";
person.lastName = "Doe";

// Usage example
person.greet(); // => 'Hello, my name is John Doe'
Copier après la connexion

Modèle d'usine

/**
 * @param {string} firstName
 * @param {string} lastName
 * @param {number} age
 * @return {object}
 */

function createPerson(firstName, lastName, age) {
  return {
    firstName: firstName,
    lastName: lastName,
    age: age,
    greet: function () {
      console.log(`Hello, my name is ${this.firstName} ${this.lastName}`);
    },
  };
}

// Usage example
const person1 = createPerson("John", "Doe", 30);
person1.greet(); // => 'Hello, my name is John Doe'

const person2 = createPerson("Jane", "Smith", 25);
person2.greet(); // => 'Hello, my name is Jane Smith'
Copier après la connexion

Référence

  • Cours - MDN
  • Programmation orientée objet - MDN
  • Programmation orientée objet - MDN
  • Initialiseur d'objet - MDN
  • Object.create() - MDN
  • Modèle d'usine - patterns.dev

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:dev.to
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal