javascript设计模式系列二-封装

JavaScript封装:

var Book = function (id, name, price) {
    this.id = id,
        this.name = name,
        this.price = price
}
Book.prototype.display = function () {
    //展示书本
}

var book = new Book(10, ‘js‘, 30);
book.display();
console.log(book.name);

问题:通过this和prototype添加的属性和方法有什么区别

 答:通过this添加的属性、方法是在当前对象上添加的,然而Js是有种基于原型prototype的语言,所以每创建一个对象时(在js中函数也是一种对象),都有一个原型prototype用于执行其继承的属性,方法。

javaScript是如何实现封装的呢?

由于javascript是函数级作用域,声明在函数内部的变量以及方法在外界是访问不到的,通过此特性即可创建类的私有变量以及私有方法。然而在函数内部通过this船舰的属性和方法,在类创建对象时,每个对象自身都拥有一份并且可以在外部访问到。因此通过this创建的属性和方法可看作是对象共有属性和对象公有方法,而通过this创建的方法,不但可以防卫这些对象的公有属性和方法,而且还能访问到类或对象自身的私有的属性和方法,由于这些方法权力比较大,所以我们又将它看作特权方法。在对象创建时通过使用这些特权我们可以初始化实例对象的一些属性,因此这些在创建对象时调用的特权方法还可以看作是类的构造器,如下所示:

var Book = function (id, name, price) {
    //私有属性
    var num = 1;
    //私有方法
    function checkId() { }
    //特权方法
    this.setName = function (name) { }
    this.getName = function () { }
    //对象公有属性
    this.id = id;
    this.name = name;
    this.price = price;
    //对象公有方法
    this.copy = function () { }

    //4对象构造器
    this.setName(‘name‘);

}

类的静态方法和属性

//类的静态属性
Book.isChinese=true;
//类的静态方法
Book.resetTime=function(){}

类的原型属性和方法

//公有方法
Book.prototype.display = function () {
    //展示书本
}
//公有属性
Book.prototype.checkId=true;

创建对象的安全模式:

  目的是克服初学者忘记new关键字,导致如下示例,这是由于new关键字的作用是对当前对象的this不停的赋值,然而例子中没有使用new,所以就会直接执行这个函数,而这个函数是在全局作用域中执行的,所以在全局作用域中this指向的是当前对象自然就是全局变量(window),而我们这个book变量最终作用是要得到Book这个类的执行结果,由于函数没有return语句,这个Book函数自然不会告诉book变量的执行结果了,所以book为undefined

var Book = function (id, name, price) {
    this.id = id;
    this.name = name;
    this.price = price;
}
var book = Book(‘12‘, ‘js‘, 30);
console.log(book);//undefined
console.log(window.name);//‘js‘

安全模式

var Book = function (id, name, price) {
    if (this instanceof Book) {
        this.id = id;
        this.name = name;
        this.price = price;
    } else {
        new Book(id, name, price);
    }

}
var book = Book(‘12‘, ‘js‘, 30);
console.log(book);//Book
console.log(book.name);//‘js‘
console.log(window.name);//undefined

原文地址:https://www.cnblogs.com/Griffin/p/9191718.html

时间: 2024-11-04 10:13:54

javascript设计模式系列二-封装的相关文章

Javascript设计模式系列二

创建对象的基本模式,一.门户大开型,二.采用下划线来表示属性和方法的私用性,三.使用闭包来创建私用的成员. 一.门户大开型.只能提供公用成员.所有属性和方法都公开的.可访问的.这些共用属性都要使用this关键字来创建. <script type="text/javascript"> ////定义Dog对象 var Dog = function (name, age) { this.name = name; this.age = age; } Dog.prototype.Sa

设计模式系列二(策略者模式)

浑浑噩噩的过的漫无目的,更多的是迷茫,真不知该如何定位自己的人生?空有远大抱负,而又力不从心!有句话说的好,当你的才能撑不起你的野心的时候,就该静下来心来好好学习了!于是闲来无事,便继续开始我的设计模式之游!今天便研究下策略者模式! 1.策略者模式解析 大话设计模式是这样讲道: 策略者模式是一种定义一系列算法的方法,从概念上来看,所有这些算法完成的都是相同的工作,只是实现不同,它可以以相同的方式调用所有的算法减少各种算法类与使用算法类之间的耦合[DPE]. 个人理解:所谓一系列算法方法就是一系列

Javascript设计模式系列三

继承,一个类或对象继承另一个类或对象的三种方法.类式继承.原型式继承.掺元类. 一.类式继承,原型链.Extend函数. <script type="text/javascript"> ////定义Person类 var Person = function (name) { this.name = name; }; Person.prototype.getName = function () { return this.name; }; ////原型链 function A

JavaScript 闭包系列二 --- 匿名函数及函数的闭包

一. 匿名函数 1. 函数的定义,可分为三种 1) 函数声明方式 function double(x) {    return 2*x;} 2)Function构造函数,把参数列表和函数体都作为字符串,不方便,不建议使用 var double = new Function('x', 'return 2*x;'); 3)函数表达式方式 var double = function(x) {    return 2*x;} 该形式中,等号右边是一个匿名函数,创建函数完毕后,将该函数赋给了变量doubl

读书笔记之 - javascript 设计模式 - 接口、封装和链式调用

javascript 采用设计模式主要有下面的三方面原因: 可维护性:设计模式有助于降低模块之间的耦合程度.这使代码进行重构和换用不同的模块变得容易,也使程序员在大型项目中合作变得容易. 沟通:设计模式为处理不同类型的对象提供了一套通用的术语.程序员可以简洁的描述自己系统的工作方式. 性能:采用一些优化性能的模式,可以大幅度提高程序的执行效率,如享元模式和代理模式等 同时,滥用设计模式也会带来一些后果: 复杂性:代码变得复杂,新手难以理解 性能:多数设计模式会或多或少的降低代码的性能 实现容易,

Javascript设计模式系列一

定义类,方法赋值给prototype属性各种写法: 方法一: 1 <script type="text/javascript"> 2 ////定义Message类 3 var Message = function () { 4 } 5 ////添加方法 6 Message.prototype = { 7 Display: function (msg) { 8 ///弹出 9 alert(msg); 10 } 11 }; 12 13 ////实例化 14 var msg =

javascript 设计模式(二)

(function(){ //在js中我们利用function来定义类 function Shape(){ //在类的内部使用var声明的为私有变量 var x = 1; var y = 1; }; //利用new关键字进行类的实例化 var oShape = new Shape(); console.log(oShape.x);//undefined,类的实例化对象中不能访问到私有变量 //如何在类中定义公有变量 function Parent(){ this.x = 1; this.y =

设计模式系列(二)-抽象工厂

[注]本文还有待修改,现在只提供源码 和 简单分析,后续会做详细说明 1.为什么要使用抽象工厂,一个案例告诉你,对照下面这张图,来看案例 问题: 1.UI展示有时候,需要调用业务A,有时候要调用业务B 2.而业务A,可能使用了MSSQL数据库,也有可能使用了Oracle数据库 3.不管MSSQL数据层,还是Oracle数据层,他们用到的实体都是一样,且数据库需要的方法也类似 分析并解决 1.首先,我们肯定需要一个数据层,那么这个数据层由谁来创建,由谁来调用 [数据层由数据工厂创建 并 赋值给数据

设计模式系列二结构型之(装饰者模式)

1.装饰者模式简介 意图: 动态地给一个对象添加一些额外的职责. 适用性: 在不影响其他对象的情况下,以动态.透明的方式给单个对象添加职责. 处理那些可以撤消的职责. 当不能采用生成子类的方法进行扩充时.一种情况是,可能有大量独立的扩展,为支持每一种组合将产生大量的子类,使得子类数目呈爆炸性增长.另一种情况可能是因为类定义被隐藏,或类定义不能用于生成子类. 2.生活实例 3.装饰者模式结构 4.示意代码 // "Component" abstract class Component {