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 相关文章推荐
发两个小东西,ASP/PHP 学习工具。 用JavaScript写的
Apr 12 Javascript
JavaScript prototype对象的属性说明
Mar 13 Javascript
设为首页和收藏的Javascript代码(亲测兼容IE,Firefox,chrome等浏览器)
Nov 18 Javascript
jquery实现弹出div,始终显示在屏幕正中间的简单实例
Mar 08 Javascript
原生javascript实现拖动元素示例代码
Sep 01 Javascript
angularJS 入门基础
Feb 09 Javascript
js中实现字符串和数组的相互转化详解
Jan 24 Javascript
require简单实现单页应用程序(SPA)
Jul 12 Javascript
socket.io学习教程之深入学习篇(三)
Apr 29 Javascript
详解react-native WebView 返回处理(非回调方法可解决)
Feb 27 Javascript
AngularJs1.x自定义指令独立作用域的函数传入参数方法
Oct 09 Javascript
vue动态加载SVG文件并修改节点数据的操作代码
Aug 17 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
教你如何开启shopnc b2b2c 伪静态
2014/10/21 PHP
PHP实现大数(浮点数)取余的方法
2017/02/18 PHP
PHP基于GD2函数库实现验证码功能示例
2019/01/27 PHP
php设计模式之正面模式实例分析【星际争霸游戏案例】
2020/03/24 PHP
50个优秀经典PHP算法大集合 附源码
2020/08/26 PHP
经典的解除许多网站无法复制文字的绝招
2006/12/31 Javascript
jqPlot Option配置对象详解
2009/07/25 Javascript
JavaScript 变量作用域分析
2011/07/04 Javascript
JQuery文字列表向上滚动的代码
2013/11/13 Javascript
快速解决jquery之get缓存问题的最简单方法介绍
2013/12/19 Javascript
jquery为页面增加快捷键示例
2014/01/31 Javascript
jQuery学习笔记之总体架构
2014/06/03 Javascript
AngularJS  $on、$emit和$broadcast的使用
2016/09/05 Javascript
js中获取键盘事件的简单实现方法
2016/10/10 Javascript
基于jQuery实现的查看全文功能【实用】
2016/12/11 Javascript
Vue无限滑动周选择日期的组件的示例代码
2018/07/18 Javascript
浅析vue-router jquery和params传参(接收参数)$router $route的区别
2018/08/03 jQuery
微信小程序自定义select下拉选项框组件的实现代码
2018/08/28 Javascript
JS document内容及样式操作完整示例
2020/01/14 Javascript
JavaScript文档加载模式以及元素获取
2020/07/28 Javascript
解决vue项目,npm run build后,报路径错的问题
2020/08/13 Javascript
解决vue页面刷新,数据丢失的问题
2020/11/24 Vue.js
ptyhon实现sitemap生成示例
2014/03/30 Python
Python的Bottle框架中返回静态文件和JSON对象的方法
2015/04/30 Python
Scrapy-redis爬虫分布式爬取的分析和实现
2017/02/07 Python
Python中easy_install 和 pip 的安装及使用
2017/06/05 Python
Python之使用adb shell命令启动应用的方法详解
2019/01/07 Python
Python matplotlib绘制饼状图功能示例
2019/09/10 Python
python字符串反转的四种方法详解
2019/12/02 Python
解决TensorFlow调用Keras库函数存在的问题
2020/07/06 Python
css3边框_动力节点Java学院整理
2017/07/11 HTML / CSS
以设计师精品品质提供快速时尚:Mostata
2019/05/10 全球购物
介绍一些UNIX常用简单命令
2014/11/11 面试题
美工的岗位职责
2013/11/14 职场文书
2015年度党员自我评价范文
2015/03/03 职场文书
导游词之重庆渣滓洞
2020/01/08 职场文书