Javascript设计模式学习(二)封装续

简介:   有一个避免其他程序员无意间写出重名函数的办法,在你想作为私有属性或者私有方法的命名前加一个下划线,像这样 this._name = name;,这样虽然不能避免所有的错误,但是能够避免绝大多数的无意识命名引起的冲突。

 

有一个避免其他程序员无意间写出重名函数的办法,在你想作为私有属性或者私有方法的命名前加一个下划线,像这样 this._name = name;,这样虽然不能避免所有的错误,但是能够避免绝大多数的无意识命名引起的冲突。

 

Scope,Nested Functions,and Closures

 

在实现私有属性的封装之前,我们需要一些基础的概念支持。在Javascript中,只有函数拥有作用域,也就是说,函数内部定义的变量,在外部是无法访问的。只有函数外部定义的变量,在函数内部才能访问。下面是一个说明的例子:

function foo(){

    var = 10;

    function bar(){

    a *= 2;

}

bar();

return a;

}

在这个例子中,a被定义在foo函数中,可是函数bar中可以访问a,是因为bar函数被定义在了foo函数中。当bar被执行时,他就能够使a的值翻倍,这是bar在foo内部执行,如果bar在foo外部执行会怎么样呢,看下面的例子:

function foo(){

    var a = 10;

    function bar(){

        a *= 2;

        return a;

}

return bar;

}

 

var baz = foo();

baz();    //返回20;

baz();    //返回40;

baz();    //返回80;

 

上例中函数返回的是一个对于bar的引用,把这个引用传递给baz,在执行的时候,他仍可以访问变量a。这是为什么呢?因为Javascript支持语义上作用域,函数运行是在他被定义的域中,而不是他在被执行的域中。这个例子中bar因为被定义在foo的内部,所以当他在外部被执行时,仍然可以访问内部的变量a。

    以上就是一个Closure的例子,只有foo中被返回的函数能够访问foo中的变量,最常见的创建Closure的方法就是返回一个Nested Function。

 

利用Closure创建私有方法

有了上面的基础,我们就能够实现私有方法了,如下:

            var NewHouse = function(hid,hname,address){

                var _hid,_hname,_address;

                

                function isValid(hid){

                    if(hid != null && hid != undefined & hid != ""){

                        return true;

                    }else{

                        return false;

                    }

                }

                

                this.getHid = function(){

                    return _hid;

                }

                

                this.setHid = function(hid){

                    if(!isValid(hid)){

                        _hid = hid;

                    }

                }

                

                this.getHname = function(){

                    return _hname;

                }

                

                this.setHname = function(hname){

                    _hname = hname || "暂无";

                }

                

                this.getAddress = function(){

                    return _address;

                }

                

                this.setAddress = function(address){

                    _address = address || "暂无";

                }

                

                this.setHid(hid);

                this.setHname(hname);

                this.setAddress(address);

            }

            

            NewHouse.prototype.ShowHouse = function(){

                document.getElementById("container").innerHTML += "楼盘名称:" + this.hname + "<br />";                

            }

 

可以看到,之前的例子中一直用this关键字来引用属性,而我们这里用了var来定义属性,所以属性在对象外是不能够被访问的。对于一些公共的方法,我们仍然可以利用prototype来定义他们。

    这个方法的缺陷是我们每建一个对象,对于内部的方法对要被初始化一下,而这是要消耗内存的,我们实例的对象越多,消耗的内存也就越多。所以这个方法只试用在真正需要私有化属性和方法的地方,其他的地方我们仍然可以用完全暴露的方法来做。

相关文章
|
1月前
|
设计模式 JavaScript 算法
浅谈几种js设计模式
设计模式是软件开发中的宝贵工具,能够提高代码的可维护性和扩展性。通过单例模式、工厂模式、观察者模式和策略模式,我们可以解决不同场景下的实际问题,编写更加优雅和高效的代码。
29 8
|
2月前
|
设计模式 数据安全/隐私保护
Next.js 实战 (七):浅谈 Layout 布局的嵌套设计模式
这篇文章介绍了在Next.js框架下,如何处理中后台管理系统中特殊页面(如登录页)不包裹根布局(RootLayout)的问题。作者指出Next.js的设计理念是通过布局的嵌套来创建复杂的页面结构,这虽然保持了代码的整洁和可维护性,但对于特殊页面来说,却造成了不必要的布局包裹。文章提出了一个解决方案,即通过判断页面的skipGlobalLayout属性来决定是否包含RootLayout,从而实现特殊页面不包裹根布局的目标。
123 33
|
4月前
|
设计模式 前端开发 JavaScript
JavaScript设计模式及其在实战中的应用,涵盖单例、工厂、观察者、装饰器和策略模式
本文深入探讨了JavaScript设计模式及其在实战中的应用,涵盖单例、工厂、观察者、装饰器和策略模式,结合电商网站案例,展示了设计模式如何提升代码的可维护性、扩展性和可读性,强调了其在前端开发中的重要性。
67 2
|
4月前
|
Web App开发 JavaScript 前端开发
如何学习JavaScript?
如何学习JavaScript?
97 5
|
4月前
|
JavaScript 前端开发 索引
JavaScript学习第二章--字符串
本文介绍了JavaScript中的字符串处理,包括普通字符串和模板字符串的使用方法及常见字符串操作方法如`charAt`、`concat`、`endsWith`等,适合前端学习者参考。作者是一位热爱前端技术的大一学生,专注于分享实用的编程技巧。
52 2
|
4月前
|
存储 JavaScript 前端开发
JavaScript学习第一章
本文档介绍了JavaScript的基础知识,包括其在网页中的作用、如何通过JavaScript动态设置HTML元素的CSS属性,以及JavaScript中的变量类型(`var`、`let`、`const`)和数据类型(基本数据类型与引用数据类型)。通过实例代码详细解释了JavaScript的核心概念,适合初学者入门学习。
78 1
|
5月前
|
JavaScript
js学习--商品列表商品详情
js学习--商品列表商品详情
60 2
|
5月前
|
JavaScript
js学习--开屏弹窗
js学习--开屏弹窗
68 1
|
5月前
|
JavaScript 前端开发 容器
js之dom学习
js之dom学习
103 0
|
10月前
|
设计模式 JavaScript 算法
js设计模式-策略模式与代理模式的应用
策略模式和代理模式是JavaScript常用设计模式。策略模式通过封装一系列算法,使它们可互换,让算法独立于客户端,提供灵活的选择。例如,定义不同计算策略并用Context类执行。代理模式则为对象提供代理以控制访问,常用于延迟加载或权限控制。如创建RealSubject和Proxy类,Proxy在调用RealSubject方法前可执行额外操作。这两种模式在复杂业务逻辑中发挥重要作用,根据需求选择合适模式解决问题。

热门文章

最新文章