Professional JavaScript for Web Developers 第四版学习笔记 CHAPTER 8: OBJECTS, CLASSES, AND OBJECT-ORIENTED PROGRAMMING

欢欢欢欢 发表于 2021-6-3 09:06

Understanding Objects 251
Types of Properties 252
  Data Properties 252
  Accessor Properties 254
Defining Multiple Properties 255
Reading Property Attributes 256
Merging Objects 257
Object Identity and Equality 260
Enhanced Object Syntax 261
  Property Value Shorthand 261
  Computed Property Keys 262
  Concise Method Syntax 263
Object Destructuring 264
  Nested Destructuring 266
  Partial Destructuring Completion 267
  Parameter Context Matching 268
Object Creation 268
Overview 268
The Factory Pattern 269
The Function Constructor Pattern 269
  Constructors as Functions 272
  Problems with Constructors 272
The Prototype Pattern 273
  How Prototypes Work 274
  Understanding the Prototype Hierarchy 278
  Prototypes and the “in” Operator 281
  Property Enumeration Order 283
Object Iteration 284
  Alternate Prototype Syntax 285
  Dynamic Nature of Prototypes 286
  Native Object Prototypes 287
  Problems with Prototypes 288
Inheritance 289
Prototype Chaining 289
  Default Prototypes 291
  Prototype and Instance Relationships 291
  Working with Methods 292
  Problems with Prototype Chaining 294
Constructor Stealing 294
  Passing Arguments 295
  Problems with Constructor Stealing 296
Combination Inheritance 296
Prototypal Inheritance 297
Parasitic Inheritance 298
Parasitic Combination Inheritance 299
Classes 302
Class Definition Basics 302
  Class Composition 303
The Class Constructor 303
  Instantiation 304
  Understanding Classes as Special Functions 306
Instance, Prototype, and Class Members 307
  Instance Members 307
  Prototype Methods and Accessors 308
  Static Class Methods and Accessors 309
  Non-Function Prototype and Class Members 310
  Iterator and Generator Methods 311
Inheritance 312
  Inheritance Basics 312
  Constructors, HomeObjects, and super() 313
  Abstract Base Classes 316
  Inheriting from Built-in Types 317
  Class Mixins 318
Summary

-------------------------------------------------

Object.defineProperty

// Define object with pseudo-private member 'year_'
// and public member 'edition'
let book = {
 year_: 2017,
 edition: 1
};

Object.defineProperty(book, "year", {
 get() {
  return this.year_;
},
set(newValue) {
 if (newValue > 2017) {
  this.year_ = newValue;
  this.edition += newValue - 2017;
 }
}
});
book.year = 2018;
console.log(book.edition); // 2

相关方法:Object.defineProperties(),Object.getOwnPropertyDescriptor(), Object.getOwnPropertyDescriptors(),Object.assign(),Object.is()

-------------------------------------------------

// With object destructuring
let person = {
name: 'Matt',
age: 27
};
let { name: personName, age: personAge } = person;
console.log(personName); // Matt
console.log(personAge); // 27

-------------------------------------------------

the “in” Operator

There are two ways to use the in operator: on its own or as a for-in loop. When used on its own, the in operator returns true when a property of the given name is accessible by the object, which is to say that the property may exist on the instance or on the prototype.

相关方法:hasOwnProperty(),Object.keys(),Object.getOwnPropertyNames(),Object.getOwnPropertySymbols()

-------------------------------------------------

changing the prototype to a different object severs the tie between the constructor and the original prototype.

function Person() {}
let friend = new Person();
Person.prototype = {
 constructor: Person,
 name: "Nicholas",
 age: 29, job: "Software Engineer",
 sayName() {
 console.log(this.name);
 }
};
friend.sayName(); // error

-------------------------------------------------

class

// class declaration
class Person {}
// class expression
const Animal = class {};

1.Everything defined in the class body is defined on the class prototype object.

2.Methods can be defined in either location, but member data such as primitives and objects cannot be added to the prototype inside the class body.

3.Class definitions also support getters and setter accessors. 

-------------------------------------------------

extends

class Vehicle {}
// Inherit from class
class Bus extends Vehicle {}

ES6 classes support a single inheritance format. Using the extends keyword, you are able to inherit from anything that has a [[Construct]] property and a prototype. For the most part, this means inheriting from another class, but this also allows for backwards compatibility with function constructors

-------------------------------------------------

super()

 Derived class methods have a reference to their prototype via the super keyword. This is only available for derived classes, and only available inside the constructor or inside static methods. super is used inside the constructor to control when to invoke the parent class constructor.super can also be used inside static methods to invoke static methods defined on the inherited class.

-------------------------------------------------

new.target

// Abstract base class
class Vehicle {
 constructor() {
  console.log(new.target);
  if (new.target === Vehicle) {
  throw new Error('Vehicle cannot be directly instantiated');
  }
 }
}

You can prevent direct instantiation by checking that new.target is never the abstract base class.