0x00:使用OOP技术,常常要使用许多的代码模块,每个模块都提供特定的功能,每个模块老师孤立的,甚至与其它的模块完全独立,这种模块化的编程方法大大的提供了代码实现的多样性,大大增加了代码的重用性。js并不是直接的oop语言,但是可以通过模拟的方式做到其它很多oop语言才能做到的事情,如继承、多态、封装(没有做不到,只有想不到)

0x01:对象的属性

对象的属性分为对象属性、私有属性 和类属性

对象属性:要创建对象后才能使用

私有属性:在内部就可以使用,在外部需要通过闭包才能使用

类属性可以通过对象名称直接使用

    function func(){
        this.objPro1 = "对象属性";
        func.prototype.objPro2 = "对象属性";
        var privatePro = "私有属性";
    }     func.classPor = "类属性";
    console.log(func.classPor);    
    var f = new func();
    console.log(f.objPro1);

console.log(f.objPro2);

结果如图 :

我们再访问一下私有属性试试看

console.log(f.privatePro);

结果如图:

在内部访问私用属性:

    function func(){
        this.objPro1 = "对象属性";
        func.prototype.objPro2 = "对象属性";
        var privatePro = "私有属性";
        this.getter = function(){
            return privatePro;
        }
    }     func.classPor = "类属性";
    var f = new func();

console.log(f.getter());

结果如图:

还有就是通过闭包的方式来取得私有变量

    function func(){
        this.objPro1 = "对象属性";
        func.prototype.objPro2 = "对象属性";
        var privatePro = "私有属性";
        this.getter = function(){
            return privatePro;
        }
        return function(){
            return privatePro;
        }
    }
    var fun = new func();

console.log(fun());

看结果:

0x02:对象方法

对象方法包括:对象方法、私有方法和类方法,使用类似 前面的属性

function demoClass(){

        //私有方法
        var privateMethod = function(){
            console.log("this is a private method");
        }         //属性方法
        this.objMethod = function(){
            console.log("this is a object method");
        }         demoClass.prototype.proMethod = function(){
            console.log("this is a object method too");
        }
    }     demoClass.classMethod = function(){
        console.log("this is class method");
    }     var f = new demoClass();
    f.objMethod();//调用属性方法
    f.proMethod();//调用属性方法

结果如图:

那我们再调用一下私有方法试一下:

f.privateMethod(); //调用私有方法

调用一下类方法:

f.classMethod();//调用类方法

demoClass.classMethod(); //调用类方法

总结:

1,对象方法是可以通过实例被调用的,无论是类内的属性方法或者是原型方法构造的属性方法。

2,类方法不能通过实例被调用,可以通过类名"."类方法()的模式调用。 类方法也叫静态方法

0x03:继承、封装、多态

js实现继承是通过 apply方法或者是通过prototype实现的,如果使用apply方法,子类的原型是子类,如果使用prototype,那么子类的原型也将继承父类。

    function fatherClass(name,age){
        this.name = name;
        this.age = age;
        this.say = function(){
            console.log(" the say method of father class");
        }
    }     function oneSon(name,age){
        fatherClass.apply(this,[name,age]);
    }     var objOneSon = new oneSon("oneSon",20);
    console.log(objOneSon.name);
    console.log(objOneSon.age);
    objOneSon.say();
    console.log(objOneSon instanceof fatherClass);

console.log(objOneSon instanceof oneSon);

结果如图:

如果使用prototype方法

    function fatherClass(name,age){
        this.name = name;
        this.age = age;
        this.say = function(){
            console.log(" the say method of father class");
        }
    }     function oneSon(name,age){
        fatherClass.apply(this,[name,age]);
    }
    oneSon.prototype = new fatherClass();
    var objOneSon = new oneSon("oneSon",20);
    console.log(objOneSon.name);
    console.log(objOneSon.age);
    objOneSon.say();
    console.log(objOneSon instanceof fatherClass);

console.log(objOneSon instanceof oneSon);

结果如图:

子类的方法会覆盖父类的方法,即表现的是多态性

    function fatherClass(name,age){
        this.name = name;
        this.age = age;
        this.say = function(){
            console.log(" the say method of father class");
        }
    }     function anotherSon(name,age){
        this.say = function(){
            console.log("i am anotherSon");
        }
    }     anotherSon.prototype = new fatherClass();     function threeSon(name,age){
        this.say = function(){
            console.log("i am threeSon");
        }
    }     threeSon.prototype = new fatherClass();     function yes_or_no(cls){
        if(cls instanceof fatherClass){
            cls.say();
        }
    }     var objanotherSon = new anotherSon();
    var objthreeSon = new threeSon();
    yes_or_no(objanotherSon);

yes_or_no(objthreeSon);

结果如图所示:

即实现了类的多态。

js面向对象的三大特性的更多相关文章

  1. js 面向对象的三大特性

    一.封装 所谓封装的概念,是不希望暴露函数中属性或者方法的地址,使外界不能操作,但是可以暴露特有的公有接口,可以利用接口操作. function hello(){ var name='xiaoming ...

  2. js 面向对象的三大特性:封装,继承、多态

    一:什么是封装? 封装的定义:就是对象内部的变化对外界是透明的,不可见的. 封装的场景: 在写项目的过程中,有时候不同页面,会有相同的功能,我们还需要每个页面都写一遍吗?额,,,,其实也可以写的,只不 ...

  3. JavaScript面向对象的三大特性

    1.JavaScript面向对象的三大特性 JavaScript的三大特性:封装性.继承性.多态性. 2.JavaScript实现封装特性 在一些静态类型的语言如java中,本身语法就提供了这些功能. ...

  4. JavaScript中面向对象的三大特性(一个菜鸟的不正经日常)

    经过几天的学习,把jQuery给啃会了,但是运用的还不算特别熟练,总感觉自己在JavaScript方面的基础十分欠缺,所以继续拾起JavaScript,开始更好的编程之旅~ 今天学的是JavaScri ...

  5. 谈谈Java面向对象的三大特性

    Java面向对象的三大特性就是指封装.继承.多态了. 一.封装: 概念:封装是指隐藏对象的属性和实现细节,仅对外提供公共访问方式. (举例:笔记本电脑就是一个封装体,Java语言中最小的封装体就是函数 ...

  6. oc语言--面向对象的三大特性

    一.封装 1.什么是封装 在程序上,隐藏对象的属性和实现细节,仅对外公开接口,控制在程序中属性的读和修改的访问级别:将对象得到的数据和行为(或功能)相结合,形成一个有机的整体,也就是将数据与操作数据的 ...

  7. OC面向对象的三大特性

    一.面向对象的三大特性:封装(成员变量).继承和多态 1. set方法和get方法 1. set方法和get方法的使用场合 @public的成员可以被随意赋值,应该使用set方法和get方法来管理成员 ...

  8. java基础笔记(6)----面向对象的三大特性

    简介:面向对象的三大特性就是封装,继承,多态,是面向对象的核心. 封装 简介:封装是类的边界,可以对数据起到保护作用 特性:属性私有,提供公开的get/set方法 属性私有:private 数据类型 ...

  9. C#基础知识之面向对象以及面向对象的三大特性

    在C#基础知识之类和结构体中我详细记录了类.类成员.重载.重写.继承等知识总结.这里就记录一下对面向对象和面向对象三大特性的广义理解. 一.理解面向对象 类是面向对象编程的基本单元,面向对象思想其实就 ...

随机推荐

  1. jQuery $.each用法比较详细了

    以下内容非原创,来自百度文库http://wenku.baidu.com/view/4796b6145f0e7cd18425368e.html 通过它,你可以遍历对象.数组的属性值并进行处理. 使用说 ...

  2. IO库 8.1

    题目:编写函数,接受一个istream&参数,返回值类型也是istream&.此函数须从给定流中读取数据,直到遇到文件结束标志时停止.它将读取的数据打印在标准输出上.完成这些操作后,在 ...

  3. html mysql special character

    function html_encode(str) { var s = ""; if (str.length == 0) return ""; s = str. ...

  4. 列求key出现的频率

    1 cat mc.log | grep LOGIN_GET | awk '{print $9}' | sort | uniq -c

  5. Windows 桌面边栏小工具开发入门

          准备为网站做一个桌面通知功能的工具,现在网上一般是html5+js的比较多.虽然html5+js现在是web的开发主流,但是我们应用一般是windows系统.并且应使用中,需要打开谷歌或其 ...

  6. php功能---删除空目录

    header('content-type:text/html;charset:utf-8'); function display($dir){ //判断是否是一个目录 if(!is_dir($dir) ...

  7. python初探-数据类型

    数据类型 可以使用BIF type()来查看对象的类型 数字 int float long 布尔(bool) True 机内表示1,机器识别非0 False 机内表示0,机器识别0 空值 None 字 ...

  8. latex 批量注释

    在LaTex中的注释有3种方法: 1. 右键单击选中要注释的文本,选择 Insert Comment ,WinEdt 就会自动给选定的行添加 % ,完成段落文本的注释: 右键单击选中已经注释的文本,选 ...

  9. [Java]使用队列求解josephus问题

    约瑟夫斯问题(有时也称为约瑟夫斯置换),是一个出现在计算机科学和数学中的问题.在计算机编程的算法中,类似问题又称为约瑟夫环. 有个囚犯站成一个圆圈,准备处决.首先从一个人开始,越过个人(因为第一个人已 ...

  10. page cache和buffer cache

    因为要优化I/O性能,所以要理解一下这两个概念,这两个cache着实让我迷糊了好久,通过查资料大概明白了两者的区别,试着说下. page cache:文件系统层级的缓存,从磁盘里读取的内容是存储到这里 ...