js实例属性和原型属性示例详解
详情请仔细研读注释，这里就废话少说，直接上代码了。
<!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>
小伙伴们是否看明白了，了解了实例属性和原型属性了吗？本文讲述的非常的详细，推荐给大家，希望对小伙伴们能有所帮助
相关文章
QQ在线客服在每一个web开发人员的记忆里都是一个经典，既然是经典，也就是必不可少，那就应该很好的呈现出来，本文整理了一些左右悬浮可分组的网站QQ在线客服代码，需要的朋友可以了解下2012-12-12
这篇文章主要介绍了JavaScript 详解预编译原理的相关资料,需要的朋友可以参考下2017-01-01
这篇文章主要给大家介绍了关于SVG的相关资料，文中通过图文以及示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-01-01
这篇文章主要介绍了JavaScript动态检测密码强度原理及实现方法,结合具体实例形式详细分析了javascript针对输入字符串密码强度检测的原理与相关判断操作技巧,需要的朋友可以参考下2019-06-06
这篇文章主要给大家介绍了关于原生JS实现弹幕效果的简单操作指南，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-11-11
这篇文章主要为大家详细介绍了Ajax使用原生态JS验证用户名是否存在的相关资料，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-09-09
下拉缓冲菜单效果想必大家都有见过吧，在本文使用JS轻松实现下，想学习的朋友可以参考下2013-08-08
微信小程序事件对象中e.target和e.currentTarget的区别详解
这篇文章主要介绍了微信小程序事件对象中e.target和e.currentTarget的区别详解，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-05-05
这篇文章主要介绍了Javascript中this关键字的一些小知识,本文讲解了this的隐性绑定、var that = this两部份内容,需要的朋友可以参考下2015-03-03
关于javascript document.createDocumentFragment()
documentFragment 是一個無父對象的document對象.2009-04-04
最新评论