Javascript中调用一个函数(对象),使用new或者直接调用有什么区别?

这个问题绕了一下,网上搜了一下感觉这个解释最好,然后加上自己调试的页面,希望对大家有用。


如果是最典型的构造函数模式,必须加上new:

function Man(age){
	this.sex="male";
	this.age=age;
}
m1=Man(20);
m2=new Man(21);
console.log(m1);//undefined
console.log(m2);//Man {sex: "male", age: 21}
 
m1就是函数Man()执行的返回值,也就是undefined. 在函数执行过程中,属性被加到全局作用域或者Man方法所属的对象上了。执行之后window.sex=="male"
而m2是Man的实例, Man {sex:"male",age:21}

-----------------------------------------------------------------------------------------------------------------------------------

function Man(age) {
	var obj = new Object();
	obj.sex = "mail";
	obj.age = age;
	return obj;
}
m3=Man(22);
console.log(m3);//Object {sex: "mail", age: 22}
m4 = new Man(33);
console.log(m4);//Object {sex: "mail", age: 33}
 
这个就不需要加new,m3是一个Object,不是Man的实例。 

-------------------------------------------------------------------------------------------------------------------------------

native code中,加new就是返回这个构造函数的实例;不加作为函数就返回一个基本数据类型,或者会报错 “ DOM object constructor cannot be called as a function ”。

Date(),不加new返回当前时间,是一个字符串。加new的话,返回当前时间或者把参数格式化得到的时间,是一个Date对象

String(),不加new将参数格式化为字符串,加new则返回的是String对象。它们的区别如下:

var s1=new String(2);
//如果把s1 log到控制台中,输出 String{0:"2"}
var s2=String(2);
//如果把s2 log到控制台中,输出 '2'
console.log(typeof s1);
//"object"
console.log(typeof s2);
//"string"
s1.pro = 1;
console.log(s1.pro);
//1
s2.pro = 1;
console.log(s2.pro);
//undefined
Number和String类似。
Array,Object加不加new貌似是一样的?
Image,XMLHttprequest等不能作为函数使用。

使用new则是将之当做构造函数来调用,会创建一个该类的实例对象,这个对象的type是这个函数名,中间使用this.propertyname=value会对该实例对象的属性赋值,并且无论有没有return,都会返回这个对象。

而如果是直接调用就是简单执行里面的代码,不会创建实例对象,this指向的调用环境下的this对象,如果是在全局中直接调用,就是window,没有默认返回值。

---------------------------------------------------------------------------------------------

下面是几个实例搞懂了 就差不多哦了

function Man(age){  
   var sex="male";  
    this.age=age;  
}  
m1=Man(20);  
此时sex是局部变量
console.log(this.sex);//undefined
console.log(window.sex);//undefined

---------------------------------------------------------------------------------------------

function Man(age){  
    sex="male";  
    this.age=age;  
}  
 
m2 =  Man(21);
sex为全局变量
console.log(this.sex);//male
console.log(window.sex);//male

-----------------------------------------------------------------------------------------------

function Man(ages){  
    this.sex="male";  
    age=ages;  
}  
 
m2 = new Man(21);//Man {sex: "male"}
age为全局变量 new出来的 Man没有age属性
console.log(m2.age);//undefined
console.log(window.age);//21

-----------------------------------------------------------------------------------------------

function Man(ages){  
    this.sex="male";  
    age=ages;  
}  
 
m2 = Man(21);
console.log(m2);//underfined
console.log(window.age);//21
console.log(m2.age);//m2为nudefined所以报错Uncaught TypeError: Cannot read property 'age' of undefined


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值