http://www.cnblogs.com/54td/p/5580994.htm

  

先是有了这个比较简短但是内容比较丰盈的上篇,现在时间比较充沛,所以详细写来。搞前端的同学经常被其他程序员bs,做的工作简单,且只了解一门js,虽然现在前端确实更胜从前,但依旧有老顽固程序猿bs我们的地位,所以晓得一些其他语言也就显得迫在眉睫了,so文章开始以前我们也来探讨下其他的oop语言,顺便对比下其他oop语言和js的异同,哪怕旨在于了解,我们也是了解了,哈哈,休得鄙视。。。。 mdzz。。。。

絮叨

  

  学习js的很多小伙伴都是已经有了其他高级语言的基础,所以开头我们先来说下传统面向对象语言的一些特性,然后我们再来聊js这门 函数式面向对象语言。
  传统面向对象语言有这么三大特性,分别是 封装、继承、多态。何为封装?就是装箱呗,把不为人知的秘密隐藏起来;何为继承?就是子承父业呗,拿来主义坐享其成;何为多态?就是一种事物的多种状态呗,物理中学的固液气是也,其本质就是同一个事物,但其却在不同的情境下可以拥有多重身份,正如某本书中所述:“oop程序的世界是民主制的,封装使得公民拥有了个体身份,继承使得公民拥有了家庭的身份,多态使得公民拥有了社会身份”。
  下面我们先来分析下传统的面向对象语言,为我们以后能更好的学习js铺桥搭路。

传统面向对象语言

1.封装

  好了,看完生活中的类比,我们来看专业一点的释义,请看如下java伪代码

class Student{

    //封装私有变量
private int name; //定义一个公有方法
public void eat(){
System.out.println("eating....");
} //name属性的专有getter/setter方法
public int getName(name){
rerurn this.name;
}
public void setName(name){
this.name=name;
}

如上代码所示,在一些高级语言中我们用关键字 class 来描述一个类,而我们最常说的就是封装一个类/一个方法或函数,其他oop语言是封装了一个类,而js铁定就是封装了一个函数呗!那什么叫封装一个类呢?我们可以简单理解为 把属性和方法集合在一起就是封装了类,方法和函数异同,我们知道在最新的ES6中也出现了类似语法糖的class关键字,看了上面的我们可以这样理解: 在我们开发中通常会把属性定义为私有的,因为大家更愿意去用getter/setter方法去访问和修改这个属性,也就是属性通常需要对外隐藏起来,而方法是需要对外公共出来提供服务滴,所以也就是有了private属性和public方法咯。综上所述我们可得如下总结

类或者函数可以理解为一个模具,里边封装了无数的方法(函数)和属性(成员、变量、字段)

备注:纵观语言进化史有机器语言,面向过程类型的语言,面向对象类型的语言。
1 在面向过程语言中我们的方法称之为函数,我们的属性称之为成员
2 在面向对象语言中,我们就用方法和属性来称呼这两个事物
而字段是出现在数据库中的概念,这里我们也可以形象的理解为其是对属性的一个别称,而变量在低高级语言中都会出现,其一般用在类和方法外。以上名词是我们在学习中会遇到但又经常混淆乱用的词汇,虽不知道也行,但我觉着还是通晓较好。

那么类有什么用呢?答:使用new关键字可以把类变成一个实例对象。比如我们上边定义的这个Student类,怎么变成一个对象呢?Student s = new Student(); 即可,s即为Student的一个实例对象,js也是如此这般生成使用new生成实例,但其内部机制会略显复杂。最后稍作总结,从这里我们可以得出传统面向对象语言是先有类才有实例对象滴,那js呢?

2.继承

  继承在其他语言中使用的是extends关键字,当然在es6中这个关键字也被提上了日程,传统的oop语言继承多为单继承,如我们本文要说到的js(特指原型链继承)以及java和oc,当然除c++外。继承其实就是拿来主义,别人有的你若需要直接拿来用即可。js中的继承相较于其他语言实现方式灵活多样,且其他oop语言继承的实现是基于的继承,我们先来看下其他语言的继承,先构造一个Person和Student类,让Student类去继承Person类

//定义一个Person类

class Person{
//定义一个方法,打印一句话
public void say(){
System.out.println("人在say。。。。");
}
}

继承的实现:

//定义Student类并使用extneds关键字继承Person类

class Student extends Person{
//定义一个eat方法
public void eat(){
System.out.println("eating....");
} }

需要注意的是,其他oop语言是在封装类的时候就需要指定继承了,而我们的js却不是这样滴。有了如上的操作当我们再次new Student的时候在Student的实例中就可以使用Say()这个方法了,他是哪里来的?答案,从Person中继承来的,这就是继承的妙处“代码复用”,具体的js继承,在下文我们会说到。

3.多态

  多态在js中提到的较为少,甚至有些程序猿就说js中没有多态,非也。首先我们先来找传统oop和js的共同点,大家注意我的书写顺序咯。封装->继承->多态,yes你懂了,他们三个是线性渐进滴,也就是可以理解为有了封装,才有了继承,有了继承才会出现多态咯?对,就要这么理解。。。没有封装一个类,你怎么用类去继承?多态有一句话我一直奉为经典,记住了也就会用了,多态如何体现在代码上呢?父类的引用,子类的实例,那么多态转换到生活中该如何理解尼?答曰:一种事物的多种状态,额!举个栗子,换成其他oop伪代码,多态是这么体现的

//定义一个父类Person
class Person{
public void who(){
System.out.println("Person");
}
} //定义一个父类Student并且继承Person
class Student extends Person{
public void who(){
System.out.println("Student");
}
} //定义一个父类Work并且继承Person
class Work extends Person{
public void who(){
System.out.println("Work");
}
} 分别生成实例对象,多态的代码体现:父类的引用,子类的实例
Person p1 = new Student();
Person p2 = new Work(); p1.who()//输出Student
p2.who()//输出Work

代码所示,父类Person和继承Person的子类Student以及Work,这三个类中都有一个who的方法,但输出不同,我们使用子类的构造器(Student和Work)生成父类的对象(p1和p2),最后再调用who这个方法,程序会自动执行分属于p1和p2子类中的相应方法,也就是说方法是父类调用的方法,但是执行者确是子类,顺一下,工人也是人的一种,学生异同,他们是人多种状态下的不同表现,具体功能不同但却都是人,所以多态就是系统在知道你有多种状态的情况下,只要你给一个最大的状态,其就能根据你具体的状态去很好的识别你。

  概念我们先缕到这里,此刻如果我让你写一个js多态的例子,你能写出来码?答案肯定是否定的,但是思路一定是有了,先搞一个函数类,在搞一个继承关系你再和我聊多态吧~哦了,有这个觉悟我觉着咱暂时就够了。

三言两语之js面向对象初探1的更多相关文章

  1. js面向对象学习 - 对象概念及创建对象

    原文地址:js面向对象学习笔记 一.对象概念 对象是什么?对象是“无序属性的集合,其属性可以包括基本值,对象或者函数”.也就是一组名值对的无序集合. 对象的特性(不可直接访问),也就是属性包含两种,数 ...

  2. 带你一分钟理解闭包--js面向对象编程

    上一篇<简单粗暴地理解js原型链--js面向对象编程>没想到能攒到这么多赞,实属意外.分享是个好事情,尤其是分享自己的学习感悟.所以网上关于原型链.闭包.作用域等文章多如牛毛,很多文章写得 ...

  3. JS面向对象(3) -- Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法

    相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...

  4. JS面向对象(2) -- this的使用,对象之间的赋值,for...in语句,delete使用,成员方法,json对象的使用,prototype的使用,原型继承与原型链

    相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...

  5. JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式

    相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...

  6. js面向对象的实现(example 二)

    //这个方法和上篇文章(js面向对象的实现(example 一))中的方法类似,但是更为简洁 //通过函数赋值的方式来构造对象 //同样通过闭包的方式来封装对象及内部变量 (function () { ...

  7. 浅谈JS面向对象之创建对象

    hello,everybody,今天要探讨的问题是JS面向对象,其实面向对象呢呢,一般是在大型项目上会采用,不过了解它对我们理解JS语言有很大的意义. 首先什么是面向对象编程(oop),就是用对象的思 ...

  8. js面向对象,有利于复用

    需求:在网页上添加个天气预报. 以前总是在需要执行js的地方,直接写function(){}.在需要同样功能的地方直接copy,或者稍微修改. 然后在网上看看有没有好点的方法,然后就看到js面向对象编 ...

  9. JavaScript基础精华02(函数声明,arguments对象,匿名函数,JS面向对象基础)

    函数声明 JavaScript中声明函数的方式:(无需声明返回值类型) function add(i1, i2) {             return i1 + i2;//如果不写return返回 ...

随机推荐

  1. bzoj 1014 splay维护hash值

    被后缀三人组虐了一下午,写道水题愉悦身心. 题很裸,求lcq时二分下答案就行了,写的不优美会被卡时. (写题时精神恍惚,不知不觉写了快两百行...竟然调都没调就A了...我还是继续看后缀自动机吧... ...

  2. 前端Javascript框架收集

    1.AngularJS 2.React 3.vue.js 4.JQuery 5.Zepto.js 6.Require.js 7.sea.js 8.backbone.js 9.Meteor.js 10. ...

  3. js cookie 数组 存读

    自己研究了一下. "Cookie里面只能放String 类型" 所以只能将arr的数据按照自己的约定转成string格式存进cookie. 这里提示一下cookie是存在本地浏览器 ...

  4. miniui后台无法接收到input传值

    出错原因:在miniui中,此处应写成<input textName="current_unit",在php中才可以使用$_POST['current_unit']获取到值, ...

  5. 聊聊HTTPS和SSL/TLS协议

    要说清楚 HTTPS 协议的实现原理,至少需要如下几个背景知识.1. 大致了解几个基本术语(HTTPS.SSL.TLS)的含义2. 大致了解 HTTP 和 TCP 的关系(尤其是“短连接”VS“长连接 ...

  6. POJ3249:Test for Job

    传送门 很简单的一道题,被卡了几次,死于答案非法统计. 题意是求图里的一条最长的路径满足起点的入度和终点的出度都是0,而且图是DAG. 既然是DAG求最长路,DP即可.搞出拓扑序,逆序DP,然后统计所 ...

  7. HTML5本地存储——IndexedDB(一:基本使用)

    在HTML5本地存储——Web SQL Database提到过Web SQL Database实际上已经被废弃,而HTML5的支持的本地存储实际上变成了 Web Storage(Local Stora ...

  8. Canvas绘制图形

    1.Canvas绘制一个蓝色的矩形 <!DOCTYPE html> <html> <head lang="en"> <meta chars ...

  9. System.Properties和System.getenv区别

    网上很多使用的是getProperties.说获得系统变量,但是其实不正确.getProperties中所谓的"system properties"其实是指"java s ...

  10. tomcat乱码原因--基本的编码问题

    tomcat乱码原因:在学习servlet时候,经常会遇到中文乱码的问题,网上查只知道如何设置不乱码,其中的原理不是很明白.我认为明白其中的原理,乱码问题就很容易解决 tomcat乱码解决方法: po ...