当前位置: 首页 > 科技观察

谈谈对JavaScript中函数的多元理解

时间:2023-03-22 11:53:27 科技观察

JavaScript中的函数有多重含义。它可能是一个构造器(constructor),它承担了一个对象模板的角色;它可能是一个对象方法(method),它负责向对象发送消息。也可能是一个函数,没错,函数,一个可以独立于对象调用的函数。由于语言设计者的妥协,在JavaScript中加入了一些与类相关的特性,使JavaScript看起来像Java,可以“面向对象”。JavaScript虽然加了new和this,但是它没有class(ES加了)。***函数暂时承担了类的任务。语义1:函数作为构造函数12345678910111213141516171819202122/***tab**@classTab*@paramnav{string}tab标题类*@paramcontent{string}页面内容类**/functionTab(nav,content){this.nav=nav;this.content=内容;}Tab.prototype.getNav=function(){返回这个.nav;};Tab.prototype.setNav=function(nav){this.nav=nav;};Tab.prototype.add=function(){};//创建对象vartab=newTab('tab-nav','tab-content');  这里定义了一个类Tab,创建了一个对象tab,使用了函数this,new。this、new是常见的面向对象语言中的关键字,这里的function承担着传统面向对象语言中class的作用。当然,此时标识符的命名一般都遵循“首字母大写”的规则。语义二:作为对象方法的函数由于在JavaScript中可以直接创建对象而无需类,因此有两种方法可以为对象添加方法。第一种是先定义类,方法挂在原型上,比如上例中的Tab,原型上有getNav、setNav和add方法。下面还有一种方法,就是直接在函数中添加this上的方法。12345678910111213functionTab(nav,content){this.nav=navthis.content=contentthis.getNav=function(){//...}this.setNav=function(){//...}this.add=function(){//...}}  这里Tab是语义,this.getNav/this.setNav/this.add是语义,作为对象方法.另外,可以直接定义对象及其方法12345678910111213vartab={nav:'',content:'',getNav:function(){//...},setNav:function(){//...},add:function(){//...}}  tab.getNav/tab.setNav/tab.add是对象tab的方法。语义3:作为独立函数123456789101112131415161718192021222324252627/**判断对象是否为空对象*@paramobj{Object}*@return{boolean}*/functionisEmpty(obj){for(varainobj){returnfalse}returntrue}//定义一个模块~function(){//辅助函数functionnow(){return(newDate).getTime()}//模块逻辑...}();//以CommonJS规范的方式定义一个模块define(require,exports,moduel){//辅助函数functionnow(){return(newDate).getTime()}//模块逻辑...})  isEmpty作为全局函数存在,现在在模块定义中作为局部存在function,不管isEmpty还是now,这里的function指的是一个函数,不依赖于对象和类,可以独立调用语义4:匿名函数定义模块12345678910111213141516171819202122232425262728293031//全局命名空间varRUI={}//ajax.js~function(R){//辅助函数...ajax={request:function(){//...}getJSON:function(){//...}...}//暴露导出R的模块R.ajax=ajax}(RUI);//event.js~function(R){//辅助函数...//事件模块定义...//将模块暴露给RR.event=event}(RUI);//dom.js~function(R){//辅助函数...//DON模块定义...//将模块暴露给RR.dom=dom}(RUI);  这里的匿名函数在执行后将API对象暴露给RUI。无论在匿名函数中做了多少工作,在对应的匿名函数之外是看不到的,也没有必要最后关心的是公共API方法,只要了解这些方法的参数和含义,您可以立即使用它们。Semantic5:Anonymousjsfunction处理一些特殊的效果比如处理一些数据而不暴露太多变量1234567891011//判断IE版本的hack方法varIEVersion=function(){varundef,v=vardiv=document.createElement('div')varall=div.getElementsByTagName('i')while(div.innerHTML='',all[]);返回v>?v:undef}();变量都可以被隔离。这种方法对于一些临时数据的处理是非常有效和紧凑的。总结:JavaScript是Eich经过很长一段时间设计出来的。它最初是一种简短紧凑的脚本/函数式语言。出于市场原因,为了迎合Java,一些类似Java的面向对象特性(constructor、this、new)。this和new是copy过来的,只是class的功能交给了function。这导致JavaScript函数容易混淆,有时它被用来定义一个类,有时它被用作方法或函数。另一批人也发现它可以用来定义模块等等。这一切随着ES的到来而结束,ES中的保留字“class”终于实现了,推荐使用class来定义类。另外还有extend关键字,基本实现了“类继承”。Douglas在Nordic.js大会上评论说ES最糟糕的设计之一就是class,不推荐使用this和new,这说明他还是倾向于使用函数式语言来写JavaScript,而不是基于class面向对象。以上内容是我个人对JavaScript中函数的理解。欢迎有不同理解的朋友一起分享学习。