JS原型与原型链的深入理解
要了解原型和原型链，首先要理解普通对象和函数对象。
一、普通对象和函数对象的区别
在Javascript的世界里，全都是对象，而对象之间也是存在区别，我们首先区分一下普通对象和函数对象，如下代码：
function f1(){};
var f2 = function(){};
var f3 = new function(){};
var o1 = {};
var o2 = new Object();
var o3 = new f1();
console.log(typeof Object); //function
console.log(typeof Function);//function
console.log(typeof f1) //function
console.log(typeof f2) // function
console.log(typeof f3) //function
console.log(typeof o1) //object
console.log(typeof o2) //object
console.log(typeof o3)// object
在上面的代码中可以看出，f1、f2和f3都是函数对象，而o1，o2和o3都是object对象，也就是普通对象，函数对象本质就是由new function（）构造而来，其他的都是普通对象；函数对象和普通对象理解之后，后文会说明两者的区别。
二、原型
在JavaScript中，原型也是一个对象，原型的作用，则是实现对象的继承。
在js的所有函数对象中，都存在一个属性prototype，该属性对应当前对象的原型。
而所有的JavaScript对象，都存在一个_proto_属性（由于_proto_是个非标准属性，因此只有ff和chrome两个浏览器支持，标准方法是Object.getPrototypeOf()），_proto_属性指向实例对象的构造函数的原型，理解起来就如下：
var p = new Person(); console.log(p._proto === Person.prototype)//true
从上面代码可以看出，p是实例对象，Person是p的构造函数，可以看出来p的_proto_属性指向构造函数Person的原型。
下面用代码来解释一下js是如何通过原型进行继承的：
var parent = function(name){
this.name = name;
}
parent.prototype.getName = function(){
return this.name;
}
var son = new parent("huahua");
console.log(son.getName());//'huahua'
显然，son继承了parent的原型中的函数属性getName。
三、原型链
除开Object的prototype的原型是null以外，所有的对象和原型都有自己的原型，对象的原型指向原型对象。
在层级多的关系中，多个原型层层相连则构成了原型链。
在查找一个对象的属性时，倘若在当前对象找不到该属性，则会沿着原型链一直往上查找，知道找到为止，如果到了原型链顶端，还没找到，则返回undefined。
四、constructor
constructor是构造函数创建的实例的属性，该属性的作用是指向创建当前对象的构造函数。
例如，son.constructor == parent;//true
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
本文给大家介绍如何判断用户是否是用微信浏览器的实例代码，根据关键字 MicroMessenger 来判断是否是微信内置的浏览器，感兴趣的朋友可以参考下实现代码2016-06-06
这篇文章主要介绍了如何在JavaScript中等分数组的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-12-12
这篇文章主要介绍了JS实现点击上移下移LI行数据的方法,涉及javascript针对LI列表动态排序的相关实现技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-08-08
javascript 动态改变onclick事件触发函数代码
javascript 动态改变onclick事件触发函数代码，需要的朋友可以参考下。2011-08-08
这篇文章主要为大家详细介绍了完美的js图片轮换效果，包括左右移动和缓动效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-02-02
这篇文章主要给大家介绍了关于ECharts地图绘制和钻取简易接口的相关资料，文中通过示例代码介绍的非常详细，对大家学习或者使用ECharts具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧2019-07-07
本文小编给大家分享一道js面试题--指针、帽子和女朋友的题目，非常有意思，感兴趣的朋友参考下吧2016-11-11
本文主要介绍了JavaScript中的AJAX的相关知识，具有很好的参考价值，下面跟着小编一起来看下吧2017-03-03
这篇文章主要给大家介绍了关于微信小程序textarea层级过高问题的解决方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧2019-03-03
如何写JavaScript才能逼格更高呢？怎样才能、让别人一眼看出你不简单呢？是否很期待别人在看完你的代码之后感叹一句原来还可以这样写呢？下面列出一些在JavaScript时的装逼技巧，也可说是非常实用的写法2020-05-05
最新评论