原型与原型链

//构造函数  函数名首字母大写
function Foo(name, age){
    //this = {}
    this.name= name;
    this.age= age;
    this.class='class-1';
    //return this //默认有这一行
}
var f=new Foo('liujian',20);
//var f1=new Foo('lisi',20); //创建多个对象

//扩展
/*
 var a={} => var a = new Object() 语法糖
 var a=[] => var a = new Array() 语法糖
 function Foo(){} => var Foo = new Funtion()
   使用instanceof判断函数是否是一个变量的构造函数
  
*/

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

//instanceof 用于判断引用类型属于哪个构造函数的方法
//arr instanceof Array //true

//new 一个对象过程
/* 创建一个新对象
 * this指向这个新对象
 * 执行代码,即对this赋值
 * 返回this
 * */
//zepto 设计和源码分析


//原型继承  jq zepto基础原理

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,false);
    return this
}

var div1=new Elem('div1');
div1.html('我是内容!');
div1.on('click',function(){
    var val=div1.html()
    alert(val)
})

 

posted @ 2017-08-10 14:06  菜鸟一小只  阅读(182)  评论(0编辑  收藏  举报