JS深入理解(三)之面向对象

之前的总结:面向对象编程

封装,继承,多态

封装:隐藏细节


原型链:对象与对象
this:对象与函数(JS 中对象函数没有关系,JS 之父通过 this 强行使得它们有关系。)
函数不是对象的附属品。

关于this:

fn(this,arguments)
  1. 参数的值只能在传参的时候确定
  2. this是第一个参数
  3. this的值只有在传参的时候确定
  4. API的this要看文档
  5. 箭头函数不用this,也没有arguments
  6. this的值总是不确定的

构造函数:
不要用__proto__
封装的思想
约定首字母大写
忽略里面自定义的return

用JS实现Java的面向对象
Java的类:

  • 自有属性
  • 共有属性
  • extend继承
// 继承
function Human(options){
    this.name = options.name
    this.肤色  = options.肤色
}
Human.prototype.eat = function(){}
Human.prototype.drink = function(){}
Human.prototype.poo = function(){}

function Soldier(options){
    // this.__proto__ = Soldier.prototype
    Human.call(this, options)
    this.ID = options.ID
    this.生命值 = 42
}
// createSoldier.prototype = {constructor: createSoldier}
// ie
// function fakeHuman(){}
// fakeHuman.prototype = Human.prototype
// Soldier.prototype = new fakeHuman()
// no-ie
Soldier.prototype = Object.create(Human.prototype)
// 脑中的
// Soldier.prototype.__proto__ === Human.prototype

Soldier.prototype.兵种 = "美国大兵"
Soldier.prototype.攻击力 = 5
Soldier.prototype.行走 = function(){ /*走俩步的代码*/},
Soldier.prototype.奔跑 = function(){ /*狂奔的代码*/  },
Soldier.prototype.死亡 = function(){ /*Go die*/    },
Soldier.prototype.攻击 = function(){ /*糊他熊脸*/   },
Soldier.prototype.防御 = function(){ /*护脸*/       }
// Soldier.prototype.__proto__ = Human.prototype



var s = new Soldier({name: '方方', 肤色:'yellow', ID: 1})

// 1. __proto__ 不能用
// Soldier.prototype.__proto__ = Human.prototype
// Soldier.prototype.__proto__ === this.__proto__ === Human.prototype


// class

class Human{
    constructor(options){
        this.name = options.name
        this.肤色  = options.肤色
    }
    eat(){}
    drink(){}
    poon(){}
}

class Soldier extends Human{
    constructor(options){
        super(options)
        this.ID = options.ID
        this.生命值 = 42
        this.兵种 = "美国大兵"
        this.攻击力 = 5
    }
    行走(){ /*走俩步的代码*/}
    奔跑(){ /*狂奔的代码*/  }
    死亡(){ /*Go die*/    }
    攻击(){ /*糊他熊脸*/   }
    防御(){ /*护脸*/       }
}
var s = new Soldier({name: '方方', 肤色:'yellow', ID: 1})

猜你喜欢

转载自blog.csdn.net/Ee2222/article/details/81206299