频道栏目
首页 > 资讯 > JavaScript > 正文

javascript中的原型(链)和继承

17-08-09        来源:[db:作者]  
收藏   我要投稿

写一个原型链继承的例子

封装一个DOM查询
function Elem(id){
    this.elem=document.getElementById(id)
}
Elem.prototype.html=function(val){
    var elem=this.elem
    if(val){
        elem.innerHTML=val
        return this
    } else {
        return elem.innerHTML
    }
}
Elem.prototype.on=function(type,fn){
    var elem=this.elem
    elem.addEventListener(type, fn)
        return this
}
var div1=new Elem('detail-page')
    div1.html('

hello imooc

').on('click',function(){ alert('clicked') }).html('

javascript

')

猫狗继承的例子

function Animal(){
    this.eat=function(){
        console.log('animal eat')
    }
}
function Dog(){
    this.bark=function(){
        console.log('dog bark')
    }
}
Dog.prototype=new Animal()
var hashiqi=new Dog()

原型
所有的引用类型(数组、对象、函数),都具有对象特性,即可自由扩展属性。
所有的引用类型(数组、对象、函数),都有一个proto属性(隐式原型属性),属性值是一个普通的对象。
所有的函数,都有一个prototype属性(显式原型属性),属性值也是一个普通的对象。
所有的引用类型(数组、对象、函数),proto属性值指向它的构造函数的prototype属性值。
当试图得到一个对象的某个属性时,如果这个对象本身没有这个属性,那么会去从它的proto(即它的构造函数的prototype)中寻找。

var obj={};obj.a=100;
var arr=[];arr.a=100;
function fn() {}
fn.a=100;
obj._proto_;
arr._proto_;
fn._proto_;
fn.prototype
obj._proto_===Object.prototype

循环对象自身的属性方法

var item
for(item in f){
    // 高级浏览器已经在for in 中屏蔽了来自原型的属性
    // 但是加上这个判断能够保证程序健壮性
    if(f.hasOwnProperty(item)){
        console.log(item)
    }
}

这里写图片描述

相关TAG标签
上一篇:eclipse远程调试BUG
下一篇:css3(5)
相关文章
图文推荐

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训 | 举报中心

版权所有: 红黑联盟--致力于做实用的IT技术学习网站