js面向对象理解二

js面向对象理解(二)
前面总结了js面向对象的一些基础概念,接下来想说说关于js面向对象中创建对象这块的内容,以下是我个人的一些见解,有任何纰漏的地方还请大家批评指正!

一、创建对象:
1.创建单个对象:


(1)函数声明:
 var obj=new Object();
obj.name="holly";
obj.age=21;
obj.sex="女";
obj.printname=function(){
 alert (this.name);
}


(2)函数表达式:
 var obj={
  name:"holly",
  age:21,
  sex:"女",
printName:function(){


 alert(this.name);
}


}


2.创建多个对象:


(1)工厂模式:是软件工程广为人知的一种设计模式,抽象了创建具体对象的过程(一般是封装好带有参数的类,然后重复调用这个类)
在js中没有类的概念,因此采用封装好带有参数的函数重复调用这个函数来实现这个功能
eg:
function createPerson(name,age,job){
var obj= new Object();
obj.name=name; //封装对象的属性
obj.age=age;
obj.job=job;
obj.printName=function(){alert(this.name);};
return obj;
}  
var person1=createPerson("holly",21,"worker"); //调用createPerson()函数
var person2=createPerson("bob",12,"student"); //调用createPerson()函数




注:工厂模式虽然解决了通过传递参数封装方法实现一次性可以创建多个对象的目的,但是工厂模式并不能识别对象类型。


(2)构造函数模式:(重点)在js中任何利用new来调用的函数都是构造函数。
在JavaScript中,任何合法的函数都可以作为对象的构造函数,这既包括系统内置函数,例如:Object()、Array()、Date()等(方法里面带参数,即可调用);也包括用户自己定义的函数,例如Person()<习惯上,构造方法的声明,首字母大写>。一旦函数被作为构造函数执行,它内部的this属性将引用函数本身。
构造函数没有返回值,它们只是初始化由this指针传递进来的对象,并且什么也不返回。如果一个函数有返回值,被返回的对象就成了new表达式的值。从形式上看,一个函数被作为构造函数还是普通函数执行的唯一区别,是否用new运算符。
eg:
function Person(name,age,job){
 
 this.name=name;//通过this来引用函数本身。
 this.age=age;
 this.job=job;
function sayName(){alert(this.name);}
}
 var person1=new Person("holly",12,"student");
 var person2=new Person("bob",13,"child");//构造函数的调用一定是要用new的!


注意:1.一般情况下,构造函数是没有返回值的,由this作为指针来传递对象。但是在一些实际运用上却有构造函数返回值的情况,这种情况分为返回值为引用类型和值类型的情况:
①返回值是引用类型(数组、函数、对象等)的情况:
function Test(){
 this.a=10;
 return function(){return 1;}

var m=new Test(); //构造函数调用
var n=Test(); //普通函数调用 
alert(m);//返回的是return function(){return 1;}} return 后面的闭包
alert(n);//返回的是return function(){return 1;}} return 后面的闭包




②返回值是值类型(基本的数据类型)的情况:


function Mun(){
  this.a=10;
  return 1;} 
 var m1=new Mun();//构造函数
 var n1=Mun();//普通函数
alert(m1);//返回object 即返回值将被丢弃。new 表达式的结果仍然是this所引用的对象。
alert(n1);//返回1 


2.以构造函数方式创建的函数虽然Fucntion实例化函数的方式一样但是会导致不同的作用域和标识解析。因此不同实例上的同名函数是不相等的。
eg:
function Person(name,age,job){
  this.name=name;
  this.age=age;
  this.job=job;
  this.sayName=new function(){alert(this.name);}
}
 var person1=new Person("holly",12,"student"); 
 var person2=new Person("bob",13,"child");
alert(person1.sayName==person2.sayName);//false




(3)原型模式:重点词:共享属性和方法
①:理解原型对象(prototype、constructor)
原型对象:是js的一个普通对象,但是区别于其他的对象,原型对象有且只有一份,其作用是为每个实例对象存储共享的属性和方法(这些实例化的对象共享这个原型对象)。


注:理解prototype与constructor的关系:


prototype:只要创建函数,prototype属相就会产生。并且指向原型对象。


constructor(构造函数属性):是所有的原型对象自动获得的一个属性,并且这属性包含了一个指向prototype属性所在的函数的指针。


如何理解:prototype =>指向原型对象,constructor (带有一个指针)=>指向prototype所在的函数,eg:Person.prototype.constructor=>Person

(4)思路:js创建对象(利用Object函数可以创建对象,但是只能创建单个对象,因此引入工厂模式,封装函数,通过参数传递可以一次性创建多个对象,但是工厂模式不识别对象类型,为解决这一问题,于是有了构造函数(利用new来调用函数,且一般没有返回值),但是构造函数内定义的全局函数实际上只能被某个对象利用,如果要定义多个全局函数,则要定义多个全局函数一一对应被调用的对象。这样导致构造函数没法封装。于是为解决这一问题,js创建对象又出现了原型模式)。
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值