JavaScript 实现类的多种方法实例


Posted in Javascript onMay 01, 2013

构造方法

function coder()
{
    this.name = '现代魔法';
    this.job = 'Web 开发者';
    this.coding = function ()
    { alert('我正在写代码'); }
}
var coder = new coder();
alert(coder.name);
coder.coding();

工厂方法
function createCoderFactory()
{
    var obj = new Object();
    obj.name = '现代魔法';
    obj.job = '程序员';
    obj.coding = function ()
    {
        alert('我正在写代码');
    };
    return obj;
}
var coder = createCoderFactory();
alert(coder.name);
coder.coding();

工厂方法和构造方法都有着一个相同的缺点,就是每创建一个实例,都会实例化该类的每个函数。

原型链

function coder(){}
coder.prototype.name = '现代魔法';
coder.prototype.job = '程序员';
coder.prototype.coding = function(){
    alert('我正在写代码');
};
var coder = new coder();
alert(coder.name);
coder.coding();

原型链有个缺点就是它所有属性都共享,只要一个实例改变其他的都会跟着改变。如:
var coder1 = new coder();
var coder2 = new coder();
alert(coder1.name);     /*显示现代魔法*/
coder2.name = 'nowamagic';
alert(coder1.name);     /*显示nowamagic*/
alert(coder2.name);     /*这个也显示nowamagic*/

混合方式
以上三种都有着各自的缺点,所以我们要加以改进。
function coder()
{
    this.name = '现代魔法';
    this.job = '程序员';
}
coder.prototype.coding = function(){
    alert('我正在写代码');
};

动态原链
要解决前三种的缺点,还有一种方法。
function coder()
{
    this.name = '现代魔法';
    this.job = '程序员';
    if (typeof(coder._init) == 'undefined')
    {
        this.coding = function ()
        {
            alert('我正在写代码');
        };
        this._init = true;
    }
}
Javascript 相关文章推荐
WordPress JQuery处理沙发头像
Jun 22 Javascript
JavaScript 常用函数库详解
Oct 21 Javascript
JQuery扩展插件Validate 5添加自定义验证方法
Sep 05 Javascript
为JavaScript类型增加方法的实现代码(增加功能)
Dec 29 Javascript
获取服务器传来的数据 用JS去空格的正则表达式
Mar 26 Javascript
理解JAVASCRIPT中hasOwnProperty()的作用
Jun 05 Javascript
ComboBox 和 DateField 在IE下消失的解决方法
Aug 30 Javascript
jquery一键控制checkbox全选、反选或全不选
Oct 16 jQuery
vue3 源码解读之 time slicing的使用方法
Oct 31 Javascript
Vue设置长时间未操作登录自动到期返回登录页
Jan 22 Javascript
js实现删除json中指定的元素
Sep 22 Javascript
Vue使用Ref跨层级获取组件的步骤
Jan 25 Vue.js
Json字符串转换为JS对象的高效方法实例
May 01 #Javascript
Jquery post传递数组方法实现思路及代码
Apr 28 #Javascript
javascript中的onkeyup和onkeydown区别介绍
Apr 28 #Javascript
JQuery中如何传递参数如click(),change()等具体实现
Apr 28 #Javascript
JQuery制作的放大效果的popup对话框(未添加任何jquery plugin)分享
Apr 28 #Javascript
JS中setInterval、setTimeout不能传递带参数的函数的解决方案
Apr 28 #Javascript
jquery在IE、FF浏览器的差别详细探讨
Apr 28 #Javascript
You might like
php动态实现表格跨行跨列实现代码
2012/11/06 PHP
利用php绘制饼状图的实现代码
2013/06/07 PHP
CentOS 6.3下安装PHP xcache扩展模块笔记
2014/09/10 PHP
javascript 带有滚动条的表格,标题固定,带排序功能.
2009/11/13 Javascript
JS自定义选项卡函数及用法实例分析
2015/09/02 Javascript
Google 地图叠加层实例讲解
2016/08/06 Javascript
AngularJS通过$location获取及改变当前页面的URL
2016/09/23 Javascript
js实现对table的增加行和删除行的操作方法
2016/10/13 Javascript
JavaScript实现的浏览器下载文件的方法
2017/08/09 Javascript
原生JS写Ajax的请求函数功能
2017/12/22 Javascript
vue.js整合vux中的上拉加载下拉刷新实例教程
2018/01/09 Javascript
Vue.js获取被选择的option的value和text值方法
2018/08/24 Javascript
Vue实现Layui的集成方法步骤
2020/04/10 Javascript
[06:43]DAC2018 4.5 SOLO赛 Maybe vs Paparazi
2018/04/06 DOTA
Python实现比较两个列表(list)范围
2015/06/12 Python
Python抓取淘宝下拉框关键词的方法
2015/07/08 Python
python 读取竖线分隔符的文本方法
2018/12/20 Python
Django数据库类库MySQLdb使用详解
2019/04/28 Python
使用 Python 在京东上抢口罩的思路详解
2020/02/27 Python
Python中用xlwt制作表格实例讲解
2020/11/05 Python
利用CSS3实现自定义滚动条代码分享
2016/08/18 HTML / CSS
Shein英国:女性时尚网上商店
2019/04/10 全球购物
Europcar意大利:汽车租赁
2019/07/07 全球购物
西班牙在线光学:Visual-Click
2020/06/22 全球购物
双方协议书
2014/04/22 职场文书
幼儿园清明节活动总结
2014/07/04 职场文书
2015商场元旦促销活动策划方案
2014/12/09 职场文书
大三学生英语考试作弊检讨书
2015/01/01 职场文书
交警失职检讨书
2015/01/26 职场文书
2015年社区综治工作总结
2015/04/21 职场文书
劳动模范获奖感言
2015/07/31 职场文书
班主任寄语2016
2015/12/04 职场文书
一封真诚的自荐信帮你赢得机会
2019/05/07 职场文书
MySQL 8.0 Online DDL快速加列的相关总结
2021/06/02 MySQL
PostgreSQL13基于流复制搭建后备服务器的方法
2022/01/18 PostgreSQL
python实现简单的三子棋游戏
2022/04/28 Python