JS面向对象（3）之Object类，静态属性，闭包，私有属性， call和apply的使用，继承的三种实现方法

JS面向对象（3）之Object类，静态属性，闭包，私有属性， call和apply的使用，继承的三种实现方法

JS作为一门基于面向对象的语言，其语法中包含了许多与对象有关的特性。本文将介绍JS中Object类、静态属性、闭包、私有属性、call和apply的使用、继承的三种实现方法。

Object类

在JS中，所有对象都是由Object类派生而来，因此也可以说所有对象都是Object的实例。Object类可以定义一些公共的属性和方法，使其他对象可以继承它们。

示例：

// 定义一个Person类
function Person(name, age) {
  this.name = name;
  this.age = age;
}

// 通过Object类添加一个方法
Person.prototype.sayHello = function() {
  console.log(`Hello, my name is ${this.name}, I'm ${this.age} years old.`);
}

// 创建一个实例
const person = new Person('Tom', 18);

// 调用方法
person.sayHello();   // 输出：Hello, my name is Tom, I'm 18 years old.

静态属性

JS中的静态属性定义在类中，而不是实例中。这意味着，无论有多少个实例被创建，静态属性的值都是相同的，并且可以通过类名直接访问。

示例：

// 定义一个Car类
function Car() {}

// 添加一个静态属性
Car.totalNum = 0;

// 添加一个方法
Car.prototype.drive = function() {
  Car.totalNum++;
  console.log(`Driving... Current speed: ${this.speed}`);
}

// 创建两个实例
const car1 = new Car();
const car2 = new Car();

// 调用drive方法
car1.drive();   // Driving... Current speed: undefined
car2.drive();   // Driving... Current speed: undefined

// 访问静态属性
console.log(Car.totalNum);   // 输出：2

闭包

闭包是指有权访问另一个函数作用域中的变量的函数。通常情况下，函数内部的变量在函数调用后就无法访问。但是，在某些情况下，我们希望能够访问函数内部的变量，这时就需要使用到闭包了。

示例：

// 因为ES6的出现，我们甚至可以使用更加简洁的箭头函数定义闭包
const greet = (name) => {
  let greeting = 'Hello';
  const greetWithName = () => {
    console.log(`${greeting}, ${name}`);
  }
  return greetWithName;
}

const sayHelloToTom = greet('Tom');
sayHelloToTom();   // 输出：Hello, Tom

私有属性

JS中并没有像其他语言一样有“私有”属性的关键字，我们可以通过闭包的实现方法来实现类似于私有属性的功能。

示例：

// 定义一个Person类
function Person(name) {
  // 利用闭包实现私有属性
  const _age = 18;
  this.name = name;

  // 私有方法
  function _sayName() {
    console.log(`My name is ${this.name}.`);
  }

  // 公有方法
  this.sayHello = function () {
    _sayName();
    console.log(`I'm ${_age} years old.`);
  }
}

// 创建一个实例
const person = new Person('Tom');

person.sayHello();  // 输出：My name is Tom. I'm 18 years old.

call 和 apply 的使用

call和apply是JS中的两个方法，它们的作用是改变函数的上下文，并立即执行函数。

两者的区别在于传参方式不同：call的参数是一个个传递的，而apply的参数是用数组的形式传递的。

示例：

// 定义一个Person类
function Person(name) {
  this.name = name;
}

// 添加一个方法
Person.prototype.sayHello = function (gender, age) {
  console.log(`Hello, my name is ${this.name}. I'm a ${gender}, and I'm ${age} years old.`);
}

// 创建两个实例
const person1 = new Person('Tom');
const person2 = new Person('Jerry');

// 使用call调用方法
person1.sayHello.call(person2, 'boy', 18);       // 输出：Hello, my name is Jerry. I'm a boy, and I'm 18 years old.

// 使用apply调用方法
person1.sayHello.apply(person2, ['boy', 18]);   // 输出：Hello, my name is Jerry. I'm a boy, and I'm 18 years old.

继承的三种实现方法

在JS中，继承的实现方法有三种：原型链、构造函数、组合继承。

示例：

// （1）原型链继承
// 定义一个Animal类
function Animal() {}
Animal.prototype.sayHello = function() {
  console.log('Hello, I am an animal.');
}

// 定义一个Dog类
function Dog() {}
Dog.prototype = new Animal();

// 创建一个实例
const dog = new Dog();
dog.sayHello();   // 输出：Hello, I am an animal.

// （2）构造函数继承
// 定义一个Person类
function Person(name) {
  this.name = name;
}

// 定义一个Employee类
function Employee(name, id) {
  Person.call(this, name);
  this.id = id;
}

// 创建一个实例
const employee = new Employee('Tom', 1001);
console.log(employee.name, employee.id);   // 输出：Tom 1001

// （3）组合继承
// 定义一个Shape类
function Shape() {
  this.name = 'shape';
}

Shape.prototype.toString = function() {
  console.log(`The shape is ${this.name}`);
}

// 定义一个Circle类
function Circle(radius) {
  Shape.call(this);
  this.radius = radius;
}

Circle.prototype = new Shape();
Circle.prototype.constructor = Circle;

Circle.prototype.area = function() {
  console.log(`The area is ${Math.PI * this.radius * this.radius}`);
}

// 创建一个实例
const circle = new Circle(5);
circle.toString();   // 输出：The shape is shape
circle.area();       // 输出： The area is 78.53981633974483