一、什么是构造函数
构造函数(Constructor)的创建方式和普通函数一样。但通常首字母进行大写,用于和普通函数区分。
但是当一个函数创建好以后,我们并不知道它是不是构造函数(即使函数名的首字母为大写)。只有当它以 new 操作符来调用的时候,我们才能说它是一个构造函数。
//创建一个普通函数 function dog(){ console.log('这是一个普通函数') } //普通函数的调用 var d=dog(); console.log(d); //创建一个Person类的构造函数 function Person(name, age) { this.name = name; this.age = age; } //构造函数的调用 var p=new Person('李于',45); console.log(p)
二、构造函数的作用
构造函数的作用是新建实例对象,并且给实例对象内的成员(属性或方法)赋值。
在我们需要创建大量同一类型的对象时,这些对象都具有某些属性或方法,如果我们直接通过变量加字面量的形式进行赋值,会产生很多重复的代码。而当我们将这些对象抽象为一个类时,创建一个构造函数,就可以实现代码复用。
举个例子,我们要录入高中三班中每一位同学的个人信息,那么我们可以创建一些对象,比如:
var c1={name:'li',age:16,hobby:'dancing',gender:'男'} var c2={name:'xili,age:17,hobby:'xili',gender:'女'} var c3={name:'jy',age:20,hobby:'cjy',gender:'男'}
像上面这样,我们可以把每一位同学的信息当做一个对象来处理。但是,我们会发现,我们重复地写了很多无意义的代码。比如 name、age、hobby、gender 。如果这个班上有45个学生,我们得重复写45遍。
这个时候,构造函数的优势就体现出来了。我们发现,虽然每位同学都有 name、gender、hobby这些属性, 但它们都是不同的,那我们就把这些属性当做构造函数的参数传递进去。
我们就可以创建以下的函数:
function Person(name,age,hobby,gender){ this.name=name this.age=age this.hobby=hobby this.gender=gender } //当创建函数以后, 我们就可以通过 new 关键字调用,也就是通过构造函数来创建对象了。 var c1=new Person('li','16','dancing','男'); var c2=new Person('xili','17','xili','女') var c3=new Person('jy','20','cjy','男') //..... //封装构造函数的过程会比较麻烦,但一旦封装成功,我们再创建对象就会变得非常轻松,这也是我们为什么要使用构造函数的原因。
三、构造函数的执行流程
- 立即创建一个新的对象
- 将新建的对象设置给函数中的this,在构造函数中可使用this来引用新建的对象
- 逐行执行函数中的代码
- 将新建的对象作为返回值返回
//写一个构造函数 function Person(name,age,gender){ //1.会帮我们创建一个对象 //2.obj对象 给到了 this(就是this指向obj) //3.通过this给obj对象赋值
/*
* 在构造函数内部创建的sayName方法
* -每执行一次就会创建一个新的方法
* -这样对于同样的方法多次创建占用空间,损耗性能
*/
// this.sayName = function () {
// console.log(this.name);
// }
// 将sayName放在全局作用域中定义就不会多次创建
this.name=name this.age=age this.gender=gender //4.帮我们返回obj对象 }
四、instanceof
使用instanceof可以检查一个对象是否是一个类的实例。语法: 对象 instanceof 构造函数。如果是类的实例,则返回true,否则返回false。例如:
// 判断shier是不是Person的实例 console.log(shier instanceof Person);
注意:所有对象都是object的后代,所以任何对象和object做instanceof检查都会返回true。
// 判断shier是不是Object的实例 console.log(shier instanceof Object);
五、小结:
一个构造函数可以通过new创建多个实例对象
创建构造函数时,里面的属性和方法前必须加this
构造函数不需要return 就可以返回结果
标签:name,对象,gender,age,JavaScript,Person,构造函数 From: https://www.cnblogs.com/vant-xie/p/16740598.html