js原型,构造函数,实例对象,原型对象

解析:

  • 构造函数可以实例化对象
  • 构造函数采用大写首字母命名,如function Person(name){}
  • 构造函数中有一个属性叫prototype,是构造函数的原型对象
  • 构造函数的原型对象(prototype)中有一个constructor构造器,这个构造器指向的就是自己所在的原型对象所在的构造函数
  • 实例对象的原型对象(__proto__)指向的是该构造函数的原型对象
  • 构造函数的原型对象(prototype)中的方法是可以被实例对象直接访问的
  • 函数一定是对象,对象不一定是函数。包含prototype则是函数,包含__proto__或prototype则是对象
<script>
    //构造函数
    function Person(sex,age) {
      this.sex=sex;
      this.age=age;
    }

    //通过原型添加方法
    Person.prototype.thing="哈哈"
    Person.prototype.sayHi=function () {    //prototype 原型    sayHi 通过原型添加的方法    
      console.log("打招呼,您好");
    };

    /*  简单一点的写法
       Person.prototype={
        constructor:Person,   //但这种写法不会生成构造器,要自己手动添加
        thing:"哈哈",
        sayHi:function(){
            console.log("打招呼,您好");
        }
       } 
    */
    
    //实例化对象(这里的实例化即new一个Person),并初始化(这里的初始化即赋值:男,20)
    var per=new Person("男",20);
    console.log(per.__proto__.constructor==Person.prototype.constructor);//实例对象的__proto__和构造函数的prototype相等,打印的是true
    console.dir(Person);//打印一个对象的所有属性和方法

    var per2=new Person("女",30);
    console.log(per.sayHi==per2.sayHi);

    //调用方法
    per.sayHi();    
    /* 
    实例对象中有两个属性(这两个属性是通过构造函数来获取的),__proto__这个属性
    构造函数中并没有sex和age的两个属性
    
    实例对象中有个属性,__proto__,也是对象,叫原型,不是标准的属性,浏览器使用的,IE8不支持
    构造函数中有一个属性,prototype,也是对象,叫原型,是标准属性,程序员使用
    原型---->__proto__或者是prototype,都是原型对象,
  
    原型的作用:共享数据,节省内存空间 
    */
  </script>

举例子

  • 我希望在系统定义的字符串方法之外再添加一个自己的方法(比如字符串倒序打印),即自定义源码
String.prototype.myStrReverse=function(){
    for(var i=this.length-1;i>=0;i--){   //注意这里用的是this,this是指代String.prototype.也就是说谁调用此函数,this就是谁
        console.log(this[i]);
    }
};

var str1="abcde";

str1.myStrReverse();

  • 为Array内置对象的原型对象中添加方法,冒泡排序,从小到大
Array.prototype.mySort=function () {
      for(var i=0;i<this.length-1;i++){
          for(var j=0;j<this.length-1-i;j++){
              if(this[j]>this[j+1]){
                  var temp=this[j];
                this[j]=this[j+1];
                this[j+1]=temp;
              }
          }
      }
    };

var arr=[100,3,56,78,23,10];
arr.mySort();
console.log(arr);

如何把局部变量变成全局变量

  • 把局部变量暴露给顶级对象window,外部就可以直接使用了
//自调用函数,即一次性的函数--声明的同时,直接调用了
   (function () {
     console.log("函数");
   })();

    //页面加载后.这个自调用函数的代码就执行完了
   (function (形参) {
     var num=10;//局部变量
   })(实参);
   console.log(num);

   (function (win) {
     var num=10;//局部变量
     //js是一门动态类型的语言,对象没有属性,点语法后就有了
     win.num=num;   //这行代码,将num暴露给window,使得外部可以使用
   })(window);
   console.log(num);
posted @ 2019-07-29 09:54  huihuihero  阅读(808)  评论(0编辑  收藏  举报