聊一聊JS中的prototype
作者:菠萝般若 时间:2024-05-02 16:20:18
什么是prototype:
function定义的对象有一个prototype属性,prototype属性又指向了一个prototype对象,注意prototype属性与prototype对象是两个不同的东西,要注意区别。在prototype对象中又有一个constructor属性,这个constructor属性同样指向一个constructor对象,而这个constructor对象恰恰就是这个function函数本身。
//判断是否是数组
function isArray(obj) {
return Object.prototype.toString.call(obj) === '[object Array]';
};
//判断是否是function
function isFunc(obj) {
return Object.prototype.toString.call(obj) === '[object Function]';
}
// 是否是json对象
function isJson(obj) {
return typeof (obj) == "object" && (isArray(obj) || Object.prototype.toString.call(obj).toLowerCase() == "[object object]");
}
对于这个属性我的理解就是继承原型对象的方法和属性。属性和方法是什么?可能一些新人不是很了解,打个比方,自行车的属性有:外表红色,可变速,可照明等,属性就是对象是什么?方法有骑自行车去上学等,方法就是对象能干什么?
那么下面我就从含义到应用说说对她的理解吧,不足之处还请大牛指点。
prototype是什么含义呢?
javascript中prototype属性:返回对象类型原型的引用。
举个例子,
A.prototype = new B()
A的prototype是B的一个实例,也就是说A讲B中的方法和属性都克隆来了一遍。注意这里是克隆而不是继承,至于克隆和继承的区别,感兴趣的同学可以自己去问下度娘。
下面上个我做的简单实例:
html部分:
<body>
<a class="btn btn1">按钮1</a>
<a class="btn btn2">按钮2</a>
<a class="btn btn3">按钮3</a>
</body>
js部分:
(function(){
var btn1 = $(".btn1");
var btn2 = $(".btn2");
var btn3 = $(".btn3");
function baseClass(){
this.showMsg = function(){
alert('11111');
}
}
function extendClass(){
this.showMsg = function(){
alert('2222');
}
}
//prototype属性可以返回对象类型的原型的引用
//如果构造函数与原型函数有同名方法,那么优先搜索构造函数的方法,不会再次克隆原型函数的同名函数
extendClass.prototype = new baseClass();
var initance = new extendClass();
btn1.click(function(){
initance.showMsg();
});
var baseinitance = new baseClass();
btn2.click(function(){
baseinitance.showMsg.call(initance);
})
})();
理解以上实例,基本你可以初步对js中的prototype属性有个大致的认识。
以上所述是小编给大家介绍的JS中的prototype网站的支持!
来源:http://www.cnblogs.com/edwards/archive/2016/09/29/5919138.html
标签:js,prototype
![](/images/zang.png)
![](/images/jiucuo.png)
猜你喜欢
golang之JWT实现的示例代码
2024-01-30 03:35:30
JavaScript初级教程(第五课续)第1/3页
2024-04-17 10:10:07
Python简单格式化时间的方法【strftime函数】
2023-03-29 11:30:16
Python venv虚拟环境配置过程解析
2021-11-30 20:21:48
![](https://img.aspxhome.com/file/2023/0/114650_0s.png)
PyTorch 中的 torch.utils.data 解析(推荐)
2021-09-14 01:58:16
PHP 截取字符串 分别适合GB2312和UTF8编码情况
2023-09-30 18:02:30
详解Python with/as使用说明
2022-10-29 08:01:26
如何使用python操作vmware
2023-03-13 17:34:41
内容添加asp.net
2024-06-05 09:27:29
部署ASP.NET Core程序到Linux系统
2024-05-02 17:19:54
![](https://img.aspxhome.com/file/2023/8/129798_0s.jpg)
linux 部署apache服务的步骤
2022-11-28 02:59:16
Python中二维列表如何获取子区域元素的组成
2021-02-16 02:41:01
![](https://img.aspxhome.com/file/2023/8/95488_0s.png)
Python 实现淘宝秒杀的示例代码
2021-02-19 14:25:39
利用python批量修改word文件名的方法示例
2023-03-15 00:05:12
![](https://img.aspxhome.com/file/2023/0/127830_0s.png)
一个二级伸缩下拉菜单代码
2008-06-24 18:12:00
Python中数字(Number)数据类型常用操作
2022-06-01 20:58:47
Python 中创建 PostgreSQL 数据库连接池
2024-01-19 22:33:37
详解Python 实现元胞自动机中的生命游戏(Game of life)
2023-05-31 07:11:54
![](https://img.aspxhome.com/file/2023/2/120992_0s.png)
Python学习之shell脚本的使用详解
2023-10-01 17:57:51
Blender Python编程实现程序化建模生成超形示例详解
2023-06-14 14:38:53
![](https://img.aspxhome.com/file/2023/8/128518_0s.png)