`
zsuczw
  • 浏览: 51916 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

javascript设计模式之:封装

阅读更多
javascript既是一门函数式语言,也是一门面向对象的语言,但是要想在javascript中实现类似于java中的private变量可不是一件显而易见的事。你需要借助它的函数式特性:闭包。

下面的例子演示了如何构建一个javascript对象,没有任何的隐藏和封装。
/**
 * 此demo演示了如何在javascript中实现面向对象语言中的信息封装和隐藏。由于javascript不像java那样在语言层面
 * 提供了很好的封装支持,因此需要借助一些模式。
 */


Book = function(isbn, title, author) {
	if (!isbn) throw new Error('isbn is invalid');
	this.isbn = isbn;
	this.title = title;
	this.author = author;
};

Book.prototype = {
	display: function() {
		if (!this.isbn) throw new Error('invalid book');
		console.log('title :' + this.title + '    author: ' + this.author + '    isbn: ' + this.isbn);
	}
};

var book = new Book('0981531652','Actors In Scala', 'Philipp Haller / Frank Sommers');
book.display();

//可以直接的改变book中的成员,使得book不再是合法的book

book.isbn = null;

book.display();


由于没有类似于java中的private关键字,人们发明了“命名规范”来约定所有以下划线'_'开头的变量和方法名都是“私有“的,不应该(注意,是不应该,不是不能)被外部直接调用。

/**
 * 在很多javascript库中,通常约定以下划线 '_'开头的变量或者方法名为私有的变量和方法,不应该直接被外部调用
 */

Book = function(isbn,title,author) {
	if (!isbn) throw new Error('invalid isbn');
	this._isbn =isbn;
	this._title = title;
	this._author = author;
};


Book.prototype = {
	display: function() {
		if (!this._isbn) throw new Error('invalid book');
		console.log('title :' + this.title + '    author: ' + this.author + '    isbn: ' + this.isbn);
	}
};

var book = new Book('0981531652','Actors In Scala', 'Philipp Haller / Frank Sommers');
book.display();
//Book的开发者: oh, _isbn是一个似有变量,你不应该改变直接改变它。
//调用者: 我不是故意的,代码调用层次太深了,我也不知道哪里导致一不小心被设置了。
book._isbn = null;
book.display();


这种办法在每一个程序员都比较自觉的情况下可以发挥效用,但是如果哪个粗心的程序员一不小心。。。

我们需要一种真正的封装!闭包可以做到这一点!什么叫闭包?根据维基百科的定义,一个闭包就是包含自由变量的代码块,这些自由变量定义在代码块所处的上下文中,而不是定义在代码块内部或者全局上下文中。

/**
 * 通过javascrit中的closure来实现真正的私有变量。
 */

Book = function(isbn, title, author) {
	var _isbn, _title, _author;//局部变量
	
	//局部方法
	function checkIsbn(isbn) {
		if (!isbn) throw new Error('cannot set invalid isbn');
	};
	
	this.getTitle = function() {
		return _title;
	};
	
	this.setTitle = function(title) {
		_title = title;
	};
	
	this.getIsbn = function() {
		return _isbn;
	};
	
	this.setIsbn = function(isbn) {
		checkIsbn(isbn);
		_isbn = isbn;
	};
	
	this.getAuthor = function() {
		return _author;
	};
	
	this.setAuthor = function(author) {
		_author = author;
	};
	
	this.setTitle(title);
	this.setIsbn(isbn);
	this.setAuthor(author);
};

Book.prototype = {
	display: function() {
		//这里我们不需要在检验isbn是否合法,因为每一次对isbn的更改都必须通过setIsbn的检查
		console.log('title :' + this.getTitle() + '    author: ' + this.getAuthor() + '    isbn: ' + this.getIsbn());
	}
};

var book = new Book('0981531652','Actors In Scala', 'Philipp Haller / Frank Sommers');
try {
	book.setIsbn(null);
}catch(e) {
	console.log(e.message);
}

book.display();



在上述例子中,_isbn是Book的构造函数中定义的局部变量,它只在构造函数体内有效;在构造函数中也定义了一个checkIsbn()方法,同样,它也只可以在Book的构造函数体内被调用。getIsbn()引用了_isbn这个局部变量,因此它构成了一个闭包,同时getIsbn()又是Book实例的一个方法,因此可以被外部所调用,同时外部调用者也只能通过getIsbn()来获得_isbn的值。这就实现了真正的隐藏。getIsbn()这个方法既可以访问局部变量,又可以被外部调用,称为对象的特权方法。

但是实现真正的隐藏是需要付出代价的:

1. 首先每一个特权方法(例如isbn的getter和setter)存在于每一个实例中,可能会造成内存占用过多
2. 在存在继承的情况下,子类无法直接服用父类的方法和成员变量,因为javascript使用的是prototype的继承。

在实际中,只有在要求非常严格的封装的情况下才会使用例三的方法,而大部分情况都可以使用命名约定的办法。
0
1
分享到:
评论

相关推荐

    JavaScript设计模式与开发实践.pdf

    "JavaScript设计模式与开发实践.pdf" 本书《JavaScript设计模式与开发实践》是JavaScript语言的设计模式和开发实践的指南,旨在帮助初、中、高级Web前端开发人员和想往架构师晋级的中高级程序员,掌握JavaScript...

    JavaScript设计模式.pdf

    JavaScript设计模式.pdf JavaScript设计模式是指在软件开发中使用JavaScript语言编写的设计模式。这些设计模式旨在提高代码的重用性、可读性、维护性和扩展性。以下是JavaScript设计模式的知识点总结: 1. 单体...

    JAVASCRIPT设计模式[收集].pdf

    总结来说,JavaScript设计模式作为前端开发的基石之一,对于提升开发效率和代码质量有着不可忽视的作用。通过闭包和封装,我们可以实现更好的代码管理;通过掌握和运用各种设计模式,我们可以更加高效地解决问题,...

    javascript 面向对象编程.pdf javascript 设计模式与开发实践.pdf

    面向对象编程(Object-Oriented Programming, OOP)是JavaScript中的核心概念,而设计模式则是解决常见编程问题的经验总结,对于提升代码质量和可维护性至关重要。这两本书——"JavaScript 面向对象编程.pdf"和...

    学用 JavaScript 设计模式

    具体到JavaScript设计模式,有多种类型可以利用,包括: 1. 构造器模式:通过构造函数创建对象,并通过new操作符实例化对象。 2. 模块化模式:这是一种封装和组织代码的方式,通过立即执行函数表达式(IIFE)创建...

    Javascript 设计模式系统讲解与应用

    在深入探讨《JavaScript设计模式系统讲解与应用》的内容之前,我们先来了解一下设计模式的基本概念以及为什么它对于前端开发人员尤为重要。设计模式是一套被反复使用的、经过分类编目的、包含结构化的解决方案,用于...

    Javascript 设计模式系统讲解与应用视频资源地址.7z

    JavaScript设计模式是编程实践中的一种重要思想,它提供了一套经过时间考验的最佳实践,用来解决常见的编程问题和提高代码的可维护性、可扩展性和可复用性。在JavaScript这种动态类型的脚本语言中,设计模式尤其重要...

    javascript设计模式 封装和信息隐藏(上).docx

    JavaScript设计模式中的封装和信息隐藏是面向对象编程中的核心概念,它们旨在保护数据免受不必要的外部访问和修改,从而提高代码的稳定性和可维护性。虽然JavaScript不是一种典型的面向对象语言,但通过一些技巧和...

    JavaScript高级与设计模式.zip

    接下来,我们讨论JavaScript设计模式。设计模式是在特定场景下解决问题的通用、可重用的解决方案。在JavaScript中,常见的设计模式有: 1. **单例模式(Singleton)**:确保一个类只有一个实例,并提供一个全局访问...

    JavaScript 设计模式之策略模式.zip

    策略模式是一种行为设计模式,它使你能在运行时改变对象的行为。在JavaScript中,这种模式尤其有用,因为JavaScript是动态类型的,允许我们在程序运行时轻松地更改对象的属性和行为。下面我们将深入探讨策略模式的...

    JavaScript设计模式与开发实践_himppf_js_jspremise_精通javascript_Js设计模式_

    JavaScript设计模式与开发实践是深入理解并提升JavaScript编程能力的关键领域。设计模式是对在软件设计中经常出现的问题的解决方案的描述,它代表了最佳实践,是经验丰富的开发者们经过时间检验后总结出来的解决常见...

    《Javascript 设计模式》课程代码源码

    JavaScript设计模式是编程实践中的一种重要思想,它提供了一套经过时间考验的最佳实践,用来解决常见的编程问题和提高代码的可维护性、可扩展性和可复用性。在本《JavaScript设计模式》课程的源码中,我们可以深入...

    javascript 经典封装

    10. **设计模式封装**:例如工厂模式、观察者模式、单例模式等,都是在JavaScript中实现特定功能的封装策略,它们是经过验证的解决方案,可以提高代码质量。 这个压缩包可能包含了这些封装技术的实际应用案例或详细...

    JS设计模式与开发实践

    - **面向对象编程(OOP)**:OOP是JavaScript设计模式的核心基础之一,包括封装、继承、多态等关键概念。 - **函数式编程(FP)**:FP强调不可变数据和纯函数,有助于减少副作用,提高代码的可测试性和可维护性。...

    javascript设计模式之工厂模式.docx

    工厂模式在 JavaScript 中...结论:工厂模式是一种常用的设计模式,它可以应用于各种场景,例如创建复杂对象、封装第三方库的接口、简化代码的编写等。但是,它也需要了解工厂模式的实现细节和注意避免工厂模式的缺点。

    JavaScript设计模式与开发实践1

    《JavaScript设计模式与开发实践1》是一本深入探讨JavaScript设计模式的书籍,旨在帮助Web前端开发人员提升开发技能,特别是对于希望晋升为架构师的中高级程序员。全书分为三个部分,涵盖了JavaScript面向对象、函数...

    javascript 设计模式之单体模式 面向对象学习基础

    JavaScript中的单体模式是一种设计模式,它用于确保一个类只有一个实例,并提供一个全局访问点来获取这个唯一实例。这种模式在JavaScript中尤其重要,因为JavaScript是全局作用域的语言,容易导致变量冲突。单体模式...

    设计模式(包含java\c#\javascript等语言的设计模式)

    设计模式是软件工程中的一种标准解决方案,用于解决在开发过程中经常遇到的问题,它们代表了最佳实践,被广泛应用于各种编程语言中,如Java、C#和JavaScript。GOF 23设计模式,由Erich Gamma、Richard Helm、Ralph ...

    深入理解JavaScript系列(25):设计模式之单例模式详解

    单例模式是软件开发中一种非常重要的设计模式,它确保一个类只有一个实例,并提供一个全局访问点。在JavaScript这样的动态语言中,单例模式的实现方式很多样,而且可以非常灵活。下面,我们就来深入探讨单例模式在...

Global site tag (gtag.js) - Google Analytics