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


Posted in Javascript onNovember 23, 2014

详情请仔细研读注释,这里就废话少说,直接上代码了。

<!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'; 

//           特权方法:每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>

小伙伴们是否看明白了,了解了实例属性和原型属性了吗?本文讲述的非常的详细,推荐给大家,希望对小伙伴们能有所帮助

Javascript 相关文章推荐
javascript的事件描述
Sep 08 Javascript
Jquery Ajax学习实例6 向WebService发出请求,返回DataSet(XML) 异步调用
Mar 18 Javascript
Javascript计算时间差的函数分享
Jul 04 Javascript
window.requestAnimationFrame是什么意思,怎么用
Jan 13 Javascript
AngularJS中的$watch(),$digest()和$apply()区分
Apr 04 Javascript
vue2.0结合DataTable插件实现表格动态刷新的方法详解
Mar 17 Javascript
seajs实现强制刷新本地缓存的方法分析
Oct 16 Javascript
vue2.0设置proxyTable使用axios进行跨域请求的方法
Oct 19 Javascript
vue 根据数组中某一项的值进行排序的方法
Aug 30 Javascript
详解如何使用node.js的开发框架express创建一个web应用
Dec 20 Javascript
vue自定义js图片碎片轮播图切换效果的实现代码
Apr 28 Javascript
JS去除字符串最后的逗号实例分析【四种方法】
Jun 20 Javascript
JS常用函数使用指南
Nov 23 #Javascript
浅谈JSON和JSONP区别及jQuery的ajax jsonp的使用
Nov 23 #Javascript
理解jQuery stop()方法
Nov 21 #Javascript
JS中三目运算符和if else的区别分析与示例
Nov 21 #Javascript
node.js使用npm 安装插件时提示install Error: ENOENT报错的解决方法
Nov 20 #Javascript
JS在可编辑的div中的光标位置插入内容的方法
Nov 20 #Javascript
js实现div弹出层的方法
Nov 20 #Javascript
You might like
BBS(php &amp; mysql)完整版(二)
2006/10/09 PHP
php多文件上传实现代码
2014/02/20 PHP
php使用ob_start()实现图片存入变量的方法
2014/11/14 PHP
php使用CURL模拟GET与POST向微信接口提交及获取数据的方法
2016/09/23 PHP
详解php语言最牛掰的Laravel框架
2017/11/20 PHP
JavaScript 权威指南(第四版) 读书笔记
2009/08/11 Javascript
从零开始学习jQuery (四) jQuery中操作元素的属性与样式
2011/02/23 Javascript
利用webqq协议使用python登录qq发消息源码参考
2013/04/08 Javascript
用js实现控件的隐藏及style.visibility的使用
2013/06/14 Javascript
javascript调试过程中找不到哪里出错的可能原因
2013/12/16 Javascript
快速解决jquery之get缓存问题的最简单方法介绍
2013/12/19 Javascript
解决vue点击控制单个样式的问题
2018/09/05 Javascript
原生js添加一个或多个类名的方法分析
2019/07/30 Javascript
express中static中间件的具体使用方法
2019/10/17 Javascript
[01:52]DOTA2完美大师赛Vega战队趣味视频——kpii老师小课堂
2017/11/25 DOTA
python thread 并发且顺序运行示例
2009/04/09 Python
Python采用Django制作简易的知乎日报API
2016/08/03 Python
Django实现一对多表模型的跨表查询方法
2018/12/18 Python
python使用wxpy轻松实现微信防撤回的方法
2019/02/21 Python
详细介绍pandas的DataFrame的append方法使用
2019/07/31 Python
pytorch Dataset,DataLoader产生自定义的训练数据案例
2021/03/03 Python
戴尔美国官网:Dell
2016/08/31 全球购物
法国一家芭蕾舞鞋公司:Repetto
2018/11/12 全球购物
美体小铺奥地利官方网站:The Body Shop奥地利
2019/04/11 全球购物
Boolean b = new Boolean(“abcde”); 会编译错误码
2013/11/27 面试题
绩效专员岗位职责
2013/12/02 职场文书
教师档案管理制度
2014/01/23 职场文书
幼儿园消防演练方案
2014/02/13 职场文书
协议书范本
2014/04/23 职场文书
文明之星事迹材料
2014/05/09 职场文书
校园环保建议书
2014/05/14 职场文书
土木工程求职信
2014/05/29 职场文书
派出所正风肃纪剖析材料
2014/10/10 职场文书
房地产销售经理岗位职责
2015/02/02 职场文书
导游词之安徽巢湖
2019/12/26 职场文书
js判断两个数组相等的5种方法
2022/05/06 Javascript