封装 && 继承 && 多态

封装

定义

讲一个事物的属性和功能集中在一个对象中

对象的特点

封装 继承 多态

定义

  • 描述显示中一个事物的属性和功能的程序结构,同时和存储事物的多个属性和功能的储存空间
  • 面向对象
    • 程序中都是用对象来描述现实中的一个具体事物

继承

  • 定义
    • 父对象的成员,子对象无需重复创建就可直接使用
  • 优点
    • 代码重用,节约内存
  • 用处
    • 只要多个子对象,拥有相同的属性和空能,都要将相同的属性和功能集中保存在父对象中,所有子对象公用
  • 原型
    • js中继承都是 继承原型对象
      • 定义
        • 专门集中储存一类子对象相同属性值和方法的父对象
      • 用处
        • 只要子对象公用的相同属性都要放在原型对象中
      • 如何用
        • 每创建一个构造函数,都会自动出现一个原型对象的 proto 继承构造函数的prototype
      • 如何向原型中添加公用属性
构造构造函数.prototype.属性名 = 属性值
构造函数.prototype.属性名 = function(){}

鉴别属性是自有还是共有

自有

var bool = obj.hasOwnProperty("属性名")

共有

属性名 in obj

固定套路

function jubge(val,obj){
    if(obj.hasOwnProperty(value)){
        console.log("自有")
    }else if(var in obj != undefined){
        console.log("共有")
    }else{
        console.log("没有")
    }
}

原型链

  • 定义
    • 有多级父元素逐渐继承形成的链式结构
    • 保存着所有对象成员(属性和方法)
    • vs 作用域
      • 保存着所有变量
    • 控制着 对象成员的使用顺序
    • 有限使用自己,自己没有沿原型链向父级查找
    • 原型链的顶端是object.prototype
    • vs 作用域的重点是window
  • 验证原型对象
// 1. Object.getprototypeOf(obj)
Object.getprototpyeOf(obj)==Array
// 2. 获取father的子对象是否是child
var a = father.isprototype(child);
// 3. 验证构造函数是否是数组类型
obj.constructor==Array
// 4. 即使创建时不是使用数组创建的,但是只要原型链上有数组类型也会被认为是数组类型
obj instanceof Array
// 5. isArray()
// 每个子对象中创建使用的类型属性一旦被创建.class属性就无法修改; 几乎所有内置对象都重写了toString,无法获得Object.toString()
//解决 call //任意对象.任意方法 call(obj)
// 6. Object.prototype.toString

多态

  • 统一事物在不同情况下表现出不同的状态
  • 重写 override
    • 如果父原型的方法不好用可以重写子对象的方法
  • 自定义继承
    • 设置两个对象建的继承关系
child.__proto___ = father
/*
	问题
		__proto__也是内部属性。有可能被浏览器禁用
	解决:
		Object.setPrototypeOf(child,father);
		设置child继承father
*/

批量修改多个对象的继承关系

  • 只要修改构造函数的prototype对象即可
  • 用法
构造函数prototype = father

时机

  • 定义完构造函数之后,立刻修改原型对象

两种类型间的继承

  • 何时
    • 如果发现多个类型之间拥有相同的属性解构和方法时就要抽象一个父类型
  • 步骤
    • 定义父类型
      • 父类型的构造简书,集中定义相同的属性结构
      • 父类型的原型对象,集中定义相同的方法
    • 让子类型的原型对象继承父类型原型对象
      • 结果
        • 保证子对象可调用抽象父类型原型中的方法
    • 在子类型构造函数中借用父类型构造函数
      • 结果
        • 请父类型构造函数帮助构建共有的属性结构
  • 问题
    • 直接调用父类型构造函数,其中this默认指向window
    • 解决
      • call // 只要this不要想要的,就可用call随便替换
  • 用法
    • 父类型构造函数 .call(this,参数…)
function Flyer(name,speed){
    this.name = name;
    this.speed = speed
}
Flyer.prototype.fly = function(){
    console.log(`${this.name}以时速${this.speed}飞行`)
}
function Plane(name,speed,score){
    Flyer.call(this,name,speed);
    this.scper = score
}
Plane.prototype.getScore = function(){
    console.log(`击落${this.name}的${this.score}`)
}
Object.setPrototypeOf(Plane.prototype,Flyer.prototype);
var a = new Plane("f16","10000",20);
a.fly();
暂无评论

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇