javascript构造函数以及原型对象的理解


Posted in Javascript onJanuary 13, 2017

以下是一个构造函数的例子

如果是实例方法,不同的实例化,它们引用的地址是不一样的,是唯一的。

//定义一个构造函数
 function People(name,age){
  this.name=name;
  this.age=age;
  this.dothings=function(){
   retrun this.name+this.age;
   }
 }
 var people1 = new People("panda1",25);
 var people2 = new People("panda2",26);
 alert(people1.name==people2.name) //false

 另外一种编写原型对象的方法,通过字面量的方式创建原型对象,这里{}就是对象,是Object,new Object相对于{}

People.prototype={
 constructor:People //强制指向People
  name:"panda",
  age:25,
  dothings:function(){
   return this.name+this.age;
  }
}
var people = new People();
alert(people.constructor); //function People(){}

使用字面量的方式创新对象,使用constructor属性不会指向实例,而会指向Object。

创建的每一个函数都有一个prototype(原型)属性,也就是一个对象,原型的用途:包含由特定类型的所有实例共享的属性和方法。换句话说就是prototype通过调用构造函数而创建的那个对象的原型对象。

原型对象的好处:让所有对象实例共享它的所包含的属性与方法,不必在构造函数中定义对象信息,而是可以直接将这些添加到原型中。

//声明一个构造函数
 function People(){}
 //在原型添加属性
 People.prototype.name="panda";
 People.prototype.age=25;
 people.prototype.dothings=function(){
  return this.name+this.age;
 }  
 //实例化构造函数
 var people1 = new People();
 var people2 = new People();
 alert(people1.name==perople2.name) //true 因为都是原型里的方法,它们的地址是共享的,大家都来自同一地方。

使用对象实例无法访问到prototype,prototype属性是一个对象,需要访问prototype对象,通过people.__proto__来访问或者使用构造函数名(对象名)People.prototype,但是这个属性在IE浏览器不支持(undefind),__proto__是指向原型对象的一个指针,

另外还有一个constructor属性,这是一个构造属性,获取构造函数本身,作用是:被原型指针定位,得到构造函数本身,也就是对象实例对应原型对象的作用。

判读一个对象是否指向该构造函数的原型对象,可以使用isPrototypeOf方法来测试

People.prototype.isPrototypeOf(people1)  //true

如果实例与原型里同时存在相同的属性,比如例子中的People下的name属性,

var people = new People();
people.name="bear";
alert(people.name); //bear
alert(people1.name); //panda

实例属性并没有重新原型属性,实例的对象采用就近原则。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
jquery validator 插件增加日期比较方法
Feb 21 Javascript
jquery的ajax请求全面了解
Mar 20 Javascript
js播放wav文件(源码)
Apr 22 Javascript
js 获取元素下面所有li的两种方法
Apr 14 Javascript
javascript正则表达式参数/g与/i及/gi的使用指南
Aug 27 Javascript
10条建议帮助你创建更好的jQuery插件
May 18 Javascript
浅谈js对象的创建和对6种继承模式的理解和遐想
Oct 16 Javascript
js HTML5多媒体影音播放
Oct 17 Javascript
用Vue.extend构建消息提示组件的方法实例
Aug 08 Javascript
Vue 仿QQ左滑删除组件功能
Mar 12 Javascript
vue弹窗组件的实现示例代码
Sep 10 Javascript
快速解决Vue、element-ui的resetFields()方法重置表单无效的问题
Aug 12 Javascript
微信小程序(六):列表上拉加载下拉刷新示例
Jan 13 #Javascript
javascript设计模式之Adapter模式【适配器模式】实现方法示例
Jan 13 #Javascript
微信小程序(三):网络请求
Jan 13 #Javascript
Javascript自定义事件详解
Jan 13 #Javascript
JavaScript简单生成 N~M 之间随机数的方法
Jan 13 #Javascript
微信小程序 增、删、改、查操作实例详解
Jan 13 #Javascript
jQuery动态生成表格及右键菜单功能示例
Jan 13 #Javascript
You might like
文件系统基本操作类
2006/11/23 PHP
php 生成WML页面方法详解
2009/08/09 PHP
PHP中如何调用webservice的实例参考
2013/04/25 PHP
curl不使用文件存取cookie php使用curl获取cookie示例
2014/01/26 PHP
PHP中字符与字节的区别及字符串与字节转换示例
2016/10/15 PHP
PHP7导出Excel报ERR_EMPTY_RESPONSE解决方法
2019/04/16 PHP
JS判断是否为数字,是否为整数,是否为浮点数的代码
2010/04/24 Javascript
IE6、IE7中获取Button元素的值的bug说明
2011/08/28 Javascript
JavaScript高级程序设计 阅读笔记(七) ECMAScript中的语句
2012/02/27 Javascript
用JavaScript实现类似于ListBox功能示例代码
2014/03/09 Javascript
jquery引用方法时传递参数原理分析
2014/10/13 Javascript
node.js中 stream使用教程
2016/08/28 Javascript
使用bootstrap-paginator.js 分页来进行ajax 异步分页请求示例
2017/03/09 Javascript
vue+element-ui+ajax实现一个表格的实例
2018/03/09 Javascript
微信小程序实现tab左右切换效果
2020/11/15 Javascript
CKEditor4配置与开发详细中文说明文档
2018/10/08 Javascript
vue+element表格导出为Excel文件
2019/09/26 Javascript
taro 实现购物车逻辑的实例代码
2020/06/05 Javascript
Angular+Ionic使用queryParams实现跳转页传值的方法
2020/09/05 Javascript
JavaScript实现表单验证功能
2020/12/09 Javascript
[01:19:35]DOTA2上海特级锦标赛主赛事日 - 3 败者组第三轮#2Fnatic VS OG第二局
2016/03/05 DOTA
[01:43]深扒TI7聊天轮盘语音出处4
2017/05/11 DOTA
python内存管理分析
2015/04/08 Python
Python的Django中将文件上传至七牛云存储的代码分享
2016/06/03 Python
python保存数据到本地文件的方法
2018/06/23 Python
Python3利用print输出带颜色的彩色字体示例代码
2019/04/08 Python
使用Puppeteer爬取微信文章的实现
2020/02/11 Python
PyQt5 如何让界面和逻辑分离的方法
2020/03/24 Python
python 带时区的日期格式化操作
2020/10/23 Python
Python高并发和多线程有什么关系
2020/11/14 Python
美国高级音响品牌:Master&Dynamic
2018/07/05 全球购物
乐高官方旗舰店:LEGO积木玩具
2019/04/06 全球购物
考试没考好检讨书
2014/01/31 职场文书
教师节领导致辞
2015/07/29 职场文书
简历中的自我评价应该这样写!
2019/07/12 职场文书
JavaScript中的宏任务和微任务详情
2021/11/27 Javascript