js面对对象编程(二):属性和闭包
上篇博客中解说了一些js对象的基本概念和使用方法。这篇博客解说一下js属性方面的:公有属性。私有属性,特权方法。
假设学过java。公有属性。私有属性,特权方法(即能够訪问和设置私有属性的方法)一定非常熟悉。那么让我们来看看在js里怎样实现呢?
1、公有属性
首先看公有的第一层意思是能够被大家所訪问的。对外开放的属性,是相对于私有属性而言的:
function Person(name,age){
this.name=name;
this.age=age;
this.getName=function(){
return this.name;
}
this.getAge=function(){
return this.age;
}
}
var josh=new Person('josh','25')
console.log(josh.name); //josh
console.log(josh.getName()); //josh
我们在这里定义了一个叫josh的Person对象,让我们通过new方法再创建2个其它Person对象
var Eric=new Person('Eric','25');
var mongo=new Person('mongo','23');
console.log(Eric.name); //Eric
console.log(mongo.name); //monge
这里我们每次new一个对象的时候。Person中全部的代码都会复制一份,便造成了内存的浪费。能够通过定义同一类对象共同拥有的方法来解决问题。因此在这里须要prototypekeyword来我们。
从字面上来看。prototype能够理解为"property to type",即类型的属性。对于一类的属性。拿上面定义的Person来说。即对Person这一类对象共同拥有的方法或属性。我们改造一下上面的代码
function Person(name,age){
this.name=name;
this.age=age;
}
Person.prototype.getName=function(){
return this.name;
}
Person.prototype.getAge=function(){
return this.age;
}
var josh=new Person('josh','25')
var Eric=new Person('Eric','25');
var mongo=new Person('mongo','23');
console.log(josh.getName()); //josh
console.log(Eric.name); //Eric
console.log(mongo.name); //monge
因此公有方法或属性,也能够理解为通过构造函数的prototype加入的方法或属性,这里的构造函数即Person。由于js中不存在类的概念,所以我们通过构造函数来创建新的对象,而通过prototype定义的属性方法。为这一类所共享,像极了java中类里的静态方法或属性为一类所共享。
2、私有属性
基于面对对象的封装特性。我们并不想把全部变量都公开给外界,于是拿上面的Person对象来说,我们把属性定义中的this.name被换成了var name。于是能够被外界訪问的公有属性就变成了私有属性,对于属性的訪问结果也变成了undefined
function Person(name,age){
//this.name被换成了var name
var name=name;
var age=age;
}
var josh=new Person('josh','25')
var Eric=new Person('Eric','25');
var mongo=new Person('mongo','23');
console.log(josh.name); //undefined
console.log(Eric.name); //undefined
console.log(mongo.name); //undefined
为什么this.name被换成了var name,对象属性就由公有变私有了呢?首先看thiskeyword。this表示当前属性所存在的对象:
function Person(name,age){
this.name=name;
this.age=age;
}
上面这段代码换成了以下这段,您就能够看明确了,即首先定义一个Person空构造函数,然后定义person对象,再依据person动态增减属性的特性添加name和age属性
function Person(){
}
var person=new Person();
person.name='josh';
person.age='25';
那么换成var name的私有属性又是怎样实现的呢?这里就要设计js面对对象的几个重要基础概念了,各自是 作用域,上下文,闭包。
首先说作用域。大家假设接触过一门编程语言就应该有了解,作用域是当前定义的变量能够再什么样的范围内被引用。拿大家比較比較熟悉的java来说。java是块级的,在if、while这些块中定义的。仅仅能在块里用。出了块就不行了;假设想范围大一些。能够在方法的開始定义,供整个方法是用。但在方法外不能被是用;也能够定义类级的,在整个类内都能引用。
在js中,作用域是函数级的。也就是在函数内定义的变量。在函数外不可引用,函数起到了界定作用域的作用。上文的这个样例中,对于josh.name属性的訪问就变成了undefined。
function Person(name,age){
//this.name被换成了var name
var name=name;
var age=age;
}
var josh=new Person('josh','25');
console.log(josh.name); //undefined
接下来解释上下文。上下文表明了函数或者对象处在的环境,这个环境中包括了一些变量。对象或者函数。结合作用域的概念一起看一张图
对着这张图来说,person对象能够訪问上下文中的变量,对象或者是函数,而上下文中的变量不能訪问Person对象的name属性。由于name属性的作用域是局限在person对象内的,也就是外层对内层开放,内层对外层关闭。
那么由此就衍生出了闭包的概念,闭包就是一个封闭的包,能拒绝外层的訪问,上图person对象就是一个闭包,包外不能訪问包内私有的变量,仅仅能通过某些特殊方式(特权方法)来訪问。接下来介绍下特权方法。
3、特权方法
特权方法相当于java类中对私有变量提供訪问和设置的get/set方法
function Person(){
//在私有属性前加下划线。表示私有属性
var _name;
var _age;
this.getName=function(){
return _name;
}
this.getAge=function(){
return _age;
}
this.setName=function(name){
_name=name;
}
this.setAge=function(age){
_age=age;
}
}
var josh=new Person();
josh.setName('josh');
josh.setAge('25');
console.log(josh.getName());
console.log(josh.getAge());
到此。共同拥有属性,私有属性,闭包的概念就讲完了,本篇博客用非常小的篇幅将了闭包这个概念,但却说明了闭包最根本的实质,函数所处的上下文没有权利訪问函数内定义的变量。于是就形成了闭包(一个封闭的包)。大家有了这个概念,再看闭包的文章,一定会非常受用。
js面对对象编程(二):属性和闭包的更多相关文章
- js面对对象编程
说到js,非常大一部分人会说我非常熟悉,在日常的web开发中经经常使用,那么你的js代码是符合面对对象思路的吗?那你会问我面向过程的js代码有什么不好吗?我的感受是面对对象的js编码更加简洁,降低了混 ...
- 对js 面对对象编程的一些简单的理解
由简单开始深入: 最简单的 直接对象开始 var desen = { age:24, name:'xyf', job:'fontEnd', getName:function(){ console.lo ...
- 面对对象编程(OOP, Object Oriented Programming)及其三个基本特性
一千个读者,一千个哈姆雷特.对于面对对象编程,书上都会告诉我们它有三个基本特性,封装,继承,多态,但谈起对这三点的见解,又是仁者见仁智者见智,感觉还是得多去编程中体验把 . 面向对象编程(OOP, O ...
- python面对对象编程----2:__init__
面对对象编程估计我们最早接触到的就是__init__了,也就是实例的初始化处理过程: 1:来看看最基础的__init__ class Card(object): #抽象类Card,并不用于实例化 de ...
- Python学习6——再谈抽象(面对对象编程)
1.对象魔法 在面对对象编程中,术语对象大致意味着一系列数据(属性)以及一套访问和操作这些数据的方法. 使用对象而非全局变量以及函数的原因有多个,而最重要的好处不过以下几点: 多态:可对不同类型的对象 ...
- C++ 基础语法 快速复习笔记---面对对象编程(2)
1.C++面对对象编程: a.定义: 类定义是以关键字 class 开头,后跟类的名称.类的主体是包含在一对花括号中.类定义后必须跟着一个分号或一个声明列表. 关键字 public 确定了类成员的访问 ...
- Day-8: 面对对象编程
面对过程的程序设计方法意在将函数分成子函数,再依次调用这些函数来解决问题. 而面对对象的程序设计方法,来源于自然界,类是实例的抽象,实例是类的具体.自定义出来的对象是类,而所有的数据都可以看成是对象, ...
- javascript面对对象编程 之继承
上一篇博客中为大家介绍了javascript面向对象编程原则的封装,今天为大家介绍继承.在javascript中没有类的概念,全部不能像c#.java语言那样.直接的用类去继承类.比方如今有比方.如今 ...
- go 学习笔记之go是不是面向对象语言是否支持面对对象编程?
面向对象编程风格深受广大开发者喜欢,尤其是以 C++, Java 为典型代表的编程语言大行其道,十分流行! 有意思的是这两中语言几乎毫无意外都来源于 C 语言,却不同于 C 的面向过程编程,这种面向对 ...
随机推荐
- 用MVC5+EF6+WebApi 做一个小功能(四) 项目分层功能以及文件夹命名
在上一节,我们完成了一个项目搭建,我们看到的是一个项目的分层架子,那接下来每一层做什么以及需要引用哪些内容呢?在本节内容我们还逐步拆分每一层的功能,顺带添加package包 Trump.Domain ...
- JS DOM 操作 项目总结 【超链接】【数列】【span】
超链接 每次定义链接样式时务必确认定义的顺序,link--visited--hover-active,也就是我们常说到的LoVe HAte原则(大写字母就是它们的首字母). “爱恨原则”(Lo ...
- java - 线程等待与唤醒
Java多线程系列--“基础篇”05之 线程等待与唤醒 概要 本章,会对线程等待/唤醒方法进行介绍.涉及到的内容包括:1. wait(), notify(), notifyAll()等方法介绍2. w ...
- HDU2157(SummerTrainingDay05-F dp)
How many ways?? Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)T ...
- DVWA的安装
DVWA(Dam Vulnerable Web Application)是基于PHP+Mysql的一套用于常规Web漏洞教学和检测Web脆弱性测试程序,包含了SQL注入,Xss,盲注等常用的一些安全漏 ...
- webstorm激活
选择 License server http://idea.imsxm.com/ http://idea.iteblog.com/key.php (2016.11.16) http://v2mc.ne ...
- crontab -让服务器执行定时任务
1.启动服务 一般启动服务用 "/sbin/service crond start"就可以了,如果是root用户就是 "sudo service crond start& ...
- 【代码笔记】iOS-去掉NSString中的空格
一,代码. - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, ...
- js相关判断
//正则表达式判断是否为空 /^\s*?$/.test(obj) //批量转换方法 function sort(s){return s.match(/\d/g).sort()+'' } //判断是否相 ...
- css3 content 特殊字符和符号
基本形状 ▲ 9650 25B2 ► 9658 25BA ► 9658 25BA ▼ 9660 25BC◄ 9668 25C4 ❤ 10084 2764 ✈ 9992 2708 ★ 9733 2605 ...