静态变量、函数

当定义一个函数后通过 “.”为其添加的属性和函数,通过对象本身仍然可以访问得到,但是其实例却访问不到,这样的变量和函数分别被称为静态变量和静态函数,用过Java、C#的同学很好理解静态的含义。

 function Obj(){
            }             Obj.a=0; //静态变量             Obj.fn=function(){ //静态函数             }
            console.log(Obj.a); //
            console.log(typeof Obj.fn); //function             var o=new Obj();
            console.log(o.a); //undefined
            console.log(typeof o.fn); //undefined

实例变量、函数

在面向对象编程中除了一些库函数我们还是希望在对象定义的时候同时定义一些属性和方法,实例化后可以访问,JavaScript也能做到这样。

 function Obj(){
                this.a=[]; //实例变量
                this.fn=function(){ //实例方法                 }
            }             console.log(typeof Obj.a); //undefined
            console.log(typeof Obj.fn); //undefined             var o=new Obj();
            console.log(typeof o.a); //object
            console.log(typeof o.fn); //function

这样可以达到上述目的,然而

 function Obj(){
                this.a=[]; //实例变量
                this.fn=function(){ //实例方法                 }
            }             var o1=new Obj();
            o1.a.push(1);
            o1.fn={};
            console.log(o1.a); //[1]
            console.log(typeof o1.fn); //object
            var o2=new Obj();
            console.log(o2.a); //[]
            console.log(typeof o2.fn); //function

上面的代码运行结果完全符合预期,但同时也说明一个问题,在o1中修改了a和fn,而在o2中没有改变,由于数组和函数都是对象,是引用类型,这就说明o1中的属性和方法与o2中的属性与方法虽然同名但却不是一个引用,而是对Obj对象定义的属性和方法的一个复制。

这个对属性来说没有什么问题,但是对于方法来说问题就很大了,因为方法都是在做完全一样的功能,但是却又两份复制,如果一个函数对象有上千和实例方法,那么它的每个实例都要保持一份上千个方法的复制,这显然是不科学的,这可肿么办呢,prototype应运而生。

prototype

无论什么时候,只要创建了一个新函数,就会根据一组特定的规则为该函数创建一个prototype属性,默认情况下prototype属性会默认获得一个constructor(构造函数)属性,这个属性是一个指向prototype属性所在函数的指针,有些绕了啊,写代码、上图!

 function Person(){

             }

根据上图可以看出Person对象会自动获得prototyp属性,而prototype也是一个对象,会自动获得一个constructor属性,该属性正是指向Person对象。

当调用构造函数创建一个实例的时候,实例内部将包含一个内部指针(很多浏览器这个指针名字为__proto__)指向构造函数的prototype,这个连接存在于实例和构造函数的prototype之间,而不是实例与构造函数之间。

 function Person(name){
                this.name=name;
            }             Person.prototype.printName=function(){
                alert(this.name);
            }             var person1=new Person('Byron');
            var person2=new Person('Frank');

Person的实例person1中包含了name属性,同时自动生成一个__proto__属性,该属性指向Person的prototype,可以访问到prototype内定义的printName方法,大概就是这个样子的

写段程序测试一下看看prototype内属性、方法是能够共享

 function Person(name){
                this.name=name;
            }             Person.prototype.share=[];             Person.prototype.printName=function(){
                alert(this.name);
            }             var person1=new Person('Byron');
            var person2=new Person('Frank');             person1.share.push(1);
            person2.share.push(2);
            console.log(person2.share); //[1,2]

果不其然!实际上当代码读取某个对象的某个属性的时候,都会执行一遍搜索,目标是具有给定名字的属性,搜索首先从对象实例开始,如果在实例中找到该属性则返回,如果没有则查找prototype,如果还是没有找到则继续递归prototype的prototype对象,直到找到为止,如果递归到object仍然没有则返回错误。同样道理如果在实例中定义如prototype同名的属性或函数,则会覆盖prototype的属性或函数。

 function Person(name){
                this.name=name;
            }             Person.prototype.share=[];
            var person=new Person('Byron');
            person.share=0;             console.log(person.share); //0而不是prototype中的[]

构造简单对象

当然prototype不是专门为解决上面问题而定义的,但是却解决了上面问题。了解了这些知识就可以构建一个科学些的、复用率高的对象,如果希望实例对象的属性或函数则定义到prototype中,如果希望每个实例单独拥有的属性或方法则定义到this中,可以通过构造函数传递实例化参数。

 function Person(name){
                this.name=name;
            }             Person.prototype.share=[];             Person.prototype.printName=function(){
                alert(this.name);
            }

JS静态变量和函数、实例变量和函数以及prototype 说明的更多相关文章

  1. Java——静态变量/方法与实例变量/方法的区别

    静态只能调用静态 非静态: 对象名.方法名 package ti; //通过两个类 StaticDemo.LX4_1 说明静态变量/方法与实例变量/方法的区别. class StaticDemo { ...

  2. JAVA中 成员变量和和实例变量区别

    java语言支持的变量类型 类变量:独立于方法之外的变量,用 static 修饰. 局部变量:类的方法中的变量. 实例变量(全局变量):独立于方法之外的变量,不过没有 static 修饰. publi ...

  3. java 中静态变量(类变量)与实例变量 静态方法与实例方法

    静态变量: 在类内部中,方法的外部声明的对象而且加上static; 实例变量: 在类内部中,声明不需要加static; 比如: public class Demo{ int i1=0; static ...

  4. Java初始化顺序(静态变量、静态初始化块、实例变量、实例初始化块、构造方法)

    1.执行顺序 1.1.一个类中的初始化顺序 类内容(静态变量.静态初始化块) => 实例内容(变量.初始化块.构造器) 1.2.两个具有继承关系类的初始化顺序 父类的(静态变量.静态初始化块)= ...

  5. Java变量类型,实例变量 与局部变量 静态变量

    实例变量: 实例变量在类中声明,但在方法的外面,构造函数或任何块. 当空间分配给某个对象在堆中,插槽为每个实例变量创建值. 当一个对象与使用关键字 “new” 来创建,在对象被销毁销毁创建的实例变量. ...

  6. java入门---变量类型&类变量&局部变量&实例变量&静态变量

        在Java语言中,所有的变量在使用前必须声明.声明变量的基本格式如下:     type identifier [ = value][, identifier [= value] ...] ; ...

  7. 牛客网Java刷题知识点之全局变量(又称成员变量,分为类变量和实例变量)、局部变量、静态变量(又称为类变量)

    不多说,直接上干货! 定义类其实就是在定义类中的成员.成员:成员变量<-->属性,成员函数<-->行为. 局部变量在方法内部声明,并且只能在方法内部使用,在外层的方法被调用时被 ...

  8. Java 局部变量、实例变量、类变量(静态变量)区别

    1. 局部变量: 局部变量是类的方法中的变量: 2. 实例变量: 实例变量也是类中独立于方法之外的变量,不过没有static修饰,也叫 对象变量 3. 类变量(静态变量): 类变量是类中独立于方法之外 ...

  9. Java中静态变量与实例变量

    知识回顾 上一篇总结了java中成员变量和局部变量的区别,这一篇将总结静态变量和实例变量的一些特性和区别. 示例代码 package Variable; public class VariableDe ...

  10. Java中字段、属性、成员变量、局部变量、实例变量、静态变量、类变量、常量

    首先看个例子: package zm.demo; public class Demo { private int Id;//成员变量(字段).实例变量(表示该Id变量既属于成员变量又属于实例变量) p ...

随机推荐

  1. thinkphp本地调用Redis队列任务

    1.安装配置好Redis 2.进入项目根目录文件夹输入cmd进入命令行 3.输入php think 查看php扩展 4.输入 php think queue:listen 启动队列监听

  2. php 过滤器filter_var验证邮箱/url/ip等

    验证邮箱.url或者ip,除了使用正则外,也可以使用内置的函数库过滤器filter来完成这些功能. filter_var (PHP 5 >= 5.2.0, PHP 7)filter_var — ...

  3. 关于Firedac的一点看法

    Firedac集成在Delphi中已经有几个版本了,偶尔也拖到Form上试着用用,虽然知道Firedac有可能是最终的(或很很长时间内)数据访问技术,可一直不能接受它,其中最大的原因就是过于“复杂” ...

  4. Mysql索引分类和索引优化

    一. MySQL: 索引以B树格式保存 Memory存储引擎可以选择Hash或BTree索引,Hash索引只能用于=或<=>的等式比较. 1.普通索引:create index on Ta ...

  5. c# post文件

    public class HttpUpload { private ArrayList bytesArray; private Encoding encoding = Encoding.UTF8; p ...

  6. 看图写代码---看图写代码 阅读<<Audio/Video Connectivity Solutions for Virtex-II Pro and Virtex-4 FPGAs >>

    看图写代码 阅读<<Audio/Video Connectivity Solutions for Virtex-II Pro and Virtex-4 FPGAs >> 1.S ...

  7. java小程序(课堂作业03)

    使用类的静态字段和构造函数,我们可以跟踪某个类所创建对象的个数.请写一个类,在任何时候都可以向它查询“你已经创建了多少个对象?”. 思路:因为静态初始化块只运行一次,是一个很好的记录次数的方法,定义一 ...

  8. C#性能优化总结

    1. C#语言方面 1.1 垃圾回收 垃圾回收解放了手工管理对象的工作,提高了程序的健壮性,但副作用就是程序代码可能对于对象创建变得随意. 1.1.1 避免不必要的对象创建 由于垃圾回收的代价较高,所 ...

  9. python re 实例

    #!/usr/bin/env python#_*_coding:utf-8_*_ import reimport timeimport jsonimport MySQLdbimport context ...

  10. <亲测>CentOS7yum安装PHP7.2

    如果之前已经安装我们先卸载一下 yum -y remove php* 由于linux的yum源不存在php7.x,所以我们要更改yum源 rpm -Uvh https://dl.fedoraproje ...