javascript 面向对象的JavaScript类

在上一节面 JavaScript 面向对象之命名空间 中说了怎么定义JavaScript命名空间，这一节来说下紧接着的一个概念——类。虽然JavaScript中没有class关键字，但作为开发人员我们一定要有这个思想。在C#中类可以分为实例类和静态类，JavaScript亦然。

一，定义实例类： 在上节中我定义了一个cnblogs.news的命名空间，现在就在此命名空间下定义一个名为Article类:


代码如下:

cnblogs.news.Article=function(){
var _this=this;
this.title=null;
this.content=null;
this.show=function(){
document.write("<h1>"+_this.title+"</h1>");
document.write("<p>"+_this.content+"</p>");
}
}

创建对象就和C#一样：


代码如下:

// 实例化一个对象
var article =new cnblogs.news.Article();
// 给对象的属性赋值
article.title="这是文章标题";
article.content="这是文章内容";
// 调用对象的方法
article.show();

二，定义静态类：所谓静态类就是直接调用类的成员，换言之，类的成员是属于类的，不属于对象。同样以Article为例，代码如下：


代码如下:

cnblogs.news.Article={
title:"这是文章标题",
content:"这是文章内容",
show:function(){
document.write("<h1>"+cnblogs.news.Article.title+"</h1>");
document.write("<p>"+cnblogs.news.Article.content+"</p>");
}
};

调用方式也和C#类似：
cnblogs.news.Article.show();
到这里或许你已经发现了，所谓JavaScript静态类其实就是一个json对象，恭喜，答对了！ ^_^
三，如何选择：
那么何时选择实例类，何时选择静态类呢，就个人经验而言(说得不对敬请斧正刀正，怎么正都可以^_^)，开发一些对dom的依赖比较弱，而要求复用型很强的程序，如工具类，插件类，结构，使用静态类；反之如果程序对dom依赖很强，经常有变量传来传去，或者对类的结构造成变化，这时选用实例类。个人比较推崇第一种方案，其代码风格较之第二种更像C#，我想写惯了C#的同学也会这样觉得的，^_^。
作者: 祥叔

赞 (0)

相关推荐

  • JavaScript类和继承 constructor属性

    constructor属性始终指向创建当前对象的构造函数.比如下面例子:比如下面例子: 复制代码 代码如下: // 等价于 var foo = new Array(1, 56, 34, 12); var arr = [1, 56, 34, 12]; console.log(arr.constructor === Array); // true // 等价于 var foo = new Function(); var Foo = function() { }; console.log(Foo.co

  • 由浅到深了解JavaScript类第1/2页

    作者:泣红亭 整理日期:2004年6月15日 最近在无忧脚本混了一阵子,回复了一些贴子,自己却没有做出什么东东让大家看看,心里有些不安,于是写了下边的一点东西,本来应该发在类封装区的,考虑到那里比较冷,而这篇文章我希望能够帮助到更多的朋友,因此放到这里来了. >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>&

  • 收集的几个不错的javascript类小例子

    具体功能运行后看效果 添加f1添加f2添加f3 移除f1移除f2移除f3 function FunctionArray() { var functions=new Array(); var FA=function (){ for(var i=0;i [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] Function.prototype.concat = function() { var funcs = [this].concat(Array.apply([], arguments));

  • javascript 图片轮换 函数化继承

    javascript 图片轮换 函数化继承

    先看下前几天的动画是如何构造JS的: 复制代码 代码如下: var photo=function(){ var index=0,a,b,c,d; return { show:function(){}, auto:function(){} } } var aa=photo(); //基本上是 用return 返回了一些方法. // 1:无法初始化就执行 auto. // 2:在初始化的时候,我没办法把this指向aa. //上面两个问题,会很不方便. 1:我不愿意让自己去这洋写: 复制代码 代码如

  • javascript基础知识分享之类与函数化

    1.对象适合于收集和管理数据,容易形成树型结构. Javascript包括一个原型链特性,允许对象继承另一对象的属性.正确的使用它能减少对象的初始化时间和内存消耗. 2.函数它们是javascript的基础模块单元,用于代码复用.信息隐藏和组合调用.函数用于指定对象的行为.一般来说,编程就是将一组需求分解成一组函数和数据结构的技能. 3.模块我们可以使用函数和闭包来构造模块.模块是一个提供接口却隐藏实现状态和实现的函数或对象. 1.自定义类型--构造函数模式(伪类模式) 在基于类的系统中,对象是

  • JavaScript类和继承 prototype属性

    我们已经在第一章中使用prototype属性模拟类和继承的实现. prototype属性本质上还是一个JavaScript对象. 并且每个函数都有一个默认的prototype属性. 如果这个函数被用在创建自定义对象的场景中,我们称这个函数为构造函数. 比如下面一个简单的场景: 复制代码 代码如下: // 构造函数 function Person(name) { this.name = name; } // 定义Person的原型,原型中的属性可以被自定义对象引用 Person.prototype

  • 一个简单的javascript类定义例子

    复制代码 代码如下: <script> //定义一个javascript类 function JsClass(privateParam/* */,publicParam){//构造函数 var priMember = privateParam; //私有变量 this.pubMember = publicParam; //公共变量 //定义私有方法 function priMethod(){ return "priMethod()"; } //定义特权方法 //特权方法可以

  • JavaScript类和继承 this属性使用说明

    this属性表示当前对象,如果在全局作用范围内使用this,则指代当前页面对象window: 如果在函数中使用this,则this指代什么是根据运行时此函数在什么对象上被调用. 我们还可以使用apply和call两个全局方法来改变函数中this的具体指向. 先看一个在全局作用范围内使用this的例子: 复制代码 代码如下: <script type="text/javascript"> console.log(this === window); // true consol

  • jquery下组织javascript代码(js函数化)

    从神奇的"$"函数开始 "$"函数将在文档加载完成之后为一个指定的button 绑定事件,这些代码在单个网页中工作正常.但是如果我们还有其它的网页,我们将不得不重复这个过程. 复制代码 代码如下: <a href="javascript:;" id="sayHello">Say Hello</a> <script type="text/javascript"> //whe

  • javascript面向对象之Javascript 继承

    上几节讲了 JavaScript 面向对象之命名空间 . javascript 面向对象的JavaScript类 . JavaScript 面向对象的之私有成员和公开成员 与 Javascript 面向对象之重载,大家可以先看上面的再继续往下看. 在JavaScript中实现继承可以有多种方法,下面说两种常见的. 一,call 继承,先看代码: 先定义一个"人"类 复制代码 代码如下: //人类 Person=function(){ this.name="草泥马";

  • javascript 面向对象的JavaScript类

    在上一节面 JavaScript 面向对象之命名空间 中说了怎么定义JavaScript命名空间,这一节来说下紧接着的一个概念--类.虽然JavaScript中没有class关键字,但作为开发人员我们一定要有这个思想.在C#中类可以分为实例类和静态类,JavaScript亦然. 一,定义实例类: 在上节中我定义了一个cnblogs.news的命名空间,现在就在此命名空间下定义一个名为Article类: 复制代码 代码如下: cnblogs.news.Article=function(){ var

  • 学习javascript面向对象 理解javascript对象

    一.编程思想 面向过程:以过程为中心,自顶向下逐步细化,程序看成一系列函数调用的集合 面向对象:对象作为程序的基本单元,程序分解为数据和相关操作 二.类.对象 类:对具有相同特性和特征事物的抽象描述 对象:某种类型对应的具体事物 三.面向对象的三大特性 封装:隐藏实现细节,实现代码模块化 继承:扩展已存在的代码模块,实现代码重用  多态:接口的不同实现方式,实现接口重用 四.对象定义:无序属性的集合,其属性可以包含基本值.对象或者函数 //简单的对象实例 var person = new Obj

  • javascript面向对象之一 定义类

    javascript中的类是用函数function表示的,如下: 复制代码 代码如下: function Student() { //定义类Student中的字段,并赋予初值,但此字段的访问权限是public this.studentNo = 's001'; this.studentName = '小明'; this.sex = '男'; //定义类Student中的方法updateStudentName ,用于修改studentName 值 this.updateStudentName = f

  • 学习javascript面向对象 理解javascript原型和原型链

    学习javascript面向对象 理解javascript原型和原型链

    先看一张图,梳理梳理. 一.基本概念 [原型链]每个构造函数都有一个对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个指向原型对象的内部指针.那么,如果原型对象等于另一个原型的实例,此时的原型对象将包含一个指向另一个原型的指针,相应地,另一个原型中也包含着一个指向另一个构造函数的指针.如果另一个原型又是另一个原型的实例,那么上述关系依然成立.如此层层递进,就构成了实例与原型的链条. [原型对象]这个对象包含可以由特定类型的所有实例共享的属性和方法.所有引用类型默认都继承了Object,

  • Javascript面向对象编程

    Javascript的重要性 使用率 1.在web应用中,涉及到前端界面编程基本上都要用到javascript语言: 2.Web2.0及Ajax推动了javascript语言. 3.随着大量的c/s应用转向b/s,富客户端技术的不断推广,javascript语言的应用范围还将不断加大: javascript的特点 简单 动态 基于对象(面向对象) Javascript面向对象概述 Javascript是一种面向(基于)对象的动态脚本语言,是一种基于对象(Object)和事件驱动(EventDri

  • Javascript 面向对象之重载

    上几节讲了 JavaScript 面向对象之命名空间 . javascript 面向对象的JavaScript类 与 JavaScript 面向对象的之私有成员和公开成员 ,大家可以先看上面的再继续往下看. 假如 我这样定义: 复制代码 代码如下: function getDate(){.....} function getDate(date){.....} 那么后一个方法将覆盖前一个,虽然不报错. 但是我们确实是可以实现重载的,如果你用过jQuery,你就会深有体会,比如$("#btn&quo

  • JavaScript 面向对象的之私有成员和公开成员

    上两节讲了 JavaScript 面向对象之命名空间 与 javascript 面向对象的JavaScript类,大家可以先看上面的再继续往下看. 其实很简单,废话少说,看了下面的代码及注释相信你就会一目了然! 复制代码 代码如下: //声明类,就是一个方法,其实在JavaScript中,命名空间.类.成员.... 一切皆对象 MyClass =function(){ var _this=this; //私有变量 var aa="11"; //公开变量 this.bb="22

  • JavaScript 面向对象编程（2） 定义类

    本文承接上一篇JavaScript面向对象编程(1) 基础. 上篇说过,JavaScript没有类的概念,需要通过函数来实现类的定义.先通过一个例子说明: 复制代码 代码如下: function myClass() { var id = 1; var name = "johnson"; //properties this.ID = id; this.Name = name; //method this.showMessage = function() { alert("ID:

  • 浅谈JavaScript实现面向对象中的类

    对象,是人们要进行研究的任何事物,从最简单的整数到复杂的飞机等均可看作对象,它不仅能表示具体的事物,还能表示抽象的规则.计划或事件.--引自百度百科 面向对象编程,是当前最流行的编程模式.但令人沮丧的是,作为前端应用最为广泛的javascript,并不支持面向对象. javascript没有访问控制符,它没有定义类的关键字class,它没有支持继承的extend或冒号,它也没有用 来支持虚函数的virtual,不过,Javascript是一门灵活的语言,下面我们就看看没有关键字class的Jav

随机推荐