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 相关文章推荐
Mootools 1.2教程 滑动效果(Slide)
Sep 15 Javascript
浅谈javascript中的作用域
Apr 07 Javascript
JavaScript伸缩的菜单简单示例
Dec 03 Javascript
js中split和replace的用法实例
Feb 28 Javascript
JavaScript在form表单中使用button按钮实现submit提交方法
Jan 23 Javascript
基于JS实现仿百度百家主页的轮播图效果
Mar 06 Javascript
jQuery插件zTree实现获取一级节点数据的方法
Mar 08 Javascript
Bootstrap fileinput文件上传组件使用详解
Jun 06 Javascript
JS点击缩略图整屏居中放大图片效果
Jul 04 Javascript
node实现mock-plugin中间件的方法
Dec 25 Javascript
《javascript设计模式》学习笔记三:Javascript面向对象程序设计单例模式原理与实现方法分析
Apr 07 Javascript
Vue toFixed保留两位小数的3种方式
Oct 23 Javascript
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
关于Intype一些小问题的解决办法
2008/03/28 PHP
用php实现的获取网页中的图片并保存到本地的代码
2010/01/05 PHP
php park、unpark、ord 函数使用方法(二进制流接口应用实例)
2010/10/19 PHP
PHP文件上传原理简单分析
2011/05/29 PHP
Ubuntu中支持PHP5与PHP7双版本的简单实现
2018/08/19 PHP
微信企业转账之入口类分装php代码
2018/10/01 PHP
TopList标签和JavaScript结合两例
2007/08/12 Javascript
利用jQuery的$.event.fix函数统一浏览器event事件处理
2009/12/21 Javascript
情人节专属 纯js脚本1k大小的3D玫瑰效果
2012/02/11 Javascript
jQuery JSON实现无刷新三级联动实例探讨
2013/05/28 Javascript
JQuery插件fancybox无法在弹出层使用左右键的解决办法
2013/12/25 Javascript
window.setInterval()方法的定义和用法及offsetLeft与style.left的区别
2015/11/11 Javascript
浅谈js图片前端预览之filereader和window.URL.createObjectURL
2016/06/30 Javascript
javascript获取网页各种高宽及位置的方法总结
2016/07/27 Javascript
简单实现js菜单栏切换效果
2017/03/04 Javascript
实例分析nodejs模块xml2js解析xml过程中遇到的坑
2017/03/18 NodeJs
微信小程序 数据遍历的实现
2017/04/05 Javascript
深入浅析JSONAPI在PHP中的应用
2017/12/24 Javascript
jQuery实现的五星点评功能【案例】
2019/02/18 jQuery
flexible.js实现移动端rem适配方案
2020/04/07 Javascript
python实现爬取千万淘宝商品的方法
2015/06/30 Python
Python的Django框架中的数据库配置指南
2015/07/17 Python
Python爬虫番外篇之Cookie和Session详解
2017/12/27 Python
django 使用 PIL 压缩图片的例子
2019/08/16 Python
CSS3 :default伪类选择器使用简介
2018/03/15 HTML / CSS
Vilebrequin欧洲官网:法国豪华泳装品牌(男士沙滩裤)
2018/04/14 全球购物
Mankind美国/加拿大:英国领先的男士美容护发用品公司
2018/12/05 全球购物
个人作风剖析材料
2014/02/02 职场文书
大学生精神文明先进个人事迹材料
2014/05/02 职场文书
九一八事变演讲稿
2014/09/05 职场文书
初级党校心得体会
2014/09/11 职场文书
2015年迎新晚会策划书
2015/07/16 职场文书
使用canvas对video视频某一刻截图功能
2021/09/25 HTML / CSS
使用Redis实现点赞取消点赞的详细代码
2022/03/20 Redis
Pytorch中使用ImageFolder读取数据集时忽略特定文件
2022/03/23 Python
Python tensorflow卷积神经Inception V3网络结构
2022/05/06 Python