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

很长一段时间以来（这里本人要幸灾乐祸地说），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();
}

赞 (0)

相关推荐

  • 学习Javascript面向对象编程之封装

    Javascript是一种基于对象(object-based)的语言,你遇到的所有东西几乎都是对象.但是,它又不是一种真正的面向对象编程(OOP)语言,因为它的语法中没有class(类). 那么,如果我们要把"属性"(property)和"方法"(method),封装成一个对象,甚至要从原型对象生成一个实例对象,我们应该怎么做呢? 一. 生成对象的原始模式 假定我们把猫看成一个对象,它有"名字"和"颜色"两个属性. var C

  • Javascript 面向对象编程（一） 封装

    Javascript 面向对象编程（一） 封装

    学习Javascript,最难的地方是什么? 我觉得,Object(对象)最难.因为Javascript的Object模型很独特,和其他语言都不一样,初学者不容易掌握. 下面就是我的学习笔记,希望对大家学习这个部分有所帮助.我主要参考了以下两本书籍: <面向对象的Javascript>(Object-Oriented JavaScript) <Javascript高级程序设计(第二版)>(Professional JavaScript for Web Developers, 2nd

  • JavaScript对象封装的简单实现方法(3种方法)

    本文实例讲述了JavaScript对象封装的简单实现方法.分享给大家供大家参考,具体如下: Javascript在HTML中变得越来越强大,富客户端,HTML5中的WebGL等.但是我们书写Javascript的时候往往很随意,使用对象的封装是极好的.这里介绍Javascipt三种创建对象的方法. 1. 使用关键字new创建对象 function Person(name, age) { this.name = name; this.age = age; } var p = new Person(

  • javascript 面向对象封装与继承

    整理一下js面向对象中的封装和继承. 1.封装 js中封装有很多种实现方式,这里列出常用的几种. 1.1 原始模式生成对象 直接将我们的成员写入对象中,用函数返回. 缺点:很难看出是一个模式出来的实例. 代码: 复制代码 代码如下: function Stu(name, score) {             return {                 name: name,                 score: score             }         }    

  • JavaScript中的Primitive对象封装介绍

    JavaScript中,string.number.boolean均为primitive基本类型,也即字符串.数值.布尔值并不是以对象的形式而存在的.不过,由于需要对这三种primitive类型值进行操作,因此JavaScript会自动封装这三种类型的值,使其作为对象而拥有属性与方法.以string为例,这种封装过程如下: 1.当JavaScript遇到对string值进行属性访问或者方法调用时,会调用new String(字符串值)自动将该string封装成一个String对象. 2.Java

  • javascript面向对象包装类Class封装类库剖析

    javascript是个入门门槛很低的语言,甚至一个从来没有接触过javascript的技术人员,几小时内就可以写出一个简单有用的程序代码. 但是如果因此你就下结论:javascript是门简单的语言.那你就大错特错了.想写出高性能的代码,同样需要具备一个高级程序员的基本素养. 一个java或者c++程序员,不一定能写出高性能的javascript代码,但更容易写出高性能的javascript代码. javascript的简单是基于它"胸襟广阔"的包容性.它声明时,不需要指定类型,甚至

  • javascript 面向对象全新理练之数据的封装

    今天主要讨论如何在 JavaScript 脚本中实现数据的封装(encapsulation).数据封装说的简单点就是把不希望调用者看见的内容隐藏起来.它是面向对象程序设计的三要素之首,其它两个是继承和多态,关于它们的内容在后面再讨论. 关于数据封装的实现,在 C++.Java.C# 等语言中是通过 public.private.static 等关键字实现的.在 JavaScript 则采用了另外一种截然不同的形式.在讨论如何具体实现某种方式的数据封装前,我们先说几个简单的,大家所熟知却又容易忽略

  • Javascript 面向对象（二）封装代码

    Javascript 面向对象（二）封装代码

    写个小例子: 第一步:做一个"手机的类" 复制代码 代码如下: var MobilePhone = (function(){ ---- })() 第二步:考虑这个类,里需要那些类的私有属性,这里我想定义的是实例出来手机的数量 复制代码 代码如下: var MobilePhone = (function(){ //私有属性 var count = 0; //代表手机的数量 })() 第三步:创建一个构造函数,即实例时候,对产生的新象的一个初始化,例如属性,方法的初始化;在这个例子中,每一

  • js实现对ajax请求面向对象的封装

    AJAX 是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. 在js中使用ajax请求一般包含三个步骤:               1.创建XMLHttp对象               2.发送请求:包括打开链接.发送请求               3.处理响应 在不使用任何的js框架的情况下,要想使用ajax,可能需要向下面一样进行代码的编写 <span style=&qu

  • JavaScript之信息的封装 js对象入门

    JavaScript之信息的封装 在编码前,我们需要了解如下几个术语:封装:对内部数据的表现形式和实施细节进行隐藏: 私有属性和方法:外界只能通过其公开的接口与其进行存取和交互 作用域:JavaScript中,只有函数具有作用域,函数内部定义的属性和方法在外部无法访问 特权方法:声明在函数内部,能访问函数内部变量(属性)的方法,比较耗费内存: 复制代码 代码如下: function Person() { /* * 声明私有的数据 * 昵称,年龄,邮箱 */ var nickName, age,

  • Javascript之面向对象--封装

    Javascript之面向对象--封装

    第一步:做一个"手机的类" var MobilePhone = (function(){ ---- })() 第二步:考虑这个类,里需要那些类的私有属性,这里我想定义的是实例出来手机的数量 var MobilePhone = (function(){ //私有属性 var count = 0; //代表手机的数量 })() 第三步:创建一个构造函数,即实例时候,对产生的新象的一个初始化,例如属性,方法的初始化;在这个例子中,每一个手机都会有颜色,大小,价格属性.这里的构造函数也是一个闭

  • javascript对XMLHttpRequest异步请求的面向对象封装

    复制代码 代码如下: function CallBackObject() { this.XmlHttp = this.GetHttpObject(); } CallBackObject.prototype.GetHttpObject = function() //动态为CallBackObject的原型添加了GetHttpObject共有方法 { //第一步:创建XMLHttpRequest对象 //进行兼容性判断 var xmlhttp; /*@cc_on @if (@_jscript_ver

随机推荐