代码信息来自于http://ejohn.org/apps/learn/。

new做了什么?

function Ninja(){
this.name = "Ninja";
} var ninjaA = Ninja();
console.log( ninjaA, "undefined,ninja并不是实例化" ); var ninjaB = new Ninja();
console.log( ninjaB.name == "Ninja", "true,在实例化里存在name属性" )

对一个函数进行new操作,这就是实例化。

上述代码的流程为,创造一个临时对象,继承Ninja.prototype对象,执行函数Ninja,一开始将上下文this设置为临时对象。没有return语句,返回这个临时对象。

我们的上下文this指向实例化对象

function Ninja(){
this.swung = false; // Should return true
this.swingSword = function(){
this.swung = !this.swung;
return this.swung;
};
} var ninja = new Ninja();
console.log( ninja.swingSword(), "调用实例对象方法" );
console.log( ninja.swung, "引用实例对象属性" ); var ninjaB = new Ninja();
console.log( !ninjaB.swung, "确定this引用的属性是实例化对象的属性,实例化对象彼此不影响." );

习题:增加一个方法,可以给ninja一个name属性

function Ninja(name){
//补足
} var ninja = new Ninja("John");
console.log( ninja.name == "John", "在初始化时name属性就被设置" ); ninja.changeName("Bob");
console.log( ninja.name == "Bob", "name值成功修改" );

向实例化对象增加一个新的属性和方法

function Ninja(name){
this.changeName = function(name){
this.name = name;
}
this.changeName(name)
} var ninja = new Ninja("John");
console.log( ninja.name == "John", "在初始化时name属性就被设置" ); ninja.changeName("Bob");
console.log( ninja.name == "Bob", "name值成功修改" );

当没有使用new时会发生什么?

function User(first, last){
this.name = first + " " + last;
} var user = User("John", "Resig");
console.log( typeof user == "undefined", "因为没有new,所以User作一般函数调用,没有返回值" );
function User(first, last){
this.name = first + " " + last;
} window.name = "Resig";
var user = User("John", name); console.log( name == "John Resig", "全局属性被覆盖" );

当没有new时,它其实就是一般的函数调用,遵循函数调用的本质。

确保在错误的情况下仍然使用对象实例化

function User(first, last){
if ( !(this instanceof User) )
return new User(first, last);
this.name = first + " " + last;
} var name = "Resig";
var user = User("John", name); console.log( user, "即使没有使用new,仍然可以正确实例化" );
console.log( name == "Resig", "实例化属性正常" );

通过判断this不是构造函数User的实例化对象,重新实例化,这是一个可以不使用new进行实例化的技巧。

习题:有没有更加基因化的方法做同样的事情?

function User(first, last){
if ( !(this instanceof ___) )
return new User(first, last);
this.name = first + " " + last;
} var name = "Resig";
var user = User("John", name); console.log( user, "即使没有使用new,仍然可以正确实例化" );
console.log( name == "Resig", "实例化属性正常" );

用arguments.callee实现

function User(first, last){
if ( !(this instanceof ___) )
return new User(first, last);
this.name = first + " " + last;
} var name = "Resig";
var user = User("John", name); console.log( user, "即使没有使用new,仍然可以正确实例化" );
console.log( name == "Resig", "实例化属性正常" );

arguments.callee引用的是函数本身。

javascript高级知识分析——实例化的更多相关文章

  1. javascript高级知识分析——上下文

    如果函数是一个对象的属性,那么它可以? var katana = { isSharp: true, use: function(){ this.isSharp = !this.isSharp; } } ...

  2. javascript高级知识分析——灵活的参数

    代码信息来自于http://ejohn.org/apps/learn/. 使用数量可变的参数对编程很有好处 function merge(root){ for(i = 0 ; i < argum ...

  3. javascript高级知识分析——作为对象的函数

    代码信息来自于http://ejohn.org/apps/learn/. 函数和对象是不是非常相似? var obj = {}; var fn = function(){}; console.log( ...

  4. javascript高级知识分析——函数访问

    代码信息来自于http://ejohn.org/apps/learn/. 可以通过函数的名字在它的内部引用它. function yell(n){ return n > 0 ? yell(n-1 ...

  5. javascript高级知识分析——定义函数

    代码信息来自于http://ejohn.org/apps/learn/. 可以使用哪些方式来声明函数? function isNimble(){ return true; } var canFly = ...

  6. JavaScript的高级知识---词法分析

    JavaScript的高级知识---词法分析 词法分析 词法分析方法: js运行前有一个类似编译的过程即词法分析,词法分析主要有三个步骤: 分析参数 再分析变量的声明 分析函数说明 函数在运行的瞬间, ...

  7. MySQL高级知识(七)——索引面试题分析

    前言:该篇随笔通过一些案例,对索引相关的面试题进行分析. 0.准备 #1.创建test表(测试表). drop table if exists test; create table test( id ...

  8. MySQL高级知识(五)——索引分析

    前言:前面已经学习了explain(执行计划)的相关知识,这里利用explain对索引进行优化分析. 0.准备 首先创建三张表:tb_emp(职工表).tb_dept(部门表)和tb_desc(描述表 ...

  9. 《JavaScript高级程序设计》读书笔记--前言

    起因 web编程过程使用javascript时感觉很吃力,效率很低.根本原因在于对javascript整个知识体系不熟,看来需要找些书脑补一下,同时欢迎众网友监督. 大神推荐书籍 看了博客大神们推荐的 ...

随机推荐

  1. Linux下将多个静态库(.a)合并成一个静态库文件(.a)的命令操作,方法一

    .a 文件的结构和.tar文件就没有什么区别. x 命令解出来, a 命令添加, t命令列表 假设A.a, B.a C.a 在/usr/local/lib目录下 mkdir /tmp/libABC c ...

  2. 下载类网站的SEO优化方面技巧

    在互联网国际中有一类十分主要的网站,那即是供应各种软件下载的网站,这类网站可以协助用户解决许多软件运用方面的疑问,可是随着知识产权维护的认识越来越强,许多下载类网站也要开端改动自个的经营策略,这么才可 ...

  3. Android 动画之ScaleAnimation应用具体解释

    android中提供了4中动画: AlphaAnimation 透明度动画效果 ScaleAnimation 缩放动画效果 TranslateAnimation 位移动画效果 RotateAnimat ...

  4. C#编程打字指法练习

    很惊讶昨晚写的第一篇学习笔记竟然有个评论了,只是今天还是对基础知识提不起精神,还是先看那三本书了解一下程序开发的大概流程吧. 今天不知道怎么闲逛就找到了这个网站,说是专门用于编程练习的,用google ...

  5. javascript之函数节流

    对于高频率的事件触发,为了优化页面性能,我们一般会对其做函数节流.比如: resize.keydow.scroll事件等.用户的频繁操作,会导致事件高频率的执行,这样会出现页面抖动啊.频繁调接口啊等问 ...

  6. javascript——touch事件介绍与实例演示

      分类: javascript2014-02-12 16:42 1742人阅读 评论(0) 收藏 举报 touch事件touchmovetouchstarttouchend 前言 诸如智能手机和平板 ...

  7. CoreLocation导航Demo

    CoreLocation实现定位和导航功能还是非常简单的,基本思路是: 1.导入<CoreLocation/CoreLocation.h>头文件 2.使用该框架内的导航管理者,创建该导航管 ...

  8. JavaScript中的Math.ceil()、Math.round()、Math.floor()

    1. Math.ceil():向上取整(指取大于该浮点数的最小整数) 2. Math.round():四舍五入取整(注意:当该浮点数距离两端整数一样时,取较大的那个整数,如Math.round(-1. ...

  9. Javascript 可同时变大变宽等一系列效果运动框架——逐行分析代码,让你轻松了解运动的原理

    等待已久的可变大,变宽 等一系列效果运动框架出炉了,现在还是个初级版本,能满足需求.我们看看是如何实现的. 我们知道在Javascript 中 ‘.’等同于 ‘[]’ 例如: oDiv.style.h ...

  10. 第一个MVC模型

    根据慕课网的视频自学来的. 关于MVC的简介和一些常识:http://www.cnblogs.com/jobscn/archive/2011/11/08/2240725.html MVC模式 : MV ...