JavaScript面向对象——封装及相关原理解析
《JavaScript设计模式》面向对象编程——封装及相关原理解析
说明:本人编写js习惯不写分号;文章中的源码可根据自己的编程风格修改。
面向对象
面向对象编程就是将你的需求抽象成一个对象,然后针对这个对象分析其特征(属性)与动作(方法),学过C++、Java等语言的伙伴应该比较好理解。
封装
1:创建一个类
方法:
声明一个函数保存在一个变量里,风格上一般开头大写,然后在这个函数(类)的内部通过this(函数内部自带的一个变量,用于指向当前这个对象)变量添加属性或者方法来实现对类添加属性或者方法
var College = function (id, name, address) {this.id = idthis.name = namethis.address = address}
这个类其实也可以写成function College (),所以是有prototype属性的,也可通过原型prototype添加属性和方法。
College.prototype.showInfo = function () {console.log('showInfo')}或者College.prototype = {showInfo: function () {console.log('showInfo')}}
使用:
至今,我们已经把需要的方法和属性都封装到College类里边,使用时需要使用new关键字实例化(创建)新的对象,并通过该对象调用属性或者方法。
var haida = new College(1, 'gdou', '广东省湛江市')console.log(haida.address)
运行结果:
问题:this添加的属性和方法与通过prototype添加的属性和方法有什么不同?
问题解答:每当我们new一个对象时,this添加的属性和方法都会重新创建一次;而通过prototype添加的方法不会重新创建,使用一个对象调用一个非this定义的属性或者函数时,需要通过原型来查找,比如:
var haida = new College(1, 'gdou', '广东省湛江市')haida.showInfo()
最后之所以能打印出showInfo,是因为新创建的对象会包含__proto__属性,实行到haida.showInfo()时,this中没有这个方法的话,就会通过__proto__来查找,因为新创建的对象的__proto__指向的是类prototype所在的对象,而该方法正是定义在类的prototype上,所以haida.showInfo()其实也可以写成haida.__proto__.showInfo(),运行结果一样。
2:属性与方法的封装
JavaScript的面向对象中如何实现私有属性、公有属性、公有方法等?
举个例子:
function College(id, name, address) {// 私有属性let num = 1// 私有方法function checkId() {}// 特权方法this.setName = function () {}this.getName = function () {}this.setAddress = function () {}this.getAddress = function () {}// 对象公有属性this.id = id// 对象公有方法this.copy = function () {}// 构造器this.setName(name)this.setAddress(address)}
解释:当使用new关键字创建一个对象时,由于对类执行一次,所以类的内部this上定义的属性和方法自然就可以复制到新建的对象上,成为对象公有的属性和方法;而其中一些方法能访问到类的私有属性和方法,所以成为特权方法。通过new关键字创建的对象实质上是对新对象this的不断赋值,并将新创建的对象的prototype指向类的prototype。
// 类静态公有属性(对象不能访问)College.inChina = true// 类静态公有方法(对象不能访问)College.resetTime = function () {console.log('new Time')}College.prototype = {// 公有属性isHaida: false,// 公有方法display: function () {}}
类静态公有属性字可以通过类自身访问,比如:Console.log(College.inChina) // true
3:创建对象的安全模式
假设书写方式如下:
var College = function (id, name, address) {this.id = idthis.name = namethis.address = address}var haida = College(1, 'haida', '广东省湛江市')
也就是实例化是忘了写new,会怎样?
console.log(haida.address),发现会报undefined错误,再console.log(window.address),发现会是'广东省湛江市'。
为什么呢?
答:new关键字的作用可以看做是当前对象的this不停地赋值,没有new的话,只相当于调用了College函数,函数中的this此时指向的是window,所以值都被赋到window对象上去了。
安全模式登场:(这次忘记写new也没问题了)
var College = function (id, name, address) {// 检测this是否是当前这个对象(是的话证明是通过new创建的),不是的话重新创建一个if (this instanceof College) {this.id = idthis.name = namethis.address = address} else {return new College(id, name, address)}}
测试:
var haida = College(1, 'haida', '广东省湛江市')
console.log(haida.address)
再也不用担心粗心忘记new造成的问题。
水文完结。看场NBA压压惊(雷霆VS快船)#周六#
JavaScript面向对象——封装及相关原理解析相关推荐
- javascript面向对象包装类Class的类库解析
javascript是个入门门槛很低的语言,甚至一个从来没有接触过javascript的技术人员,几小时内就可以写出一个简单有用的程序代码. 但是如果因此你就下结论:javascript是门简单的语言 ...
- JavaScript面向对象--封装
一.封装的概念 面向对象的类包括两大成员,一种是暴露给外部的接口,另一种是只在类内部才能访问的私有属性.在这个类被实例化成对象后,用户只能通过操作给定的接口来访问该类内部的私有属性,这就被称为面向对象 ...
- Unity Shader:实现菲涅尔+色散效果的环境映射以及相关原理解析
文章目录 1,色散在光学中的原理 2,反射的数学计算方法以及用它实现环境映射 3,折射的原理以及色散的实现 4,菲涅尔效果 5,拥有菲涅尔与色散效果的环境映射 1,色散在光学中的原理 复色光 --现实 ...
- 高性能JavaScript模板引擎template.js原理解析
点击有惊喜 artTemplate是新一代javascript模板引擎,它在v8中的渲染效率可接近javascript性能极限,在chrome下渲染效率测试中分别是知名引擎Mustache与micro ...
- python类的继承super方法_Python类的继承super相关原理解析
看了网上许多关于super.mro.C3的介绍感觉没有一份很容易初学者理解的文档,直接看C3算法的话,比较难理解,也没必要,如果掌握一套规律的话,会轻松许多.我将网上这些博主的文章进行一个梳理总结,最 ...
- 使用Javascript无限添加QQ好友原理解析
做QQ营销的朋友都知道,QQ加好友是有诸多限制的,IP限制,次数限制,二维码限制,人数限制,使用软件自动加好友会遇到各种各样的问题,很多软件通过模拟人工添加QQ号码,在添加几个之后就会遇到腾讯规则限制 ...
- Unity Shader:实现菲涅尔+色散效果以及相关原理解析
1,色散在光学中的原理 2,反射的原理以及环境映射的实现 3,折射的原理以及色散的实现 4,菲涅尔效果 5,将菲涅尔与色散效果增加到环境映射中 1,色散在光学中的原理 复色光 --现实生活中 ...
- JavaScript面向对象-封装
文章目录 1.封装的概述 2.代码展示 3.效果展示 1.封装的概述 封装:将代码放到同一个地方,方便后续的多次使用. 好处:可以优化代码,减少代码的重复性(冗余). 生活例子:将所有的菜放在冰箱里, ...
- java 引用队列_Java中管理资源的引用队列相关原理解析
当对象改变其可达性状态时,对该对象的引用就可能会被置于引用队列(reference queue)中.这些队列被垃圾回收器用来与我们的代码沟通有关对象可达性变化的情况.这些队列是探测可达性变化的最佳方式 ...
最新文章
- hdu3951-(Coin Game)
- SigmaStar SSD201 开源记录
- netty系列之:Event、Handler和Pipeline
- python组合函数_Python---函数---参数组合
- MyEclipse使用总结——MyEclipse文件查找技巧 ctrl+shift+R ctrl+H
- project不显示里程碑标志_3万台!纽荷兰大方捆打捆机再创全新里程碑
- java createchannel_【原创】java NIO FileChannel 学习笔记 新建一个FileChannel
- fastjson jsonobject 转bean失败_干掉quot;FastJsonquot;?
- Mac下docker安装kali/ubuntu14.04
- 采用RedisLive监控Redis服务
- 微信公众平台高级群发接口
- 完美者常用软件光盘2008
- 基础篇:6.7)形位公差-基本规则 Basic Rules
- 用Python自制一个百度一下,这操作可还行
- 华为路由器--帧中继
- 橘子娱乐完成华创资本千万美元B+轮融资
- 【NLP基础理论】10 上下文表示(Contextual Representation)
- 多进程log4j日志丢失问题分析
- 这是个转贴,QB教程,很不错
- Deep Face Super-Resolution with Iterative Collaboration论文阅读笔记