JS面向对象--构造函数

至今我们学习了很多调用函数的方式:
圆括号直接调用
对象打点调用
定时器调用
事件处理函数调用
数组枚举调用

他们体现的不同点就是函数上下文不同 他们的this不一样

现在我们学习新的函数调用方法,用new运算符来调用函数

试着用new运算符调用一个函数:

function fun(){
  alert("你好")
}
new fun(); //你好  

函数可以执行
也就是说new是一个全新的调用函数的方式
我们关心的是,这个函数的上下文是

function fun(){
 // alert(this)   //object object
  this.name ="小明";
  this.age = 12;
  this.sex="男";

}
var obj = new fun(); 
alert(obj.age);   //12
//console.log(obj);  //fun{name:"小明",age:"12",”sex:"男"}

用new运算符调用一个函数的时候 ,会经历四步走
1,函数内部悄悄的创建一个局部变量,是一个空对象{}
2, 函数将自己的上下文设置为这个{},即所有语句中的this就表示这个空对象
3,函数将执行所有语句
4,所有语句执行后,函数将return这个对象,函数将把自己的上下文返回.

所以,遇见new操作符,马上想起四步走

目前为止,我们发现,这个new运算符能够调用函数,还能返回一个对象 ,
//构造函数,可以当做一个”类“ ,描述的是一类对象需要拥有的属性

function People(name,age,sex){
 // alert(this)   //object object
  this.name = name;
  this.age = age;
  this.sex=sex;

}
//类的实例
var xiaoming = new People("小明","12","男");
var xiaohong = new People("小红","15","女");
console.log(xiaoming);   //fun{name:"小明",age:"12",”sex:"男"}

console.log(xiaohong);

我们发现用new操作符,可以返回具有相同属性群的对象。
我们说,Peoples可以认为是一个”类“,xiaomming ,xiaohong,xiaoqing都是这个类的”实例“(instance)。
JS中没有类的概念,我们这里只有JAVA C++ C#做一个类比,JS中只有构造函数。当一个函数被new操作符调用的时候,这个函数就是一个构造函数,它总能返回一类具有相同属性群的对象,感觉在”构造东西“,所以这个函数很神奇,像一个模子,在制作类似的对象。
为了提醒其他程序员,这是一个必须用new调用的函数,换句话说提醒别人这是一个构造函数,这类函数的名字必须首字母大写。

我们看不用new操作符调用构造函数会发生什么 ;

function People(name,age,sex){
 // alert(this)   //object object
  this.name = name;
  this.age = age;
  this.sex=sex;

}
People("小明","12","男");
alert(age);     //12

由于我们直接调用了构造函数,此时就是标准的函数直接加圆括号调用 ,函数里面的this是window对象,所以,此时name age sex 都被设置成了window对象的属性,我们知道window对象的属性是全局变量。此时能够弹出12.

JS中没有Class关键字(ECMAScript2016增加了Class关键字),我们就是使用new操作符的时候,会按"四步走"创建一些具有相同属性群的实例,些时就感觉有了”类“,JS只提”构造函数‘,不提“类”。

Javascript不是一个面向对象(OO)的语言,它只是基于对象(bo).

小题目:

function fun(){}
这个函数是不是一个构造函数?答案是不知道,因为只要用new操作符调用一个函数,此时这个函数就是一个构造函数。至于函数名字没有大写,那只是习惯,不是语言要求

再来,这个函数是不是构造函数:

function People(name,age){
  this.name = name;
  this.age = age;
}

答案也是不确定!因为用new调用它就是一个构造函数,不用new调用就不是

var obj = People("小明",12);

函数根本就没有返回值,此时obj就是Null

obj == null  //true
obj.age;    //报错

**所以构造函数没有什么 ,就是全新的函数调用方式 **

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 参考文档++Javascript面向对象编程(二):构造函数的继承今天要介绍的是,对象之间的"继承"的五种方法,怎...
    day_day_up阅读 1,175评论 0 0
  • 1. Java基础部分 基础部分的顺序:基本语法,类相关的语法,内部类的语法,继承相关的语法,异常的语法,线程的语...
    子非鱼_t_阅读 32,448评论 18 399
  • 一、面向过程和面向对象的区别、联系 1.面向过程编程:注重解决问题的步骤,分析问题需要的每一步,实现函数依次调用。...
    空谷悠阅读 4,369评论 1 11
  • 普通创建对象和字面量创建对象不足之处:虽然 Object 构造函数或对象字面量都可以用来创建单个对象,但这些方式有...
    believedream阅读 7,126评论 2 18
  • 从9月18日到今天,可以说这周是开学以来最忙碌的!周一晚上整理了创文材料,那天正好婆婆回老家,我得自己带...
    匆匆十年阅读 1,661评论 0 1

友情链接更多精彩内容