简述JS面向对象编程（很容易接受）

面向对象的特点：封装、继承、多态

1、封装 根据功能使用集成为api接口，使用对象的人可以不考虑内部实现，只需根据暴露出的api对应的属性进行使用。
2、继承 为了增强代码的复用性，子类可以从父类上继承方法和属性，也可以自己创建拥有自己的属性和方法。
3、多态 同一操作在不同的对象会产生不同的效果。

可以看出来，在比较复杂的问题面前，或者参与方较多的时候，面向对象的编程思想可以很好的简化问题，并且能够更好的扩展和维护。

Js中的面向对象

对象里包含方法和属性

创建对象的方法：

1、普通方式：

const Fruit = new Obejct();
Fruit.color = "white"
Fruit.value= function() {
     
  console.log('value')
}

例子：

//工厂模式：
function createObject() {
     
  const Fruit = new Object();
  Fruit.color = "white"
  Fruit.value= function() {
     
	console.log('value')
  }
  return Fruit 
}
var obj = createObject()
obj.color = 'red'
console.log(obj)
var obj1 = createObject()
console.log(obj1)
//工厂模式，可理解为生产出的产品都是独立的个体。

工厂函数在需要创建多个相似对象时可以有效地减少重复代码，但是这样有个缺点就是，每次调用工厂函数创建的对象都是独立的object，不存在继承关系，显然，这样的面向对象编程失去了灵魂。

2、构造函数／实例

function Fruit(color) {
     
  this.color = color
  this.value= function() {
     
  }
}
const fruit1= new Fruit('blue')
const fruit2= new Fruit('blue')
console.log(fruit2.value===fruit1.value) //false

说到构造函数，顺便带过一下静态属性
静态属性是绑定在构造函数上的属性方法，需要通过构造函数访问。

注意:构造函数函数名首字母要大写, 用以区别普通函数
function Fruit(color) {
     
	  this.color = color
	  if (!Fruit.total) {
     
	  	Fruit.total = 0
	  }
	  Fruit.total++
	}
	const fruit1 = new Fruit('red')
	console.log(Fruit.total)
	const fruit2 = new Fruit('blue')
	console.log(Fruit.total)

通过 this 添加的属性和 法总是指向当前对象的，所以在实例化的时候，通过this添加的属性和方法都会在内存中复制一份，这样就会造成内存的浪费。
但是这样创建的好处是即使改变了某一个对象的属性或方法，不会影响其他的对象(因为每 个对象都是复制的一份)
看到这里你们可能会想这跟工厂函数模式不是一样的吗？再看看在此基础上往构造函数的原型添加方法这种方式。

3、原型

通过原型继承的方法并不是自身的，我们要在原型链上一层一层的查找，这样创建的好处是只在内存中创建一次，实例化的对象都会指向这个prototype对象。

function Fruit(color) {
     
  this.color = color
}
Fruit.prototype.value= function() {
     
  console.log(value)
}
const fruit1= new Fruit('blue')
const fruit2= new Fruit('orange')
console.log(fruit2.value===fruit1.value) //true

看了下图的原型链，构造函数的实例原型（whitePlayer.proto）指向该构造函数的原型对象（Player.prototype),这就很容易让人混淆_proto_和prototype这连两个属性，而且写法很不优雅，接下来说一下语法糖，它提供了一种比较优雅的写法Class

class Fruit{
     
	  constructor(color) {
     
	      this.color = color
	  }
	  value(){
     
		  console.log('我是'+this.color)
	  }
	}
	var orange = new Fruit('orange')
	orange.value()

原型链：

关于原型链这块，博主看到过一篇很有趣的博文，用漫画的形式讲解：JavaScript最大的秘密

new关键字

1. 一个继承自Player.prototype的新对象Player1被创建
2. Player1.proto指向Player.prototype
3. 将this指向新创建的对象Player1
4. 返回新对象
5. 如果构造函数没有显式返回值，则返回this
6. 如果构造函数有显式返回值，是基本类型， 如 number,string,boolean, 那么还是返回this
7. 如果构造函数有显式返回值，是对象类型， 如{ a: 1 }, 则返回这个对象{ a: 1 }

function proPlayer() {
     
    return {
     a: 1}
}
const pro1 = new proPlayer()
console.log(pro1) // {a: 1}
function proPlayer() {
     
    return 123
}
const pro1 = new proPlayer()
console.log(pro1) // proPlayer {}
function proPlayer() {
     
    return
}
const pro1 = new proPlayer()
console.log(pro1) // proPlayer {}