首页 > web前端 > js教程 > 正文

JS的设计模式之构造函数模式详解

php中世界最好的语言
发布: 2018-03-14 14:07:33
原创
1639人浏览过

这次给大家带来js的设计模式构造函数模式详解,使用js构造函数模式的注意事项有哪些,下面就是实战案例,一起来看一下。

概念 
构造函数用于创建特定类型的对象,我们在里面不仅声明了使用的对象,构造函数还可以接受参数以便于第一次创建的时候设置对象的成员值。你也可以声明自定义类型对象的属性和方法

作用和注意事项 

用于创建特定类型的对象。

第一次声明的时候给对象赋值

可以传参进去,自己声明构造函数,赋予属性和方法

注意事项:

注意new的使用

区分与单例的区别

基本用法 
JavaScript里,构造函数通常是认为用来实现实例的,JavaScript没有类的概念,但是有特殊的构造函数。我们通过使用new操作付,我们可以告诉javascript我们要创建的的一个新的对象并且新对象的成员都是构造函数里定义的。在构造函数里,this指向的是新创建的对象,基本语法如下:

PHP轻论坛
PHP轻论坛

简介PHP轻论坛是一个简单易用的PHP论坛程序,适合小型社区和个人网站使用。v3.0版本是完全重构的版本,解决了之前版本中的所有已知问题,特别是MySQL保留字冲突问题。主要特点• 简单易用:简洁的界面,易于安装和使用• 响应式设计:适配各种设备,包括手机和平板• 安全可靠:避免使用MySQL保留字,防止SQL注入• 功能完善:支持分类、主题、回复、用户管理等基本功能• 易于扩展:模块化设计,便于

PHP轻论坛 21
查看详情 PHP轻论坛
function PersonBir(name, year, month) {
    this.month = month;    this.year = year;    this.name = name;    this.output= function () {
        return this.name + ":" + this.year +"年"+ this.month+"月";
    };
}var ming= new PersonBir("小明", 1998, 5);var gang= new PersonBir("小刚", 2000, 4);
console.log(ming.output());
console.log(gang.output());1234567891011121314
登录后复制

这就是最简单的构造函数的方法,但是我们有没有发现一个问题,我们在继承的时候是不是感觉太麻烦了,所以我们可以通过原型prototype,将ouput方法添加到创建的对象上,来看下面的这一段代码

function PersonBir(name, year, month) {
    this.month = month;    this.year = year;    this.name = name;
}
PersonBir.prototype.output=function(){
     return this.name + ":" + this.year +"年"+ this.month+"月";
}var ming= new PersonBir("小明", 1998, 5);var gang= new PersonBir("小刚", 2000, 4);
console.log(ming.output());
console.log(gang.output());123456789101112
登录后复制

这样output单实例可以在PersonBir对象实例中共享使用,我们通过给构造函数命名时采用函数名大写来表示,以便于区分普通函数。

强制使用new操作符 
对于构造函数new操作符的使用我们来看下面这些代码,我们通过判断this值的instanceof是是不是PersonBir达到强制使用new操作符,以达到目的。

function PersonBir(name, year, month) {
    //核心代码,如果为假,就创建一个新的实例返回。
    if(!(this instanceof PersonBir)){        return new PersonBir(name, year, month);
    }    this.month = month;    this.year = year;    this.name = name;
}
PersonBir.prototype.output=function(){
     return this.name + ":" + this.year +"年"+ this.month+"月";
}var ming= new PersonBir("小明", 1998, 5);var gang= new PersonBir("小刚", 2000, 4);
console.log(ming.output());
console.log(gang.output());
登录后复制

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

js设计模式之-单例模式的使用

前端为什么要使用模块化?

CSS的常见兼容性问题解决方案

以上就是JS的设计模式之构造函数模式详解的详细内容,更多请关注php中文网其它相关文章!

相关标签:
最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号