JavaScript 面向对象

1. 对象

1.1 创建对象

1. 创建内置对象

• JS中内置对象是一种特殊的数据，常见的内置对象如下

Sting
Date
Array
Boolean
Math
RegExp

创建方法

var myDate =new Date();

1.2创建自定义对象

• JS创建自定义对象最简单的方式就是使用new操作符创建一个Object对象，添加属性和方法

  语法如下

var 对象名称 =new Object();

1.3简单工厂模式

• 简单工厂模式是一种创建对象的设计模式，它通过一个共同的方法来创建对象实例。
  这种模式把创建实例的工作转移到一个单独的方法中，而不是让客户端直接实例化对象。
  这有助于降低代码耦合度，并提供更好的灵活性。

代码示例：

// 定义动物类
function Cat(name) {
    this.name = name;
    this.type = 'cat';
}
function Dog(name) {
    this.name = name;
    this.type = 'dog';
}

// 简单工厂方法
function animalFactory(type, name) {
    if (type === 'cat') {
        return new Cat(name);
    } else if (type === 'dog') {
        return new Dog(name);
    } else {
        throw new Error('Invalid animal type');
    }
}

// 使用简单工厂方法创建对象实例
var myCat = animalFactory('cat', 'Kitty');
var myDog = animalFactory('dog', 'Buddy');

console.log(myCat); // 输出: Cat { name: 'Kitty', type: 'cat' }
console.log(myDog); // 输出: Dog { name: 'Buddy', type: 'dog' }

2.构造函数和原型对象

2.1构造函数

1. 构造函数是用来创建特定类型对象的函数。构造函数可以通过 new 关键字来实例化对象，并且可以初始化对象的属性和方法。

2. 和工厂模式的不同

• 没有显示创建对象
• 直接将属性和方法给this对象
• 没有return

代码示例

// 定义一个构造函数
function Person(name, age) {
    this.name = name; // 使用 this 关键字定义对象属性
    this.age = age;

    this.greet = function() { // 在构造函数中定义对象方法
        return 'Hello, my name is ' + this.name + ' and I am ' + this.age + ' years old.';
    };
}

// 使用构造函数创建对象实例
var person1 = new Person('Alice', 30);
var person2 = new Person('Bob', 25);

// 调用对象方法
console.log(person1.greet()); // 输出: Hello, my name is Alice and I am 30 years old.
console.log(person2.greet()); // 输出: Hello, my name is Bob and I am 25 years old.

2.2 原型对象

• js创建的每一个函数的有一个prototype，这个属性指向原型对象

语法

构造函数名.prototype.新属性或者新方法

代码示例

// 定义一个构造函数
function Person(name, age) {
    this.name = name;
    this.age = age;
}

// 在构造函数的原型对象上定义方法
Person.prototype.greet = function() {
    return 'Hello, my name is ' + this.name + ' and I am ' + this.age + ' years old.';
};

// 创建对象实例
var person1 = new Person('Alice', 30);
var person2 = new Person('Bob', 25);

// 调用通过原型对象定义的方法
console.log(person1.greet()); // 输出: Hello, my name is Alice and I am 30 years old.
console.log(person2.greet()); // 输出: Hello, my name is Bob and I am 25 years old.

3.继承

3.1原型链

• 什么是原型链

1. 原型链是 JavaScript 中一个重要的概念，它描述了对象之间的继承关系。在 JavaScript 中，每个对象都有一个原型（prototype），并且对象可以通过原型链来访问其他对象的属性和方法

• 原型链的使用

2. 原型链是由对象的原型对象组成的链式结构。当我们访问一个对象的属性或方法时，如果对象本身没有这个属性或方法，JavaScript 就会沿着原型链向上查找，直到找到匹配的属性或方法或者到达原型链的顶端（Object.prototype）

• 原型链的缺点

1. 引用类值的原型属性会被实例共享
2. 创建子类型的实例，不能向父类型的构造函数中传递参数
   代码示例

// 定义一个构造函数
function Person(name) {
    this.name = name;
}

// 在构造函数的原型上添加一个方法
Person.prototype.sayHello = function() {
    console.log("Hello, my name is " + this.name);
};

// 创建一个新对象
var person1 = new Person("Alice");
person1.sayHello(); // 输出：Hello, my name is Alice

// 沿着原型链访问方法
console.log(person1.toString());

3.2 对象继承

1. 借用构造函数

• 通过在子类构造函数中调用父类构造函数来实现属性的继承和共享

语法

apply(thisObj[,argArray])
接收两个参数，一个函数运用的作用域，另一个是数组
call([thisObj[,arg1[,arg2],[,argN]]])
允许您调用一个具有指定 this 值和单独给出的参数的函数，参数是按顺序传递给函数的

function greet(name) {
    console.log(`Hello, ${name}!`);
}

greet.call(null, 'Alice');

function greet(name, age) {
    console.log(`Hello, ${name}! You are ${age} years old.`);
}

greet.apply(null, ['Bob', 30]);