JS 中 new 操作符

this对象的理解:

( 1 ) this总是指向函数的直接调用者(而非间接调用者);

( 2 ) 如果有new关键字,this指向new出来的那个对象;

( 3 ) 在事件中,this指向触发这个事件的对象,特殊的是,IE中的attachEvent中的this总是指向全局对象Window。

new操作符具体干了什么呢?

( 1 ) 创建一个空对象,并且 this 变量引用该对象,同时还继承了该函数的原型。

(2)属性和方法被加入到 this 引用的对象中。

(3)新创建的对象由 this 所引用,并且最后隐式的返回 this 。

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

1.如果就一个函数,没有返回值,没有prototype成员,然后使用new,会是什么结果呢?如果一个函数没有返回值,那么如果不使用new来创建变量,那么该变量的值为undefined.如果用了new,那么就是Object.说明一个函数的默认的Prototype是Object.

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"

				
时间: 2024-10-06 00:41:35

JS 中 new 操作符的相关文章

js中的操作符

写在前面 js语法 DOM对象(把body,div,p等节点树看成一个对象) BOM对象(把浏览器的地址栏历史记录DOM等装在一个对象) 浏览器是宿主,但js的宿主不限于浏览器,也可以是服务器,如node.js. 运算符: //js中拼接运算符 console.log(2+3); console.log('hello'+''+'world'); console.log(2+3+4+'haha'+5+6);//9haha56,一旦碰到非法数字后,后面的一律理解为“拼接” 例如 var num1=5

JS中==与===操作符的比较

摘要: ===操作符: 要是两个值类型不同,返回false 要是两个值都是number类型,并且数值相同,返回true 要是两个值都是stirng,并且两个值的String内容相同,返回true 要是两个值都是true或者都是false,返回true 要是两个值都是指向相同的Object,Arraya或者function,返回true 要是两个值都是null或者都是undefined,返回true ==操作符: 如果两个值具有相同类型,会进行===比较,返回===的比较值 如果两个值不具有相同类

JS中new操作符源码实现

首先我们来看一下实例化一个对象做了浏览器做了什么事情 new的四步操作: 1. 创建一个空对象 2. 设置空对象的__proto__属性继承构造函数的prototype属性,也就是继承构造函数的原型对象上的公有属性和方法 3. 调用构造函数,将构造函数中的this替换为空对象的this,继承构造函数中的属性 4. 在函数内部返回一个新对象 源码实现 function myNew (fun) { return function () { // 创建一个新对象且将其隐式原型指向构造函数原型 let

js中的new操作符

一.js中new操作符来声明一个对象:例如有如下一个实例function Person(){Person.prototype.fn=function(){console.log(1);}}var p=new Person(); 上例中使用new操作符来声明一个对象实际上是进行了三个动作: 1.var p={}; 2.p._proto_=Person.prototype; 3.Person.call(p); 二.以上的三个操作是在使用new操作符创建对象的时候实际执行的动作. 以上为本人对new操

【js实例】js中的5种基本数据类型和9种操作符

js中的5中基本数据类型 js标识符 第一个字符必须为字母,下划线,或美元符 其他字符可以是字母,下划线,美元符,数字 js标识符区分大小写 标识符不能使关键字和保留字 关键字: break do instanceof typeof case else new var catch finally return void continue for switch while debugger function this with default if throw   delete in try  

js中操作符 || 和 &&

一.第一部分(引子) 先来介绍一下在js中由其他数据类型转化为boolean时到底是转化成true还是false js中,当以下值转成boolean类型的时候,会被转换成false 0 ""(空串) false undefined null NaN 其余的则会被转化为true 这里顺便说一句,js中将数据转化为boolean类型的方式有 1.Boolean() 2.!! //eg var value = 5; console.log(typeof value);//number con

js中的new操作符与Object.create()的作用与区别

js中的new操作符与Object.create()的作用与区别 https://blog.csdn.net/mht1829/article/details/76785231 2017年08月06日 19:19:26 阅读数:1058 一.new 操作符 JavaScript 中 new 的机制实际上和面向类的语言完全不同. 在 JavaScript 中,构造函数只是一些使用 new 操作符时被调用的函数.它们并不会属于某个类,也不会实例化一个类.实际上,它们甚至都不能说是一种特殊的函数类型,它

模拟实现js中的new操作符

能否实现js的new操作符 new new运算符创建了一个用户自定义的对象类型的实例或具有构造函数的内置对象类型之一 定义一个构造函数Student,该函数接收两个参数name和age: function Student(name,age){ this.name=name this.age=age } let first=new Student('dylan','26') console.log(first.name);// dylan console.log(first.age);// 26

转:彻底理解js中this的指向,不必硬背

转:http://www.cnblogs.com/pssp/p/5216085.html 首先必须要说的是,this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上this的最终指向的是那个调用它的对象(这句话有些问题,后面会解释为什么会有问题,虽然网上大部分的文章都是这样说的,虽然在很多情况下那样去理解不会出什么问题,但是实际上那样理解是不准确的,所以在你理解this的时候会有种琢磨不透的感觉),那么接下来我会深入的探讨这个问题. 为什么要学习this?