`

JS中踩过的坑(1) ----new 操作符的使用

 
阅读更多

        按照javascript语言精粹中所说,如果在一个函数前面带上new来调用该函数,那么将创建一个隐藏连接到该函数的prototype成员的新对象,同时this将被绑定到那个新对象上。这个话很抽象,我想用实例来让自己加深理解。

1.如果就一个函数,没有返回值,没有prototype成员,然后使用new,会是什么结果呢?如果一个函数没有返回值,那么如果不使用new来创建变量,那么该变量的值为undefined.如果用了new,那么就是Object.说明一个函数的默认的Prototype是Object.  原文:http://www.cnblogs.com/RitaRichard/archive/2011/10/12/2208902.html

function Test1(str) {
    this.a = str;
}
var myTest = new Test1("test1");
alert(myTest); //[object Object]
function Test1WithoutNew(str) {
    this.a = str;
}
var myTestWithoutNew = Test1WithoutNew("test1");
alert(myTestWithoutNew); //undefined;

2.如果函数有返回值,但是返回值是基本类型。那么new出来的myTest还是object.因为基本类型的prototype还是Object. 而如果不使用new,那么返回值就是string的值。

function Test1(str) {
    this.a = str;
    return this.a;
}
var myTest = new Test1("test1");
alert(myTest); //Object

function Test1WithoutNew(str) {
    this.a = str;
    return this.a;
}
var myTestWithoutNew = Test1WithoutNew("test1");
alert(myTestWithoutNew); //"test1"

3。如果函数的返回值为new出来的对象,那么myTest的值根据new出来的对象的prototype而定。

function Test1(str) {
    this.a = str;
    return new String(this.a);
}
var myTest = new Test1("test1");
alert(myTest); //String "test1"

4。接下来我们开始讨论new中的this。如果我们给Test1的prototype中加入一个方法叫get_string(),那么get_string()中的this指的就是这个新对象。能够得到在new时候赋予该对象的属性值。

var Test2 = function(str) {
    this.a = str;
}

Test2.prototype.get_string = function () {
    return this.a;
};

var myTest2 = new Test2("test2");
alert(myTest2.get_string()); //“test2”

var Test2 = function(str) {
    this.a = str;
}

Test2.prototype.get_string = function () {
    return this.a;
};

var myTest2 = Test2("test2");
alert(myTest2)//undefined

5。如果我们修改了函数的prototype,又会发生什么样的情况呢? 那么就会发生类似继承的功能,其实就是js的伪类实现。

function Test1(str) {
    this.b = str;
}
Test1.prototype.Get_Test1String = function () {
    return this.b;
};

var Test2 = function(str) {
    this.a = str;
}
Test2.prototype = new Test1("test1");
Test2.prototype.get_string = function () {
    return this.a;
};

var myTest2 = new Test2("test2");
alert(myTest2); //Object
alert(myTest2.get_string()); //"test2"
alert(myTest2.Get_Test1String()); //"test1"
分享到:
评论

相关推荐

    js代码-new操作符

    js代码-new操作符

    【JavaScript源代码】JavaScript中new操作符的原理示例详解.docx

    JavaScript中new操作符的原理示例详解  new的作用是通过构造函数来创建一个实例对象,该实例与原型和构造函数之间的关系如下图所示: 执行 new 操作时会依次经过以下步骤: 1、创建一个空对象  空对象是 Object...

    js代码-手动实现 new 操作符

    js代码-手动实现 new 操作符

    详解JavaScript中new操作符的解析和实现

    主要介绍了JavaScript中new操作符的解析和实现,帮助大家更好的理解和学习JavaScript,感兴趣的朋友可以了解下

    面试第二题 new 操作符 具体干了什么?

    JavaScript new操作符具体干了什么呢? 在javascript 只要new 一个函数,就可以new一个对象,这应该算是JavaScript中函数式编程思想,这里主要说明的是 在new的过程中发生了什么? 1.具体主要有4个部分: 1.创建了一...

    JS使用new操作符创建对象的方法分析

    在编写js代码时,我们有时会需要使用函数来模拟java中的类,并用它来产生对象,在定义了一个构造函数之后我们需要使用new操作符来调用调用函数才能得到我们想要的对象。例如: [removed] function Constructor(name...

    js代码-实现new操作符

    js代码-实现new操作符

    用方法封装javascript的new操作符(一)

    虽然js是基于对象的,但在很多时候会使用到new这个操作符。

    JavaScript中文参考手册

    这些对象同时在客户端和服务器端的 JavaScript 中使用。 Array 属性 方法 Boolean 属性 方法 Date 属性 方法 Function 属性 方法 Math 属性 方法 Number 属性 方法 Object 属性 方法 String ...

    浅谈javascript中new操作符的原理

    javascript中的new是一个语法糖,对于学过c++,java 和c#等面向对象语言的人来说,以为js里面是有类和对象的区别的,实现上js并没有类,一切皆对象,比java还来的彻底 new的过程实际上是创建一个新对象,把新象的...

    JavaScript语言参考手册

    这些对象同时在客户端和服务器端的 JavaScript 中使用。 Array 属性 方法 Boolean 属性 方法 Date 属性 方法 Function 属性 方法 Math 属性 方法 Number 属性 方法 Object 属性 方法 String 属性 方法 RegExp 属性 ...

    JavaScript笔记

    如返回-1,x则不在数组中 18.Number对象: |--x.toFixed(num):可把Number四舍五入为指定小数位数(num:0-20)的数字 |--x.toString():用于把一个 Number 对象转换为一个字符串,并返回结果 19.正则表达式对象:...

    ExtAspNet v2.2.1 (2009-4-1) 值得一看

    -重命名AccordionPanel为AccordionPane (这也是在Asp.net AJAX中使用的名称). +所有的面板默认有两个集合属性(Toolbars和Items). -尽管TabStrip, From, Tree, Accordion继承了Items属性,但是你并不能对其设置...

    JavaScript中的new的使用方法与注意事项

    JavaScript是一门基于原型的语言,但它却拥有一个 new 操作符使得其看起来象一门经典的面对对象语言。那样也迷惑了程序员们,导致一些有问题的编程模式。其实你永远不需要在JavaScript使用 new Object()。用字面量的...

Global site tag (gtag.js) - Google Analytics