zoukankan      html  css  js  c++  java
  • JavaScript类属性的定义方法和区别

    一下分别解释 构造变量、构造属性、原形属性和静态属性。

    1 function car(param1,param2){
    2 var varProperty="this is a var Property";
    3 this.constructProperty="this is a construct Property";
    4 }
    6 car.prototype.prototypeProperty="this is a prototype property";
    8 car.staticProperty="this is a static property";

    构造变量 使用VAR声明和定义,它的作用域仅限于构造方法内部,包括在构造器内部定义的所有方法(构造方法)。直接通过变量名访问:varProperty。有些文章也把叫做私有属性,从作用域上看,它是私有的,但它不是属性,类的原型是无法访问它的。

    构造属性 构造属性在类的构造器中通过this.定义,它是公开的(public),可以通过类的实例(this.)直接访问和修改它

    1 function car(param1,param2){
    2 var varProperty="this is a var Property";
    3 this.constructProperty="this is a construct Property";
    4 }
    5 car.prototype.prototypeProperty="this is a prototype property"
    6 car.staticProperty="this is a static property"
    7
    8 aCar=new car();
    9 alert(aCar.constructProperty);//this is a construct Property

    原型属性 在类的原型中定义,它也是公开,具有和构造属性相同的作用域,它不仅可以通过实例访问,也可以随时通过原型来访问((ClassName.propertype.)

    它和构造属性是有区别的:原型属性可以通过原型直接访问,它存储于类的原型中的,各个实例是通过指针共享访问它.

     1 function car(param1,param2){
    2 var varProperty="this is a var Property";
    3 this.constructProperty="this is a construct Property";
    4 }
    5 car.prototype.prototypeProperty="this is a prototype property"
    6 car.staticProperty="this is a static property"
    7
    8 alert(car.prototype.prototypeProperty);//this is a prototype property
    9 aCar=new car();
    10 alert(aCar.prototypeProperty);//this is a prototype property

    静态属性 直接通过ClassName.的方式定义,它具有和常规OOP语言中的静态属性类似的特性,但注意,它只能通过ClassName访问,不能通过实例访问,在类的中也不能通过this访问

     1 function car(param1,param2){
    2 var varProperty="this is a var Property";
    3 this.constructProperty="this is a construct Property";
    4 }
    5 car.prototype.prototypeProperty="this is a prototype property"
    6 car.staticProperty="this is a static property"
    7
    8 alert(car.staticProperty);//this is a static property
    9 aCar=new car();
    10 alert(aCar.staticProperty);//undefined

    构造属性和原型属性的区别

     1 function car(param1,param2){
    2 var varProperty="this is a var Property";
    3 this.constructProperty= new Array('alice','jerry');
    4 }
    5 car.prototype.prototypeProperty= new Array('alice','jerry');
    6
    7 aCar=new car();
    8 bCar=new car();
    9 cCar=new car();
    10
    11 aCar.constructProperty.push('tanya');
    12
    13 alert(aCar.constructProperty);//alice,jerry,tanya
    14 alert(bCar.constructProperty);//alice,jerry
    15 alert(cCar.constructProperty);//alice,jerry
    16
    17 bCar.prototypeProperty.push('ansel');
    18 alert(aCar.prototypeProperty);//alice,jerry,ansel
    19 alert(bCar.prototypeProperty);//alice,jerry,ansel
    20 alert(cCar.prototypeProperty);//alice,jerry,ansel

    之所以使用数组是因为,使用字符串会修改实例的指针(aCar.prototypeProperty ),使其指向新的存储副本 'New string' 这一过程往往会掩盖了原型属性的共享特性

     1 function car(param1,param2){
    2 var varProperty="this is a var Property";
    3 this.constructProperty="this is a construct property";
    4 }
    5 car.prototype.prototypeProperty= "this is a prototype property";
    6
    7 aCar=new car();
    8 bCar=new car();
    9 cCar=new car();
    10
    11 aCar.constructProperty = "fuck ansel";
    12
    13 alert(aCar.constructProperty);//fuck ansel
    14 alert(bCar.constructProperty);//this is a construct property
    15 alert(cCar.constructProperty);//this is a construct
    16
    17 bCar.prototypeProperty = 'kick ansel';
    18 alert(aCar.prototypeProperty);//this is a prototype property
    19 alert(bCar.prototypeProperty);//kick ansel
    20 alert(cCar.prototypeProperty);//this is a prototype property

    另外有一段补充代码:

     1 function car(param1,param2){
    2 var varProperty="this is a var Property";
    3 this.constructProperty="this is a construct property";
    4 }
    5 car.prototype.prototypeProperty= "this is a prototype property";
    6
    7 aCar=new car();
    8 bCar=new car();
    9 cCar=new car();
    10
    11 bCar.prototypeProperty = 'kick ansel';
    12 alert(aCar.prototypeProperty);//this is a prototype property
    13 alert(bCar.prototypeProperty);//kick ansel
    14 alert(cCar.prototypeProperty);//this is a prototype property
    15
    16 car.prototype.prototypeProperty ="Another New String"
    17 alert(aCar.prototypeProperty);//Another New String
    18 alert(bCar.prototypeProperty);//kick ansel
    19 alert(cCar.prototypeProperty);//Another New String

    这一修改仅仅影响到了aCar和cCar。原因其实就是因为上面 bCar.prototypeProperty = 'kick ansel' 的,它改变了 aCar.prototypeProperty 的指向,而不再指向 原型,因而他也就脱离了原型的控制。

    由于原型属性的共享特性和可能发生的实例指针脱离原型的现象,我们应该仅仅对需要共享的属性使用原型定义,一般的属性应该尽量使用构造来定义;在修改原型属性时应该尽可能通过原型(car.prototype.)来访问修改,而不要通过实例(aCar.)来修改;。以此来避免可能发生的属性混乱问题。






  • 相关阅读:
    oracle数据库使用sys_guid()返回乱码问题
    weblogic 环境改变后,重启应用后方法,报错java.lang.NoSuchMethodError: oracle.i18n.text.converter.CharacterConverterOGS.getInstance
    ORACLE数据库误删表后,没重新建表场景下数据恢复
    Linux环境下weblogic12开启远程debug端口
    关于HOSTS设置不生效的解决小方法
    dubbo调用 Caused by: com.alibaba.dubbo.remoting.RemotingException 异常解决方法
    textkit 研究,mark一下,一个不错的开源库:MLLabel(但是没有文档)
    swift流行UI库(github)
    Android高级第十一讲之不同系统间的区别
    欢快的使用Unity JSON吧
  • 原文地址:https://www.cnblogs.com/yingzi/p/2380641.html
Copyright © 2011-2022 走看看