javascript 面向对象编程基础:封装


Posted in Javascript onAugust 21, 2009

很长一段时间以来(这里本人要幸灾乐祸地说),js是“一种点缀的作用,完成很有限的功能,诸如表单验证之类,其语言本身也一直被当作过程化的语言使用,很难完成复杂的功能。”。但是(这里本人要苦大仇深、痛心疾首地说),“而Ajax的出现使得复杂脚本成为必需的组成部分,这就对 JavaScript 程序设计提出了新的要求,很多Ajax应用开始利用JavaScript面向对象的性质进行开发,使逻辑更加清晰。事实上,JavaScript 提供了完善的机制来实现面向对象的开发思想。”。额的神啊,本来就不想学不敢学的,现在不得不硬着头皮学了。
这里关于对象就废话这么多了。我们都知道面向对象编程的三个主要特点是:封装、继承和多态。下面就围绕着这三个特点,记录一些学习心得。
好的,先从封装性开始介绍,众所周知,对象是封装的最基本单位。封装防止了程序相互依赖性而带来的变动影响。面向对象的封装比传统语言的封装更为清晰、更为有力。Code is cheap.来看简单的代码:

// 定义函数的方式定义类
function class1() {
// 类成员的定义及构造函数
// 这里class1 既是一个函数也是一个类。作为函数,它可以理解为类的构造函数, 负责初始化的工作。
}

// 使用new操作符获得一个类的实例
var obj = new class1();
/* 抛开类的概念,从代码的形式上来看,class1 就是一个函数,那么是不是所有的函数都可以用new来操作呢?答案是肯定的。
在JavaScript 中,函数和类就是一个概念,当new 一个函数时,就会返回一个对象。如果这个函数中没有初始化类成员,那就会返回一个空的对象。
事实上,当new一个函数时,这个函数就是所代表类的构造函数,其中的所有代码都可以看作为了初始化一个对象而工作。用于表示类的函数也称之为构造器。
在JavaScript 中,每个对象可以看作是多个属性(方法)的集合
*/

function test() {
alert( typeof (obj));
}

上面的代码定义了一个类class1,这就是js中简单的封装,下面我们看js如何定义“静态类”,

function class1() { // 构造函数
}
// 静态属性
class1.staticProperty = " test " ;
// 静态方法
class1.staticMethod = function () {
alert(class1.staticProperty);
}

function test() {
// 调用静态方法
class1.staticMethod();
alert( typeof (class1));

}

接着看“抽象类”:

/*
在传统面向对象语言中,抽象类中的虚方法必须先被声明,但可以在其他方法中被调用。
而在JavaScript 中,虚方法就可以看 该类中没有定义的方法,但已经通过this 指针使用了。
和传统面向对象不同的是,这里虚方法不需经过声明,而直接使用了。这些方法将在派生类
中实现
*/

// 定义extend 方法
Object.extend = function (destination, source) {
for (property in source) {
destination[property] = source[property];
}
return destination;
}
Object.prototype.extend = function (object) {
return Object.extend.apply( this , [ this , object]);
}
// 定义一个抽象基类base,无构造函数
function base() { }
base.prototype = {
initialize: function () {
this .oninit(); // 调用了一个虚方法
}
}
// 定义class1
function class1() {
// 构造函数
}
// 让class1继承于base 并实现其中的oninit方法
class1.prototype = ( new base()).extend({
oninit: function () { // 实现抽象基类中的oninit 虚方法
// oninit 函数的实现
}
});

我们看到,上面“让class1继承于base 并实现其中的oninit方法时”,使用了“继承”的概念,请留意。再来看一下执行的效果:

function test() {
var obj = new class1();
obj.oninit = function () { alert( " test " ); }
obj.oninit();
}

Javascript 相关文章推荐
IE中直接运行显示当前网页中的图片 推荐
Aug 31 Javascript
添加到收藏夹代码(兼容几乎所有的浏览器)
Jan 09 Javascript
jquery监控数据是否变化(修正版)
Apr 12 Javascript
json的定义、标准格式及json字符串检验
May 11 Javascript
浅析上传头像示例及其注意事项
Dec 14 Javascript
利用Bootstrap实现表格复选框checkbox全选
Dec 21 Javascript
javaScript实现复选框全选反选事件详解
Nov 20 Javascript
防止页面url缓存中ajax中post请求的处理方法
Oct 10 Javascript
vue中el-upload上传图片到七牛的示例代码
Oct 19 Javascript
使用JavaScript获取扫码枪扫描得到的条形码的思路代码详解
Jun 10 Javascript
jQuery实现移动端下拉展现新的内容回弹动画
Jun 24 jQuery
JavaScript arguments.callee作用及替换方案详解
Sep 02 Javascript
javascript arguments 传递给函数的隐含参数
Aug 21 #Javascript
javascript 自定义事件初探
Aug 21 #Javascript
IE 下的只读 innerHTML
Aug 21 #Javascript
JS 控制CSS样式表
Aug 20 #Javascript
JS获取父节点方法
Aug 20 #Javascript
javascript 数组排序函数
Aug 20 #Javascript
用Javascript数组处理多个字符串的连接问题
Aug 20 #Javascript
You might like
php Undefined index的问题
2009/06/01 PHP
PHP获取本周第一天和最后一天示例代码
2014/02/24 PHP
PHP+Mysql树型结构(无限分类)数据库设计的2种方式实例
2014/07/15 PHP
PHP学习笔记(二) 了解PHP的基本语法以及目录结构
2014/08/04 PHP
php构造方法中析构方法在继承中的表现
2016/04/12 PHP
php字符串截取函数mb_substr用法实例分析
2019/06/25 PHP
js兼容pc端浏览器并有多种弹出小提示的手机端浮层控件实例
2015/04/29 Javascript
Javascript常用小技巧汇总
2015/06/24 Javascript
JS中Json数据的处理和解析JSON数据的方法详解
2016/06/29 Javascript
JavaScript数据类型转换的注意事项
2016/07/31 Javascript
jQuery实现的简单百分比进度条效果示例
2016/08/01 Javascript
jQuery表单事件实例代码分享
2016/08/18 Javascript
dropload.js插件下拉刷新和上拉加载使用详解
2017/10/20 Javascript
Vue.js与 ASP.NET Core 服务端渲染功能整合
2017/11/16 Javascript
jQuery实现遍历XML节点和属性的方法示例
2018/04/29 jQuery
解决Angular4项目部署到服务器上刷新404的问题
2018/08/31 Javascript
vue过滤器实现日期格式化的案例分析
2020/07/02 Javascript
[52:20]DOTA2-DPC中国联赛正赛 SAG vs XGBO3 第一场 3月5日
2021/03/11 DOTA
python logging类库使用例子
2014/11/22 Python
Python操作MySQL模拟银行转账
2018/03/12 Python
pyside+pyqt实现鼠标右键菜单功能
2020/12/08 Python
python re模块匹配贪婪和非贪婪模式详解
2020/02/11 Python
Python中过滤字符串列表的方法
2020/12/22 Python
悦木之源美国官网:Origins美国
2016/08/01 全球购物
香港现代设计家具品牌:Ziinlife Furniture
2018/11/13 全球购物
巴西Mr. Cat在线商店:购买包包和鞋子
2019/09/08 全球购物
大二自我鉴定范文
2013/10/05 职场文书
群众路线教育实践活动方案
2014/02/02 职场文书
《歌唱二小放牛郎》教学反思
2014/04/19 职场文书
职务任命书范本
2014/06/05 职场文书
处级领导班子全部召开专题民主生活会情况汇报
2014/09/27 职场文书
志愿者服务宣传标语口号
2015/12/26 职场文书
煤矿施工安全协议书
2016/03/22 职场文书
Python爬虫基础之初次使用scrapy爬虫实例
2021/06/26 Python
手把手带你彻底卸载MySQL数据库
2022/06/14 MySQL
苹果macOS 13开发者预览版Beta 8发布 正式版10月发布
2022/09/23 数码科技