javascript中使用new与不使用实例化对象的区别


Posted in Javascript onJune 22, 2015

我们先来看个实例

function Me(name,age,job){
  this.name = name;
  this.age = age;
  this.job = job;
}

请问这以下两种实例化对象方式有什么区别呢?

var mefun1 = new Me('fei','20','it');
var mefun2 = Me('fei','20','it');

简单的说

第一种是构造函数式,即通过new运算符调用构造函数Function来创建函数
第二种不是实例化,只是调用函数把返回值赋给变量。

再扩展下

JavaScript 中并没有真正的类,但JavaScript 中有构造函数和new 运算符。构造函数用来给实例对象初始化属性和值。任何JavaScript 函数都可以用做构造函数,构造函数必须使用new 运算符作为前缀来创建新的实例。

new 运算符改变了函数的执行上下文,同时改变了return 语句的行为。实际上,使用new和构造函数很类似于传统的实现了类的语言:

// 实例化一个Me
var alice = new Me('alice', 18, 'Coder');
// 检查这个实例
assert( alice instanceof Me );

构造函数的命名通常使用驼峰命名法,首字母大写,以此和普通的函数区分开来,这是
一种习惯用法。

// 不要这么做!
Me('alice', 18, 'Coder'); //=> undefined

这个函数只会返回undefined,并且执行上下文是window(全局)对象,无意间创建了3个全局变量name,age,job。调用构造函数时不要丢掉new 关键字。

当使用new 关键字来调用构造函数时,执行上下文从全局对象(window)变成一个空的上下文,这个上下文代表了新生成的实例。因此,this 关键字指向当前创建的实例。尽管理解起来有些绕,实际上其他语言内置类机制的实现也是如此。

默认情况下,如果你的构造函数中没有返回任何内容,就会返回this——当前的上下文。

要不然就返回任意非原始类型的值.

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
WordPress 插件——CoolCode使用方法与下载
Jul 02 Javascript
jQuery实现列表自动滚动循环滚动展示新闻
Aug 22 Javascript
浅析Javascript中“==”与“===”的区别
Dec 23 Javascript
JavaScript汉诺塔问题解决方法
Apr 21 Javascript
基于jQuery实现仿QQ空间送礼物功能代码
May 24 Javascript
Angular2 环境配置详细介绍
Sep 21 Javascript
JS实现中国公民身份证号码有效性验证
Feb 20 Javascript
不使用JavaScript实现菜单的打开和关闭效果demo
May 01 Javascript
JavaScript实现创建自定义对象的常用方式总结
Jul 09 Javascript
Node.js实现用户评论社区功能(体验前后端开发的乐趣)
May 09 Javascript
详解JWT token心得与使用实例
Aug 02 Javascript
js实现简易ATM功能
Oct 27 Javascript
浅谈javascript构造函数与实例化对象
Jun 22 #Javascript
jquery分析文本里url或邮件地址为真实链接的方法
Jun 20 #Javascript
jQuery实现文本框输入同步的方法
Jun 20 #Javascript
jQuery实现带滚动导航效果的全屏滚动相册实例
Jun 19 #Javascript
jquery实现的代替传统checkbox样式插件
Jun 19 #Javascript
JQuery实现的图文自动轮播效果插件
Jun 19 #Javascript
移除AngularJS下URL中的#字符的方法
Jun 19 #Javascript
You might like
php中switch与ifelse的效率区别及适用情况分析
2015/02/12 PHP
PHP人民币金额转大写实例代码
2015/10/02 PHP
php中引用&的用法分析【变量引用,函数引用,对象引用】
2016/12/12 PHP
golang 调用 php7详解及实例
2017/01/04 PHP
左右悬浮可分组的网站QQ在线客服代码(可谓经典)
2012/12/21 Javascript
瀑布流布局并自动加载实现代码
2013/03/12 Javascript
浅析onsubmit校验表单时利用ajax的return false无效问题
2013/07/10 Javascript
自定义require函数让浏览器按需加载Js文件
2016/11/24 Javascript
js实现简单的获取验证码按钮效果
2017/03/03 Javascript
Angular.js中处理页面闪烁的方法详解
2017/03/09 Javascript
使用Angular CLI生成 Angular 5项目教程详解
2018/03/18 Javascript
Vue 开发音乐播放器之歌手页右侧快速入口功能
2018/08/08 Javascript
使用Vue实现移动端左滑删除效果附源码
2019/05/16 Javascript
layui表格数据重载
2019/07/27 Javascript
解决vue v-for src 图片路径问题 404
2019/11/12 Javascript
js通过canvas生成图片缩略图
2020/10/02 Javascript
[04:16]DOTA2英雄梦之声_第09期_斧王
2014/06/21 DOTA
python del()函数用法
2013/03/24 Python
Python查找相似单词的方法
2015/03/05 Python
使用Turtle画正螺旋线的方法
2017/09/22 Python
解决Python3 控制台输出InsecureRequestWarning问题
2019/07/15 Python
将python2.7添加进64位系统的注册表方式
2019/11/20 Python
python中数据库like模糊查询方式
2020/03/02 Python
如何实现更换Jupyter Notebook内核Python版本
2020/05/18 Python
Python第三方包PrettyTable安装及用法解析
2020/07/08 Python
python 还原梯度下降算法实现一维线性回归
2020/10/22 Python
pycharm实现猜数游戏
2020/12/07 Python
CSS3属性background-size使用指南
2014/12/09 HTML / CSS
HTML5中的nav标签学习笔记
2016/06/24 HTML / CSS
html5新特性与用法大全
2018/09/13 HTML / CSS
Ratchet 模态框的实现
2020/08/19 HTML / CSS
俄罗斯第一家多品牌在线奢侈品精品店:Aizel.ru
2020/09/06 全球购物
SQL Server笔试题
2012/01/10 面试题
机关搬迁方案
2014/05/18 职场文书
专题组织生活会发言材料
2014/10/17 职场文书
java获取一个文本文件的编码(格式)信息
2022/09/23 Java/Android