我在学习JS的面向对象编程的时候，总是有两个奇怪的问题。

第一个就是：面向对象在JS中很少用到。。。

可能是目前自己做的项目还是比较简单，前端方面的任务我几乎都是用面向过程的方式写的，所以就导致，我啃了那么久的书，代码也跟着书上的例子敲了，但好像一点收获也没有，还是不知道JS的面向对象有什么用。当然，我知道是自己目光短浅。。因为JS可是像个单身很久的家伙一样一直强调“万物皆对象”的！

第二个是：prototype 这个鬼。。。

刚开始学面向对象的时候，我仗着自己JAVA底子还不错，直接就去找了一个JS面向对象的实例去看。当然，看完就懵逼了....

然后啃书 《JavaScript高级程序设计》，看完之后彻底蒙圈。。。prototype这个鬼到底是什么鬼啊。

所以，今天去看了教学视频，感觉从视频中还是学习到了一部分经验，就来记录一下，为以后进一步研究打个基础。

首先，先说说 prototype 这个家伙。他有个很常见的称呼——原型。当初就是因为这个名字把我带进了坑里，直接导致我的学习目标变成了“我要知道原型到底是个什么鬼”。其实原型有个很好的理解方法，这是我今天在视频中学到的。

如果你要对CSS有一定的了解，那我们可以把原型看做是CSS样式中的类（class）,而通过构造函数new出来的对象就像是文档中引用了这个类的元素。

因为有相同class的元素，他们的样式都相同，要写让他们其中若干个产生变化，那我们一般都会采取 行间样式（style）这种方式来修改，让他们体现不同，利用这样的特性我们可以把属性就理解成元素的行间样式。

这样理解的话会不会容易一点？反正我是有种被点化的感觉..通过这样的方式，写一个简单的面向对象的例子：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script>

        function Person(name){

            this.name = name;

        };

        Person.prototype.sayHello = function (){

            console.log(this.name +" say hello~");

        }

        var tom = new Person('tom');

        var jerry = new Person('jerry');

        tom.sayHello();

        jerry.sayHello();

    </script>

</head>

<body>

</body>

</html>

这样就有一点面向对象的意思了，当你运行程序  就会 看到 效果。

最后，总结一下这个简单的面向对象的方法：

构造函数加属性，原型prototype加方法，这样就实现了JS的面向对象。

以上就是我对JS面向对象的初步认识。

2015.12.29

JavaScript 中的面向对象的初步认识的更多相关文章

  1. 前端开发：面向对象与javascript中的面向对象实现（二）构造函数与原型

    前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型 前言(题外话): 有人说拖延症是一个绝症,哎呀治不好了.先不说这是一个每个人都多多少少会有的,也不管它究竟对生活有多么大的 ...

  2. 简单分析JavaScript中的面向对象

    初学JavaScript的时候有人会认为JavaScript不是一门面向对象的语言,因为JS是没有类的概念的,但是这并不代表JavaScript没有对象的存在,而且JavaScript也提供了其它的方 ...

  3. 前端开发：面向对象与javascript中的面向对象实现（一）

    前端开发:面向对象与javascript中的面向对象实现(一) 前言: 人生在世,这找不到对象是万万不行的.咱们生活中,找不到对象要挨骂,代码里也一样.朋友问我说:“嘿,在干嘛呢......”,我:“ ...

  4. JavaScript从初见到热恋之深度讨论JavaScript中的面向对象。

    JavaScript中的面向对象.面向对象的三个基本特征:封装.继承.多态. 1.封装 js的封装如下 定义Person类 function Person(name,age,sex) { this.n ...

  5. 如何理解并学习javascript中的面向对象（OOP） [转]

    如果你想让你的javascript代码变得更加优美,性能更加卓越.或者,你想像jQuery的作者一样,写出属于自己优秀的类库(哪怕是基于 jquery的插件).那么,你请务必要学习javascript ...

  6. 前端开发：javascript中的面向对象

    前端开发:面向对象与javascript中的面向对象实现(一) 面向对象理解: 面向对象是一种对现实世界理解和抽象的方法,是一种先进的程序设计理念,是一种比较抽象的,多形态的设计模式.我们可以这么理解 ...

  7. 深入理解javascript中实现面向对象编程方法

    介绍Javascript中面向对象编程思想之前,需要对以下几个概念有了解: 1. 浅拷贝和深拷贝:程序在运行过程中使用的变量有在栈上的变量和在堆上的变量,在对象或者变量的赋值操作过程中,大多数情况先是 ...

  8. JavaScript中的面向对象的讨论(转)

    前言 今天,WEB2.0时代的到来,给了JavaScript又一次大展身手的机会.Web2.0借助JavaScript技术,使得客户端的Web体验更加丰富多彩,同时JavaScript面对的问题域也变 ...

  9. JavaScript中的面向对象程序设计

    本文内容目录顺序: 1.Object概念讲述: 2.面向对象程序设计特点: 3.JavaScript中类和实例对象的创建: 4.原型概念: 5.原型API: 6.原型对象的具体使用:7.深入理解使用原 ...

随机推荐

  1. html类，id规范命名

    DIV+CSS的命名规则 SEO(搜索引擎优化)有很多工作要做,其中对代码的优化是一个很关键的步骤.为了更加符合SEO的规范,下面中部IT网将对目前流行的CSS+DIV的命名规则整理如下: 页头:he ...

  2. [置顶] Codeforces Round #190 (Div. 2)(完全)

    好久没有写博客了,一直找不到有意义的题可以写,这次也不算多么有意义,只是今天是比较空的一天,趁这个时候写一写. A. B. 有一点贪心,先把每个拿去3的倍数,余下0或1或2,然后三个一起拿. 对于以上 ...

  3. ER 和 数据库关系模式

    http://lianghuanyue123.blog.163.com/blog/static/130423244201162011850600/ 我们眼下所接触的数据库基本上是关系数据库,关系数据库 ...

  4. JVM系列文章(三):Class文件内容解析

    作为一个程序猿,只知道怎么用是远远不够的.起码,你须要知道为什么能够这么用.即我们所谓底层的东西. 那究竟什么是底层呢?我认为这不能一概而论.以我如今的知识水平而言:对于Web开发人员,TCP/IP. ...

  5. 获取oracle sql语句中绑定变量值的方法

    在诊断 sql的性能问题时,我们有时候须要获取其绑定变量的实际值,然后将此实际值带入到sql语句其中,用原来的sql构成select语句(带where条件),实际的运行一下,看一下选择性怎样. 本文就 ...

  6. 【贪心】【TOJ4107】【A simple problem】

    Given three integers n(1≤n≤1018), m(1≤m≤105), k(1≤k≤1018). you should find a list of integer A1,A2,- ...

  7. solr4.5分组查询、统计功能介绍

    说到分组统计估计大家都不会陌生,就是数据库的group by语句,但是当我们采用solr4.5全文检索时,数据库提供再好的sql语句都没有任何的意义了,那么在solr4.5中我们如何做到分组统计呢?其 ...

  8. CSS实例：水平居中和垂直居中的多种解决方案

    1.单行垂直居中 文字在层中垂直居中vertical-align 属性是做不到的.我们这里有个比较巧妙的方法就是:设置height的高度与line-height的高度相同! Example Sourc ...

  9. linux 日志查看总结

    1 grep "ERROR" catalina.log -a 20 -b 10 查看 catalina.log 中error的唯一 一行的后20行 前10行这种情况一般要唯一确定. ...

  10. java整体集合框架

    1.关于集合的两道面试题 先来看几道题目: 1.创建一个不可变的的集合: public static void main(String[] args) { Set<String> set ...