欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JavaScript面向?qū)ο笾械姆庋b和繼承你了解嗎

 更新時(shí)間：2022年02月11日 14:57:05   作者：執(zhí)手天涯@  
這篇文章主要為大家詳細(xì)介紹了JavaScript面向?qū)ο笾械姆庋b和繼承，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來(lái)幫助

1、面向?qū)ο?/h2>

【三大顯著特征】： 封裝、繼承、多態(tài)

1、封裝

【解釋】： 封裝的本質(zhì)就是將有關(guān)聯(lián)的代碼組合在一起。

【優(yōu)勢(shì)】：

保證代碼可以復(fù)用提高代碼的維護(hù)效率

【以前的封裝方法】：

函數(shù)封裝

function fn(){}

命名空間封裝

let o={
name:'zhangsan',
age:20
}
let obj={
name:'lisi',
age:18
}

【新的封裝方法】：

構(gòu)造函數(shù)

//自定義構(gòu)造函數(shù)
function Person(name,age,height,weight){
	this.name=name;
	this.age=age;
	this.height=height;
	this.weight=weight;
	//方法
	this.eat=function(){
	console.log('吃飯')
	}
	this.sleep=function(){
	console.log('睡覺(jué)')
	}
}
//實(shí)例化一個(gè)對(duì)象
let obj1=new Person('zhangsan',20,'198cm','60kg')
console.log(obj1)
let obj2=new Person('lisi',24,'168cm','70kg')
console.log(obj2)

【總結(jié)】：

構(gòu)造函數(shù)體現(xiàn)了面向?qū)ο蟮姆庋b特性構(gòu)造函數(shù)實(shí)例創(chuàng)建的對(duì)象彼此獨(dú)立、互不影響命名空間式的封裝無(wú)法保證數(shù)據(jù)的獨(dú)立性

2、原型對(duì)象

【解釋】： 本質(zhì)是構(gòu)造函數(shù)的一個(gè)屬性，prototype 的是對(duì)象類(lèi)據(jù)類(lèi)型，稱為構(gòu)造函數(shù)的原型對(duì)象。

【代碼示例】：

function Person(name,age){
    this.name=name
    this.age=age
    //this.sing=function (){
	//console.log('唱歌')
	//}
}
console.log(Person.prototype);
Person.prototype.sing=function(){
console.log('唱歌')
}
let p1=new Person('zhangsan',20);
console.log(p1)
p1.sing()

【總結(jié)】：

  • 只要是構(gòu)造函數(shù)就有原型對(duì)象
  • 原型對(duì)象中的方法，實(shí)例對(duì)象可以直接調(diào)用
  • 原型對(duì)象和構(gòu)造函數(shù)都有相同的方法的時(shí)候就使用構(gòu)造函數(shù)本身的方法

【constructor屬性】： 代表了該原型對(duì)象對(duì)應(yīng)的構(gòu)造函數(shù)。

【示例】：

function Person(name,age){
	this.name=name
	this.age=age
}
console.log(Person.prototype,constructor)

【圖解】：

請(qǐng)?zhí)砑訄D片描述

【__proto__屬性】： 用于指向原型對(duì)象

【示例】：

function Person(name,age){
	this.name=name
	this,age=age
}
Person.prototype.eat=function(){
	console.log('吃飯')
}
let person1=new Person('張三'，22);
console.log(person.__proto__===Person.prototype)

3、繼承

【封裝問(wèn)題引出】：

// 封裝中國(guó)人的行為特征
  function Chinese() {
    // 中國(guó)人的特征
    this.arms = 2;
    this.legs = 2;
    this.eyes = 2;
    this.skin = 'yellow';
    this.language = '中文';
    // 中國(guó)人的行為
    this.walk = function () {}
    this.sing = function () {}
    this.sleep = function () {}
  }
  // 封裝日本人的行為特征
  function Japanese() {
    // 日本人的特征
    this.arms = 2;
    this.legs = 2;
    this.eyes = 2;
    this.skin = 'yellow';
    this.language = '日文';
    // 日本人的行為
    this.walk = function () {}
    this.sing = function () {}
    this.sleep = function () {}
  }

【總結(jié)】：其實(shí)我們都知道無(wú)論是中國(guó)人、日本人還是其它民族，人們的大部分特征是一致的，然而體現(xiàn)在代碼中時(shí)人的相同的行為特征被重復(fù)編寫(xiě)了多次，代碼顯得十分冗余，我們可以將重復(fù)的代碼抽離出來(lái)

【代碼改寫(xiě)】：

<script>
  // 所有人
  function Person() {
    // 人的特征
    this.arms = 2;
    this.legs = 2;
    this.eyes = 2;
    // 人的行為
    this.walk = function () {}
    this.sing = function () {}
    this.sleep = function () {}
  }
  // 封裝中國(guó)人的行為特征
  function Chinese() {
    // 中國(guó)人的特征
    this.skin = 'yellow';
    this.language = '中文';
  }
  // 封裝日本人的行為特征
  function Japanese() {
    // 日本人的特征
    this.skin = 'yellow';
    this.language = '日文';
  }
  // human 是構(gòu)造函數(shù) Person 的實(shí)例
  let human = new Person();
  // 中國(guó)人
  Chinese.prototype = new Person();
  Chinese.prototype.constructor = Chinese;
  // 日本人
  Japanese.prototype = human;
  Japanese.prototype.constructor = Japanese;

總結(jié)

本篇文章就到這里了，希望能夠給你帶來(lái)幫助，也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!   

相關(guān)文章

最新評(píng)論