博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
[js高手之路]搞清楚面向对象,必须要理解对象在创建过程中的内存表示
阅读量:6509 次
发布时间:2019-06-24

本文共 2172 字,大约阅读时间需要 7 分钟。

javascript面向对象编程方式,对于初学者来说,会比较难懂. 要学会面向对象以及使用面向对象编程,理解对象的创建在内存中的表示,至关重要.

首先,我们来一段简单的对象创建代码

1         var obj = new Object(); 2         obj.userName = 'ghostwu'; 3         obj.showUserName = function(){ 4             return obj.userName; 5         }; 6         var obj2 = new Object(); 7         obj2.userName = '卫庄'; 8         obj2.showUserName = function(){ 9             return obj2.userName;10         };11 12         console.log( obj.showUserName() ); //ghostwu13         console.log( obj2.showUserName() ); //卫庄

上例,我们创建了两个对象obj和obj2, 如果有多个类似对象,我们可以通过函数封装,这种函数封装方式,在设计模式里面叫工厂模式

1         function createObj( uName ){ 2             var obj = new Object(); 3             obj.userName = uName; 4             obj.showUserName = function(){ 5                 return obj.userName; 6             } 7             return obj; 8         } 9         var obj1 = createObj( 'ghostwu' );10         var obj2 = createObj( '卫庄' );11         console.log( obj1.showUserName() ); //ghostwu12         console.log( obj2.showUserName() ); //卫庄

工厂模式简化了创建多个类似对象的过程,但是却不能识别对象的类型,为了识别对象的创建类型,我们可以使用构造函数方式.

什么是构造函数方式?

其实我们js很多创建内存对象的方式 都是构造函数方式,如,数组: var arr = new Array ( 5 ), 时间对象: var date = new Date()

函数前面带上new关键字,是构造函数的外在表现

1         function CreateObj( uName ){ 2             this.userName= uName; 3             this.showUserName = function(){ 4                 return this.userName; 5             } 6         } 7         var obj1 = new CreateObj( 'ghostwu' ); 8         var obj2 = new CreateObj( '卫庄' ); 9 10         console.log( obj1.showUserName() ); //ghostwu11         console.log( obj2.showUserName() ); //卫庄

首先,明确几个事实:

  • 任何函数前面都可以用new关键字

  • 如果用了new关键字, 函数中的this指向的是 创建出来的对象, obj1造出来的时候,this指向的就是obj1,

    obj2造出来的时候,this指向的就是obj2.

  • 构造函数把属性和方法直接赋值给this, 不需要创建一个对象( new Object() )

  • 构造函数会自动return this

  • 每new一个函数, 就会在内存中,生成一个独立的内存区域,用来存储当前的对象,以及对象上面的方法和属性

    图片描述

如果构造函数前面不用new去掉用,函数中的this指向的是window, 相当于给window加属性和方法,函数没有返回值,就是undefined

obj1 = CreateObj( 'ghostwu' );

obj2 = CreateObj( '卫庄' );

console.log( obj1 ); //undefined

console.log( obj2 ); //undefined

那向下面这样调用,就会报错

console.log( obj1.showUserName() ); //报错
console.log( obj2.showUserName() ); //报错

因为obj1和obj2都是undefined,showUserName被加到windows对象上了

转载地址:http://bkdfo.baihongyu.com/

你可能感兴趣的文章
使用Spring Cloud和Docker构建微服务
查看>>
NB-IoT的成功商用不是一蹴而就
查看>>
九州云实战人员为您揭秘成功部署OpenStack几大要点
查看>>
1.电子商务支付方式有哪些 2.比较不同支付方式的优势劣势
查看>>
医疗卫生系统被爆漏洞,7亿公民信息泄露……
查看>>
神秘函件引发的4G+与全网通的较量
查看>>
CloudCC:智能CRM究竟能否成为下一个行业风口?
查看>>
追求绿色数据中心
查看>>
Web开发初学指南
查看>>
探寻光存储没落的真正原因
查看>>
高通64位ARMv8系列服务器芯片商标命名:Centriq
查看>>
中国人工智能学会通讯——融合经济学原理的个性化推荐 1.1 互联网经济系统的基本问题...
查看>>
戴尔为保护数据安全 推出新款服务器PowerEdge T30
查看>>
今年以来硅晶圆涨幅约达40%
查看>>
构建智能的新一代网络——专访Mellanox市场部副总裁 Gilad Shainer
查看>>
《数字视频和高清:算法和接口》一导读
查看>>
《中国人工智能学会通讯》——6.6 实体消歧技术研究
查看>>
如何在Windows查看端口占用情况及查杀进程
查看>>
云存储应用Upthere获7700万美元股权债务融资
查看>>
国家互联网应急中心何世平博士主题演讲
查看>>