js核心基础之构造函数constructor用法实例分析


Posted in Javascript onMay 11, 2019

本文实例讲述了js核心基础之构造函数constructor用法。分享给大家供大家参考,具体如下:

在js中,可以利用构造函数来创建特定类型的对象,其中,有一些原生的构造函数,Object、Array、等等,所以,当type of Object时,返回的是function。此外,我们还可以创建自定义的构造函数,从而自定义对象的属性以及方法。

例如:

function Person(name,age,job) {
  this.name=name;
  this.age=age;
  this.job=job;
  this.sayName=function () {
    alert(this.name);
  }
}
var person1=new Person('zhy',18,'SoftWare Engineer');
var person2=new Person('zhy2',19,'Doctor');

注意:要创建Person的新实例,必须使用new操作符。如果不使用new,则属性和方法都被添加给了window对象了。

这种方式调用构造函数实际上会经历一下4个步骤:

① 创建一个新对象;
② 将构造函数的作用域赋给新对象,因此,this就指向了这个新对象;
③ 执行构造函数中的代码,即为这个新对象添加属性、方法;
④ 返回新对象。

缺点:

在上述例子中,我们可以知道,每个实例都有一个sayName的方法,但是

console.log(person1.sayName==person2.sayName);//false

因为,每创建一个实例的时候,实际上所做的是下面这种:

function Person(name,age,job) {
  this.name=name;
  this.age=age;
  this.job=job;
  this.sayName=new Function () {
    alert(this.name);
  }
}

所以,person1的sayName跟person2的sayName不是同一个实例。但是我们可以这样做:

function Person(name,age,job) {
  this.name=name;
  this.age=age;
  this.job=job;
  this.sayName=sayName;
 }
function sayName(){
   alert(this.sayName);
}

这样一来,每个实例对象里面 的sayName函数指向的都是同一个函数。

可是问题又来了,如果对象有很多的函数要定义,那么就要定义很多个全局函数,没有封装性可言了,好在这些问题可以通过使用原型模式来解决。

本文参照《JavaScript高级程序编程》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JS之小练习代码
Oct 12 Javascript
JQuery 无废话系列教程(一) jquery入门 [推荐]
Jun 23 Javascript
window.location.reload()方法刷新页面弹出要再次显示该网页对话框
Apr 24 Javascript
jquery实现保存已选用户
Jul 21 Javascript
详解Javascript事件驱动编程
Jan 03 Javascript
深入浅析JavaScript中的3DES
Aug 24 Javascript
AngularJS解决ng界面长表达式(ui-set)的方法分析
Nov 07 Javascript
vue.js树形组件之删除双击增加分支实例代码
Feb 28 Javascript
微信小程序 自动登陆PHP源码实例(源码下载)
May 08 Javascript
解决微信小程序中转换时间格式IOS不兼容的问题
Feb 15 Javascript
vue.js 打包时出现空白页和路径错误问题及解决方法
Jun 26 Javascript
js实现无缝轮播图特效
May 09 Javascript
js核心基础之闭包的应用实例分析
May 11 #Javascript
vue下载excel的实现代码后台用post方法
May 10 #Javascript
微信小程序如何再次获取用户授权的方法
May 10 #Javascript
vue 弹窗时 监听手机返回键关闭弹窗功能(页面不跳转)
May 10 #Javascript
vue-cli+axios实现文件上传下载功能(下载接收后台返回文件流)
May 10 #Javascript
vue element中axios下载文件(后端Python)
May 10 #Javascript
微信小程序授权登录解决方案的代码实例(含未通过授权解决方案)
May 10 #Javascript
You might like
基于mysql的论坛(7)
2006/10/09 PHP
PHP 观察者模式的实现代码
2013/05/10 PHP
PHP实现的DES加密解密封装类完整实例
2017/04/29 PHP
php实现生成code128条形码的方法详解
2017/07/19 PHP
javascript 仿QQ滑动菜单效果代码
2010/09/03 Javascript
动态添加option及createElement使用示例
2014/01/26 Javascript
JQuery做的一个简单的点灯游戏分享
2014/07/16 Javascript
JavaScript阻止浏览器返回按钮的方法
2015/03/18 Javascript
学习JavaScript设计模式(链式调用)
2015/11/26 Javascript
写给小白的JavaScript引擎指南
2015/12/04 Javascript
深入理解JavaScript中的预解析
2017/01/04 Javascript
Canvas放置反弹效果随机图形(实例)
2017/08/17 Javascript
JQuery获取元素尺寸、位置及页面滚动事件应用示例
2019/05/14 jQuery
JS禁用右键、禁用Ctrl+u、禁用Ctrl+s、禁用F12的实现代码
2020/12/01 Javascript
js 实现碰撞检测的示例
2020/10/28 Javascript
一个小示例告诉你Python语言的优雅之处
2014/07/04 Python
python回溯法实现数组全排列输出实例分析
2015/03/17 Python
python自定义类并使用的方法
2015/05/07 Python
在Python程序中操作MySQL的基本方法
2015/07/29 Python
Python时间戳使用和相互转换详解
2017/12/11 Python
sublime python3 输入换行不结束的方法
2018/04/19 Python
pandas or sql计算前后两行数据间的增值方法
2018/04/20 Python
Python爬虫小技巧之伪造随机的User-Agent
2018/09/13 Python
CentOS7安装Python3的教程详解
2019/04/10 Python
Python爬取视频(其实是一篇福利)过程解析
2019/08/01 Python
python orm 框架中sqlalchemy用法实例详解
2020/02/02 Python
Python3爬虫关于代理池的维护详解
2020/07/30 Python
德国家用电器购物网站:Premiumshop24
2019/08/22 全球购物
全球精选男装和家居用品:Article
2020/04/13 全球购物
荷兰DOD药房中文官网:DeOnlineDrogist
2020/12/27 全球购物
电子信息工程专业自荐书
2014/06/24 职场文书
课外小组活动总结
2014/08/27 职场文书
2014公司年终工作总结
2014/12/19 职场文书
2015年“我们的节日·中秋节”活动总结
2015/07/30 职场文书
MySQL高速缓存启动方法及参数详解(query_cache_size)
2021/07/01 MySQL
Win11怎样将锁屏账户头像图片改成动画视频
2021/11/21 数码科技