JavaScript的继承的封装介绍


Posted in Javascript onOctober 15, 2013
/** 
* 当调用此函数时,只有第一次参数传入,第二个不存在的情况下,就创建类 
* 当调用此函数时,传入了两个参数,第一个参数为基类,第二个参数则在基类的基础上添加内容 
*/ 
function extend(obj,prop){ 
function F(){ } 
//如果第一个参数为object类型(即json对象)的话,则将json的key value赋值给F函数的原型 F.prototype.key = value 
if (typeof(obj) == "object") { 
for(var name in obj){ 
F.prototype[name] = obj[name]; 
} 
} else {//如果第一个参数为function类型的话,则将次函数的原型赋值给F函数,prop肯定是传值的(json对象),所以将prop赋值给F函数的原型 
F.prototype = obj.prototype; 
for(var name in prop){ 
F.prototype[name] = prop[name]; 
} 
} 
return F; 
} 
//因为这里只有一个参数,所以此时会将json对象的key,value赋值给extend函数中的F函数的原型,然后用person变量接收F函数,此时person也成为了一个函数,此函数也拥有了F函数的原型 name和sex 
var person = extend({ 
name:"xxc", 
sex:"man" 
}); 
//将person函数传入,进入extend函数后,首先将person的原型赋值给F函数,然后将第二个参数hope:"more money"赋值给F函数,此时F函数的原型有三个东西name,sex,hope 
//最后将F函数返回,导致person的原型也和F函数一样,有name,sex,hope 
var person = extend(person,{ 
hope:"more money" 
}); 
alert(person.prototype.name);//xxc 
alert(person.prototype.sex);//man 
alert(person.prototype.hope);//more money

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<title>function.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
<meta http-equiv="description" content="this is my page"> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<script src="../jquery/jquery-1.10.2.min.js"></script> 
<script src="extends2.js"></script> 
<!--<link rel="stylesheet" type="text/css" href="./styles.css">--> 
</head> 
<body> 
</body> 
</html>
Javascript 相关文章推荐
读jQuery之三(构建选择器)
Jun 11 Javascript
js修改table中Td的值(定义td的单击事件)
Jan 10 Javascript
Javascript Throttle &amp; Debounce应用介绍
Mar 19 Javascript
JavaScript编程中布尔对象的基本使用
Oct 25 Javascript
JavaScript生成.xls文件的代码
Dec 22 Javascript
谈谈JavaScript数组常用方法总结
Jan 24 Javascript
Node.js中.pfx后缀文件的处理方法
Mar 10 Javascript
ES6正则的扩展实例详解
Apr 25 Javascript
浅谈Vue.js中ref ($refs)用法举例总结
Dec 19 Javascript
解决iview打包时UglifyJs报错的问题
Mar 07 Javascript
常用的 JS 排序算法 整理版
Apr 05 Javascript
分享8个JavaScript库可更好地处理本地存储
Oct 12 Javascript
jquery实现兼容浏览器的图片上传本地预览功能
Oct 14 #Javascript
js 距离某一时间点时间是多少实现代码
Oct 14 #Javascript
js算法中的排序、数组去重详细概述
Oct 14 #Javascript
鼠标拖动实现DIV排序示例代码
Oct 14 #Javascript
不同Jquery版本引发的问题解决
Oct 14 #Javascript
Jquery 类网页微信二维码图块滚动效果具体实现
Oct 14 #Javascript
javascript预加载图片、css、js的方法示例介绍
Oct 14 #Javascript
You might like
帅气的琦玉老师
2020/03/02 日漫
PHP 读取和修改大文件的某行内容的代码
2009/10/30 PHP
用PHP实现 上一篇、下一篇的代码
2012/09/29 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(三)
2014/06/23 PHP
php实现复制移动文件的方法
2015/07/29 PHP
PHP中Session和Cookie是如何操作的
2015/10/10 PHP
PHP编程获取各个时间段具体时间的方法
2017/05/26 PHP
PDO::getAttribute讲解
2019/01/28 PHP
javascript生成/解析dom的CDATA类型的字段的代码
2007/04/22 Javascript
jquery插件jbox使用iframe关闭问题
2009/02/09 Javascript
详解JavaScript逻辑Not运算符
2015/12/04 Javascript
js实现上一页下一页的效果【附代码】
2016/03/10 Javascript
JS中如何比较两个Json对象是否相等实例代码
2016/07/13 Javascript
node.js(express)中使用Jcrop进行图片剪切上传功能
2017/04/21 Javascript
微信小程序tabBar底部导航中文注解api详解
2017/08/16 Javascript
扫微信小程序码实现网站登陆实现解析
2019/08/20 Javascript
es6函数之尾递归用法实例分析
2020/04/25 Javascript
vue-router的hooks用法详解
2020/06/08 Javascript
在Python中使用NLTK库实现对词干的提取的教程
2015/04/08 Python
利用python爬取散文网的文章实例教程
2017/06/18 Python
深入理解Python中的super()方法
2017/11/20 Python
Scrapy基于selenium结合爬取淘宝的实例讲解
2018/06/13 Python
PyCharm 配置远程python解释器和在本地修改服务器代码
2019/07/23 Python
Django+python服务器部署与环境部署教程详解
2020/03/30 Python
python IDLE添加行号显示教程
2020/04/25 Python
Python turtle库的画笔控制说明
2020/06/28 Python
通过代码简单了解django model序列化作用
2020/11/12 Python
英国领先的杂志订阅网站:Magazine.co.uk
2018/01/25 全球购物
德国50岁以上交友网站:Lebensfreunde
2020/03/18 全球购物
Java的类与C++的类有什么不同
2014/01/18 面试题
2014年话务员工作总结
2014/11/19 职场文书
个人思想政治总结
2015/03/05 职场文书
新农村建设指导员工作总结
2015/08/13 职场文书
初中班长竞选稿
2015/11/20 职场文书
导游词之日本富士山
2020/01/06 职场文书
python 如何做一个识别率百分百的OCR
2021/05/29 Python