JavaScript面向对象实现

一:面向对象三大特征

继承,封装,多态!

二:JavaScript自定义对象

 创建对象的方式:

方式1,对象初始化器方式;

 <script type="text/javascript">
var marry={
name:"marry",
age:2,
getMarry:function (){
alert("我是"+this.name+"今年"+this.age+"岁了!");
},
action:function(){
alert("哈哈哈");
}
};
alert(marry.name);
alert(marry.age);
marry.getMarry();
marry.action();
</script>

方式2,构造函数方式;

 <script type="text/javascript">
function Dog(name,age){
this.name=name;
this.age=age;
this.getDog=function(){
alert("我是"+this.name+"今年"+this.age+"岁了!");
};
this.action=function(){
alert("会跑,会跳!");
};
};
var dog=new Dog("二狗",1);
alert(dog.name);
alert(dog.age);
dog.getDog();
dog.action();
</script>

对象属性定义:

私有属性;对象属性;类属性;

 <script type="text/javascript">
function C(){
this.objPro="对象属性";
C.prototype.objPro2="对象属性2";
var pro="私有属性";
function fun2(){
alert(pro);
};
return fun2(); }
C.classpro="类属性";
var c=new C();
alert(c.objPro);
alert(c.objPro2);
alert(C.classpro);
var result=C;
result();
</script>

对象方法定义:私有方法;实例方法;类方法;

 <script type="text/javascript">
function C(){
var privateFunc=function(){
alert("私有方法!");
};
privateFunc();
this.func=function(){
alert("对象方法1");
};
C.prototype.func2=function(){
alert("对象方法2");
}
}
C.classFunc=function(){
alert("类方法!");
}
C.classFunc();
var c=new C();
c.func();
c.func2();
</script>

三:JavaScript实现封装特性

四:JavaScript实现继承特性

Apply()实现属性和方法的继承;

 <script type="text/javascript">
function Animal(name,age){
this.name=name;
this.age=age;
this.func=function(){
alert("我是"+this.name+"今年"+this.age+"岁了!");
};
this.action=function(){
alert("跳,跑!");
}
}
function Dog(name,age){
Animal.apply(this, [name,age]);
}
var dog=new Dog("二狗",3);
alert(dog.name);
alert(dog.age);
dog.func();
dog.action();
</script>

Prototype实现原型的继承;

 <script type="text/javascript">
function Animal(name,age){
this.name=name;
this.age=age;
this.func=function(){
alert("我是"+this.name+"今年"+this.age+"岁了!");
};
this.action=function(){
alert("跳,跑!");
}
}
function Dog(name,age){
Animal.apply(this, [name,age]);
}
Dog.prototype=new Animal();
var dog=new Dog("二狗",3);
alert(dog.name);
alert(dog.age);
dog.func();
dog.action();
</script>

五:JavaScript实现多态特性

JavaScript模拟多态实现!

 <script type="text/javascript">
function Animal(){
this.say=function(){
alert("我是动物");
};
}
function Dog(){
this.say=function(){
alert("我是狗");
};
}
function Cat(){
this.say=function(){
alert("我是猫");
};
}
Dog.prototype=new Animal();
Cat.prototype=new Animal();
function say(animal){
if(animal instanceof Animal){
animal.say();
}
}
var dog=new Dog();
var cat=new Cat();
dog.say();
cat.say();
</script>

JavaScript面向对象实现的更多相关文章

  1. JavaScript学习笔记(三)——this、原型、javascript面向对象

    一.this 在JavaScript中this表示:谁调用它,this就是谁. JavaScript是由对象组成的,一切皆为对象,万物皆为对象.this是一个动态的对象,根据调用的对象不同而发生变化, ...

  2. JavaScript学习总结(三)——this、原型、javascript面向对象

    一.this 在JavaScript中this表示:谁调用它,this就是谁. JavaScript是由对象组成的,一切皆为对象,万物皆为对象.this是一个动态的对象,根据调用的对象不同而发生变化, ...

  3. Javascript面向对象特性实现封装、继承、接口详细案例——进级高手篇

    Javascript面向对象特性实现(封装.继承.接口) Javascript作为弱类型语言,和Java.php等服务端脚本语言相比,拥有极强的灵活性.对于小型的web需求,在编写javascript ...

  4. javascript面向对象系列第四篇——选项卡的实现

    前面的话 面向对象的应用并非只是读几本书那么容易,需要有大量的工程实践做基础才能真正理解并学会使用它.本文将用面向对象的技术来制作一个简单的选项卡 图示说明 由图示结果看到,这是一个非常简单的选项卡. ...

  5. javascript面向对象系列第三篇——实现继承的3种形式

    × 目录 [1]原型继承 [2]伪类继承 [3]组合继承 前面的话 学习如何创建对象是理解面向对象编程的第一步,第二步是理解继承.本文是javascript面向对象系列第三篇——实现继承的3种形式 [ ...

  6. javascript面向对象系列第一篇——构造函数和原型对象

    × 目录 [1]构造函数 [2]原型对象 [3]总结 前面的话 一般地,javascript使用构造函数和原型对象来进行面向对象编程,它们的表现与其他面向对象编程语言中的类相似又不同.本文将详细介绍如 ...

  7. Javascript面向对象(封装、继承)

    Javascript 面向对象编程(一):封装 作者:阮一峰 Javascript是一种基于对象(object-based)的语言,你遇到的所有东西几乎都是对象.但是,它又不是一种真正的面向对象编程( ...

  8. 《javascript面向对象精要》读书笔记

    <javascript面向对象精要> 买这本书的原因主要是因为作者,Nicholas C. Zakas 牛X闪闪的js专家,读过js高程的应该都知道他,而这本书是他的最新力作,感觉也是js ...

  9. 【转】javascript面向对象编程

    摘要:本文本来是想自己写的,奈何花了好长时间写好之后忘记保存,还按了刷新键,一键回到解放前,索性不写了,所以本文是转载的. 面向对象编程是用抽象方式创建基于现实世界模型的一种编程模式,主要包括模块化. ...

  10. javascript面向对象(一):封装

    本文来自阮一峰 学习Javascript,最难的地方是什么? 我觉得,Object(对象)最难.因为Javascript的Object模型很独特,和其他语言都不一样,初学者不容易掌握. 下面就是我的学 ...

随机推荐

  1. WPF学习08:MVVM 预备知识之COMMAND

    WPF内建的COMMAND是GOF 提出的23种设计模式中,命令模式的实现. 本文是WPF学习07:MVVM 预备知识之数据绑定的后续,将说明实现COMMAND的三个重点:ICommand  Comm ...

  2. T4870 水灾(sliker.cpp/c/pas) 1000MS 64MB

    题目描述 大雨应经下了几天雨,却还是没有停的样子.土豪CCY刚从外地赚完1e元回来,知道不久除了自己别墅,其他的地方都将会被洪水淹没. CCY所在的城市可以用一个N*M(N,M<=50)的地图表 ...

  3. 【译】x86程序员手册32-9.4 中断描述符表

    9.4 Interrupt Descriptor Table 中断描述符表 The interrupt descriptor table (IDT) associates each interrupt ...

  4. Windows bat 设置代理

    转自tt-0411 @echo off cls color 0A Echo The program is running... Echo Setting the ip and dns... netsh ...

  5. .Net中的强名称(Strong Name)

    我在CSDN上的文章, 转载与此: .Net中的强名称(Strong Name) http://blog.csdn.net/Anor/article/details/3649646

  6. 迅为IMX6开发板适用于HMI|车载电脑|工业控制|医疗仪器|智能家居 灵活进行产品开发平台

    i.MX6开发平台行业中的应用 适用于HMI.POS机.车载电脑.工业控制.轨道交通.医疗仪器.智能家居.数据终端等行业. 迅为iMX6开发板采用核心板+底板结构设计,高品质,稳定性强,可以更灵活地进 ...

  7. nutwk的maven中央仓库及配置

    官方maven服务器:https://jfrog.nutz.cn/artifactory/jcenter/ 如果用阿里的maven服务器,特别提醒:

  8. 安卓 Android 简单数据库(增删改查)

    <Button android:id="@+id/delete_btn" android:layout_width="wrap_content" andr ...

  9. ionic提供的配色方案

    .light #ffffff .stable #f8f8f8 .positive #387ef5 .calm #11c1f3 .balanced #33cd5f .energized #ffc900 ...

  10. libuv httpparser写的简单http server

    libuv文档地址:http://docs.libuv.org/en/v1.x/代码地址:https://github.com/libuv/libuvhttp-parser https://githu ...