javascript中的封装

最近的一个小任务，需要写一个jQuery的插件，但是根据jQuery官方的文档http://docs.jquery.com/Plugins/Authoring写得有点头晕，主要是对this对象的理解不够深刻和js基础薄弱引起的。

故又翻开了书本，看了经典了《Javascript高级程序设计》、《JavaScript设计模式》，之前囫囵吞枣看过一遍，印象已经不深了，今天又看了一遍，做一下笔记。

 

封装简单地说就是让外界只能访问对象的共有变量和函数，隐藏细节和数据。

js中有三种方法创建对象，分别为门户大开型、用命名规范区分私有变量、闭包创建真正的私有变量三种。

1.门户大开型，是实现对象的最基础的方法，所有方法与变量都是共有的外界可以访问。

 

                var Book = function(name){
                    if(this.check(name)){
                        console.log("error");
                        throw new Error("name null");
                    }
                    this.name = name;
                }
                Book.prototype = {
                    check:function(name){
                        if(!name){
                            return true;
                        }
                    },
                    getName:function(){
                        return this.name;
                    }
                }

                var book = new Book("哈哈");
                //output:哈哈 哈哈
                console.log(book.name,book.getName());

这个例子是门户大开型的典型，外界能直接访问对象的属性和方法。可以注意到属性和变量都有"this"来创建。

 

2.用命名规范区分私有变量，该方法是门户大开型的优化版本，只不过是在私有变量或方法前面用"_"区分，如果有程序员有意使用_getName()的方法来调用方法，还是无法阻止的，不是真正地将变量隐藏。

 

3.闭包创建真正的私有变量，该方法利用js中只有函数具有作用域的特性，在构造函数的作用域中定义相关变量，这些变量可以被定义域该作用域中的所有函数访问。

 

                var Book2 = function(name){
                    if(check(name)){
                        console.log("error");
                        throw new Error("name null");
                    }
                    name = name;
                    function check(name){
                        if(!name){
                            return true;
                        }
                    }
                    this.getName = function(){
                        return name;
                    }
                }
                Book2.prototype = {
                    display:function(){
                        //无法直接访问name
                        return "display:"+this.getName();
                    }
                }
                var book2 = new Book2("哈哈");
                //output:undefined "哈哈" "display:哈哈"
                console.log(book2.name,book2.getName(),book2.display());

 可以看到，这个例子中的结果，直接访问name会返回undefined的结果。可以看到这个例子与门户大开型的区别，门户大开型中的变量使用"this"来创建，而这个例子中使用var来创建，check函数也是如此，使得name与check函数只能在构造函数的作用域中访问，外界无法直接访问。

该方法解决了前两种方法的问题，但是也有一定的弊端。在门户大开型对象创建模式中，所有方法都创建在原型对象中，因此不管生成多少对象实例，这些方法在内存中只存在一份，而采用该方法，每生成一个新的对象都会为每个私有变量和方法创建一个新的副本，故会耗费更多的内存。

 

相关阅读：

学习javascript闭包

Javascript继承机制的设计原理