您的位置:首页 > Web前端 > JavaScript

js实例属性和原型属性示例详解

2014-11-23 14:57 686 查看
详情请仔细研读注释,这里就废话少说,直接上代码了。

  复制代码 代码如下:

  <!DOCTYPE html>

  <html>

  <head>

  <meta charset="UTF-8">

  <title>测试文档</title>

  <script type="text/javascript">

  // 实质上属性和方法是一样的,方法是属性为引用型的函数。

  //一个对象有4种属性:

  // 1,构造函数通过this关键字定义的属性

  // 2,构造函数通过var关键字定义的属性

  // 3,构造函数的原型对象添加的属性

  // 4,对象动态添加的属性

  //实例的公有属性:1 通过this关键字定义的属性 可访问 1,2,3,4

  //实例的私有属性:2 通过var关键字定义的属性。 可访问 2

  //实例的共享属性:3 通过实例指向的原型添加的属性。 可访问 1,3,4

  //实例的静态属性:4 对象动态添加的属性。 可访问 1,3,4

  //总结:

  // 实例属性:1,公有

  // 2,私有

  // 4,静态

  // 原型属性:3,共享

  //this定义的为特权属性。全部可访问

  //var定义的为私有属性。

  //动态添加的属性为公有属性。不可访问私有属性

  //实例对象指向的原型属性为原型属性。不可访问私有属性,优先级低于公有属性

  //实例属性主要有公有属性和特权属性构成。均可被外部和原型属性访问。主要区别在于是否可访问私有属性

  //原型属性优先级低于实例属性。可被外部访问和实例属性访问(除私有属性)

  //-----------------此处为分割线-----------------------------

  // 公有属性:对象暴露给外部环境的属性。也是对象的属性。

  // 私有属性:对象内部的属性,往往不可访问.在构造函数层面上考虑才有意义。

  // 静态属性:动态添加的属性。也是对象的属性。

  // 共有属性:所有构造函数生成的实例所共享的属性。

  function User(){

  // 公有属性:每new一个User实例对象,都有的属性。

  // 为实例属性,所有实例的属性不共享内存。

  // 外部可访问。

  this.name='byronvis';

4000
  // 特权方法:每new一个User实例对象,都有的方法。

  // 为实例方法,所有实例的方法不共享内存。

  // 外部可访问。

  // 可访问公有属性。

  // 可访问私有属性。

  this.sayName=function(){

  alert(this.name);

  alert(this.school);

  alert(age);//变量声明会自动提前。

  alert(this.sex);

  };

  // 私有属性:外部不可访问。

  // 仅对构造函数有意义,对于new的User实例对象无意义。

  var age=22;

  // 私有方法:外部不可访问。

  // 仅对构造函数有意义,对于new的User实例对象无意义。

  function sayAge(){

  alert(age);

  }

  sayAge();

  }

  // 共有属性: 共享内存。

  User.prototype.school='zky';

  // 共有方法:可访问公有属性。

  // 共享内存。

  User.prototype.saySchool=function(){

  alert(this.school);

  alert(this.name);

  alert(this.sex);

  alert(age);

  };

  var obj=new User();

  // 静态属性:就是动态添加的实例属性。

  obj.sex='man';

  // 静态方法:就是动态添加的实例方法。

  obj.saySex=function(){

  alert(this.sex);

  alert(this.name);

  alert(this.school);

  alert(age);

  };

  //-----------------此处为分割线-----------------------------

  //// 证明this关键字定义的属性和动态添加的属性本质上一样的,都可认为是实例对象的公有属性。

  // 验证: this关键字定义的属性访问动态添加的属性

  // obj.sayName();//true

  // 验证:动态添加的属性访问this关键字定义的属性

  // obj.saySex();//true

  // 验证:公有属性访问私有属性

  // obj.sayName();//true

  obj.saySex();//false

  // 验证:共享属性访问私有属性

  // obj.saySchool();//false

  </script>

  </head>

  <body>

  测试文档

  </body>

  </html>

  小伙伴们是否看明白了,了解了实例属性和原型属性了吗?本文讲述的非常的详细,推荐给大家,希望对小伙伴们能有所帮助
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: