zoukankan      html  css  js  c++  java
  • 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={
            constructoer: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);
    
  • 相关阅读:
    jni基础
    Rank Scores
    LeetCode:Longest Substring Without Repeating Characters
    LeetCode: Two Sum
    vim配置
    设计模式眨一眨
    分布式时序数据库InfluxDB
    地图坐标转换
    根据两点间的经纬度计算距离
    解密经纬度数据(火星坐标)
  • 原文地址:https://www.cnblogs.com/huihuihero/p/11262242.html
Copyright © 2011-2022 走看看