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. NYOJ-252 01串

    01串 时间限制:1000 ms  |  内存限制:65535 KB 难度:2 描写叙述 ACM的zyc在研究01串,他知道某一01串的长度,但他想知道不含有"11"子串的这样的长 ...

  2. 腾讯TGideas语义化标签(转)

    --------引子--------------- 家里有个熊孩子,经常会有一些意想不到的事情发生:回家的时候,他会笑呵呵冲过来,大声喊着“臭爸爸”:你让他把鞋穿上,他会提起鞋子往楼下扔...在小孩的 ...

  3. ubuntu14.04+xfce下启用fcitx,使用中文输入法

    1. 安装fcitx  sudo apt-get install fcitx-pinyin 2.启用fcitx 打开 setting -> Language Support -> Lang ...

  4. 基于HTTP协议下载文件的实现

    最近在开发文件下载的程序,该程序是基于HTTP开发的. 首先是了解了文件传输到客户端的大概格式,然后分析该格式,实现写入文件的功能. 自己构造的HTTP包如下: GET /*********.rar ...

  5. JSTL入门

    在页面最上方引入 -------------------- if语句 8}"> b的值大于8 --------------------- foreach语句 i的值是:${i}

  6. Java基础之参数传递

    public class ArgsTransfer { /* * 基本数据类型直接存储在变量中,函数参数传递时,是将变量中存储的数据拷贝,函数中改变形参,和调用处的实参是不同的变量,两边互不影响 * ...

  7. nodejs:注册登录session出错以及连接Mongodb数据库时Error connecting to database解决方案

    (1)nodejs:注册登录session出错 解决办法: 在app.js 中将var MongoStore =  require(connect-mongo')改为var MongoStore =  ...

  8. SQL Server 数据库所有者

    1. 数据库所有者应当永远是 sa 用户 2. 改变数据库的所有者 alter authorization on database :: databaseName to sa; -- 这一句话把数据库 ...

  9. semver语义化版本号

    semver语义化版本号 语义化版本号各位置的含义 版本号:X.Y.Z X: 代表发生了不兼容的API改变 Y: 代表向后兼容的功能性变化 Z: 代表向后兼容bug fixes 语义化版本号示例 1. ...

  10. CAD教程/视频教程/软件类专题资料免费下载整理合集

    CAD教程&视频教程类专题资料免费下载 资源列表:http://www.xiaodianlv.com/group/cad/ [1] <AUTOCAD2012中文版全套视频教程大合集> ...