JavaScript 构造函数、原型对象(一)

本文介绍了在JavaScript中如何使用工厂方法和构造函数来创建和批量制造对象。通过工厂方法,我们可以快速创建多个具有相同结构但不同属性的对象,而构造函数则允许我们定义特定类型的对象,并通过`new`关键字来实例化。此外,还探讨了`this`的使用场景以及`instanceof`操作符在判断对象类型中的应用。
摘要由CSDN通过智能技术生成

想要创建一个对象很简单:

        var obj1={
            name:"娜娜",
            age:18,
            gender:"女",
            sayName:function(){
                console.log(this.name);
            }
        };

如果需要创建N个对象,是否需要将以上代码复制N段,然后修改其中的值?

我们可以使用工厂方法来快速批量创建对象:

		//创建一个人的对象的函数
		function people(name,age,genger){
			//创建一个新的对象
			var obj= new Object();
			//向对象中添加属性
			obj.name=name;
			obj.age=age;
			obj.genger=genger;
			obj.sayName=function(){
				alert(this.name);
			};
			//返回新的对象
			return obj;
		}

 此时需要几个对象只需要添加并写入实参即可添加几个对象:

        var obj1=people("娜娜",18,"女");
        var obj2=people("丽丽",20,"女");
        var obj3=people("鑫鑫",22,"男");

输出到控制台:

        console.log(obj1);
        console.log(obj2);
        console.log(obj3);

可以看见我们的三个对象已成功添加:

17:15:33.151 {"age":18,"genger":"女","name":"娜娜","sayName":"function (){\n\t\t\t\tconsole.log(this.name);\n\t\t\t}"} at 对象.html:160
17:15:33.153 {"age":20,"genger":"女","name":"丽丽","sayName":"function (){\n\t\t\t\tconsole.log(this.name);\n\t\t\t}"} at 对象.html:161
17:15:33.154 {"age":22,"genger":"男","name":"鑫鑫","sayName":"function (){\n\t\t\t\tconsole.log(this.name);\n\t\t\t}"} at 对象.html:162

下面使用工厂方法再创建一个狗(dog)的对象:

		function dog(name,age){
			var obj=new Object();
			obj.name=name;
			obj.age=age;
			obj.sayHello=function(){
				alert("汪汪~~");
			};
			return obj;
		}

 将参数传入并验证类型:

        var obj4=dog("旺财",3);
        console.log(typeof obj4);

得到的结果是object

* 使用工厂方法创建的对象,使用的构造函数都是object,所以创建的对象都是object这个类型,就导致我们无法区分出多种不同类型的对象

 

构造函数

构造函数与普通函数的创建没什么区别,只是习惯上首字母大写:

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

构造函数的执行流程:

        1、立刻创建一个新的对象

        2、将新建的对象设置为函数中的this,在构造函数中可以使用this来引用新建的对象(如果

        直接用name=name,则写到window里了)

        3、逐行执行函数中的代码

        4、将新建的对象作为返回值返回

构造函数与普通函数的区别就在于调用方式的不同,普通函数直接调用,而构造函数需要使用new关键字来调用:

var peo=People("胡歌",34,"男");    //普通函数
var peo=new People("胡歌",34,"男");

instanceof可以检查一个对象是否是一个类的实例:

        语法:对象 instanceof 构造函数

console.log(peo instanceof People);

返回true

下面再创建一个Dog类:

function Dog(name,age){
        }

var dog=new Dog();

此时再检测peo是否是Dog的实例:

console.log(peo instanceof Dog);

返回false

如果:

        console.log(peo instanceof Object);
        console.log(peo instanceof Object);

该结果返回true

所以,所有对象都是Object的后代,任何对象和Object做检查都会返回true

*  构造函数可以很好的将各类分别开来;

    this的情况:

        1、当以函数的形式调用时,this是window

        2、当以方法的形式调用时,谁调用方法this就是谁

        3、当以构造函数形式调用时,this就是新创建的那个对象

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值