javascript 之 命名空间

注意点:

1/IIFE是现代js框架最主要的基础设施,保证变量不被污染。

2/基本上我们把命名空间等同于框架的名字。

内容

一、简单的命名空间

<input type="button" value="test" onclick="(new namespace()).alert();"/>
        
        <script type="text/javascript">
            function namespace(){
                this.alert=function(){
                    console.log('test');
                }
            }
        </script>
说明:再这里可以看到,namespace方法存在一个函数对象属性,调用时还需要先实例化namespace再调用其自身的alert方法,似乎存在写法略显复杂
测验结果:在这里我曾理解为 onclick 调用mm()方法 function mm(){ namespace().alert(); } 这样写会报错的 ,而且namespace()句话就报错,不存在
分析看到这段代码中存在this对象,让我想起了一篇文章什么情况下使用this,其中需要理解一下,什么是构造函数,需要用到关键字 new,所以这的namespance应该写成Namespance

二、简单的命名空间的进化

<input type="button" value="test" onclick="NS.alert();"/>
        
        <script type="text/javascript">
            (function namespace(){
                this.alert=function(){
                    console.log('test');
                }
                
                window.NS=this;
            })();
        </script>
说明:在这里可以看到 使用了window.NS全局变量,同时使用了IIFE,使得调用变得简便一些

三、简单的命名空间的再次美化

(function (){
                this.alert=function(){
                    console.log('test');
                }
                
                window.NS=this;
            })();
在这里使用了匿名函数,namespance是可以拿掉的 (function(){ var _NS=function(){ } _NS.prototype.alert=function(){ console.log('test'); } window.NS=new _NS(); })();
在写看扩展方法的时候,可以写在prototype里面

  

原文地址:https://www.cnblogs.com/zmztya/p/11326009.html