这几天跟几个同事聊天发现他们对javascript什么时候该用new都不是很了解。

1、javascript的function什么时候该new什么时候不该new?
我觉得主要的问题还是集中在javascript的弱类型上面。

new在干什么

首先我们知道new是干什么,以我们java或.net的语言经验显然在创造对象。是的,不管是java还是.net。他是在创建一个对象。

new后面是什么

那么我们考虑一下new的后面是什么,(java和.net)一般是被一个class修饰的类名称。那么我们考虑一下,我们实例一个对象是干什么或者说设计者的目的是什么,那么一般情况下对象都会包含这些成员,属性与行为或者其中之一(我们在javaEE中DAO只有行为,POJO只有属性),有没有看到过既没有属性也没有行为的对象(当然类可以这么设计,但是没有意义)。

javascript的new干了什么
那么javascript的new干了什么?new其实开辟了内存空间创建了一个object这个object就是this,然后这个this的prototype指向了函数本身的prototype。
也就是说去new一个function的时候,开辟了一个this,这个this就是对象本身,再想想你去实例一个对象。你要拿到对象的成员,属性或方法或其中之一。this本身有几种方式能声明成员,一种在function函数体内部用this.的方式声明,例如:this.a = '123',其实就是给他的a属性赋了一个‘123’字符串,当然也可以赋值行为。还有种方式就是通过原型继承,通过function函数的.prototype的方式。
好了,因为javascript是弱类型,他没有class修饰,没有是否有返回值修饰,只有一个function修饰。所以function是否是构造函数很难通过函数头知道。所以是否需要去new就需要你去揣摩function的目的,他到底是不是构造函数。

实例代码说明
既然他是弱类型,他们可以根据内部的条件选择到底是做构造函数用,还是做普通函数用。再加上我们很多程序员都是其他语言出身,很少有人系统的学习了javascript,所以就很混淆。
下面我们来看混淆的例子吧。

Js代码

  • function Hello() {
  • this.a = '123';
  • this.b = function () {
  • alert('b');
  • }
  • return this;
  • }
  • Hello.prototype.c = function() {
  • alert('c');
  • }
  • var aHello = new Hello();
  • var bHello = Hello();
  • alert(aHello.a)
  • alert(bHello.a)
  • aHello.b();
  • bHello.b();
  • aHello.c();
  • bHello.c();

你会发现bHello.c()是执行不了的。在看看上面的函数,他为什么既能new又能不new。
new其实开辟了内存空间创建了一个object这个object就是this,然后这个this的prototype指向了函数本身的prototype。
不new就是执行了这个函数,最后return this就是返回了这个执行函数的宿主,其实就是window本身。
所以c函数是绑定在Hello的prototype上的,所以window上根本没有。

但是就出现了一个问题,就是如果在不执行c方法或者c本身不是通过原型继承的方式的话(就是不通过Hello的prototype方式,通过直接给this赋值的方式),其实创建的this的内容和window增加的内容是一样的,程序员会本能的以为new和不new是一样的。这样就掉坑里去了。

总结:javascript弱类型语言,一个函数即使是普通的执行函数,你new或不new都会出现编译器异常。
new与不new我们要做好以下几点。
1、首先大家要了解new本身干了什么,然后看函数创建者的意图,看函数结构。
2、一个好的程序员在提供某个javascript工具类或公用方法时,应该注释告诉你的调用者怎么去使用你提供的公用内容,或者提供工厂方法。

JS基础如何理解对象的更多相关文章

  1. JS的从理解对象到创建对象

    JavaScript不是一门真正的面向对象语言,因为它连最基本的类的概念都没有,因此它的对象和基于类的语言中的对象也会有所不同.ECMA-262把对象定义为:“无序属性的集合,其属性可以包含基本值.对 ...

  2. JS面向对象设计-理解对象

    不同于其他面向对象语言(OO,Object-Oriented),JS的ECMAScript没有类的概念, 它把对象定义为"无序属性(基本值.对象.函数)的集合",类似于散列表. 每 ...

  3. 【2017-03-28】JS基础、windows对象、history对象、location对象

    一.JS基础 JS - javaScript 1.js功能: 1).进行数据的运算.2).控制浏览器的一些功能.3).控制元素(属性.内容.样式) js引用位置: 可以放在html页的任意位置. 推荐 ...

  4. Js基础之常用对象

    今天来总结一下js中的常用对象: 1.string对象 常用方法: charAt():返回在指定位置的字符. charCodeAt():返回在指定的位置的字符的 Unicode 编码. concat( ...

  5. JS基础-内置对象【字符串+Date+Math】

    JS内置对象[字符串] // charAt() 返回字符 // charCodeAt() 返回字符的unicode编码 var str="hello world"; console ...

  6. JS基础常识理解

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. JS基础之BOM对象

    BOM 对象 JavaScript分为 ECMAScript,DOM,BOM. BOM(浏览器对象模型),可以对浏览器窗口进行访问和操作.使用 BOM,开发者可以移动窗口.改变状态栏中的文本以及执行其 ...

  8. JS基础语法---Array对象的方法

    Array对象的方法   Array.isArray(对象)---->判断这个对象是不是数组 instanceof关键字 判断对象是不是数组类型:两种方法: //1 instanceof var ...

  9. JS基础语法---String对象下的方法(字符串的方法)

    实例方法---->必须要通过new的方式创建的对象(实例对象)来调用的方法 静态方法---->直接通过大写的构造函数的名字调用的方法(直接通过大写的对象名字调用的) 字符串的常用属性: . ...

随机推荐

  1. Struts2 工作流程

    Struts2使用了WebWork的设计核心(XWork),在内部使用拦截器处理用户请求,从而允许用户业务逻辑控制器和ServletAPI分离.Struts2内部是一个MVC架构,Struts2 的核 ...

  2. 微信OPENID授权方法

    今天搞了下微信授权, 总结了下微信的授权规则与步骤 先来几个关键字 Openid  微信ip(属于唯一指向公众号的id) redirect_uri  授权回调地址 State 回调地址带参数 Appi ...

  3. 基于DateTime Picker修改成类似旅游网站出发日期选择的功能

    原版说明文档:http://www.bootcss.com/p/bootstrap-datetimepicker/ 修改后可支持多日期选择和控制可选日期,这样就能在后台设置哪些日期可选,前台展示时可以 ...

  4. Python之路第十一天,高级(3)-Python操作 Memcached、Redis

    Memcached Memcached 是一个高性能的分布式内存对象缓存系统,用于动态Web应用以减轻数据库负载.它通过在内存中缓存数据和对象来减少读取数据库的次数,从而提高动态.数据库驱动网站的速度 ...

  5. 安装Ubuntu时的硬盘分区方案 转载

    安装Ubuntu时的硬盘分区方案 http://www.cnblogs.com/shenliang123/p/3196743.html 如果你准备在硬盘里只安装Ubuntu一个操作系统的话,建议你采用 ...

  6. C++有没有string转化int的函数,怎样转换

    有两种方法1. c++中string到int的转换 1) 在C标准库里面,使用atoi: #include <cstdlib>#include <string> std::st ...

  7. 中国大学MOOC-翁恺-C语言程序设计习题集

    今年网易出了“中国大学MOOC”,于是选了浙大翁恺老师的“C语言程序设计”学习,近期打算把自己在该课程中的PAT习题解答做一个记录,等自己编程能力提高后再来看现在写的代码哪里还有写的不好,可以改进的地 ...

  8. sqlite在Android上的一个bug:SQLiteCantOpenDatabaseException when nativeExecuteForCursorWindow

    更多内容在这里查看 https://ahangchen.gitbooks.io/windy-afternoon/content/ ::-/com.company.product W/System.er ...

  9. 提升Boolean和out相结合的用户体验

    在我们编写代码的过程中经常有这样的需求,比如添加一条数据,我们想要的结果是如果添加成功了就返回true,如果添加失败了就返回false,在返回false的同时携带错误信息,我们通常的做法是定义这样的方 ...

  10. 将数组适配到ListView

    public class TutListActivity extends ListActivity { @Override public void onCreate(Bundle savedInsta ...