解析JavaScript函数的多种写法

2018-06-24 01:34:25来源：未知阅读 ()

本文主要分析了JavaScript中函数的几种写法，具体如下：

1、函数的声明和表达式（旧方法，也是最常见的方法）

1 //函数声明  
2 function aaA(){}

1  //命名函数表达式  
2 (function aaA(){});  
3 //需要注意的是，因为整个表达式被一对()包裹，函数的作用于仅仅在()内，在()外部无法访问到函数

1  //匿名函数表达式  
2 (function (){});

2、通过Function构造器

这也是一种从一开始就存在方法，但是因为书写麻烦等原因，相对使用较少

1  new Function('x','y','return x+y;');

3、自从ECMAScript 2015(es6)推出以后，又引进了几种新的语法，具体如下：

(1)not-so-anonymous函数声明

这是一种新的匿名函数声明形式，如果使用过ES Modules的，就知道这种语法。虽然在表达上它与匿名函数非常相似，但它实际上有一个默认的名称‘default’。

1 export default function(){}

此处，这个‘default’本身不是有效的标识符，并且没有绑定在该匿名函数上。

(2)方法定义

对于以下例子，我们可以很容易发现它定义了匿名和命名函数表达式作为属性的值。这些其实不是不同的语法形式，而是之前讨论的函数表达式的示例，是在初始化对象时编写的。

let object={  
　　fn:function(){}  
};  
let object={  
　　fn:function aaA(){}  
};

以上形式最初在ES3中定义，在ES5中引入了访问器属性定义：

1 let object={  
2     get fn(){},  
3     set fn(val){}  
4 };

从ES6开始，JavaScript提供了一个简单的语法来定义方法，这种语法包括文字属性名称和计算属性名称以及访问器形式：

1 let object={  
2     textName(){},  
3     ['computedName'](){},  
4     get ['computedAName'](){},  
5     set ['computedAName'](val){}  
6 };

我们还可以使用这些新形式作为类声明和表达式中的原型方法和定义：

1 let object={  
2     textName(){},  
3     ['computedName'](){},  
4     get ['computedAName'](){},  
5     set ['computedAName'](val){}  
6 };

1 //类表达式  
2 let C=class{
3       textName(){},
4       ['computedName'](){},
5       get ['computedAName'](){},
6       set ['computedAName'](val){}
7 };

以及静态方法：

1  //类声明  
2 class C{     
3 　　static textName(){},  
4 　　static ['computedName'](){},  
5 　　get ['computedAName'](){},     
6 　　set ['computedAName'](val){}  
7 };

1 //类表达式  
2 let C=class{     
3     static textName(){},  
4     static ['computedName'](){},  
5     get ['computedAName'](){},  
6     set ['computedAName'](val){}  
7 };

升成器：

升成器有一种特殊的语法，除了箭头函数=>和定义setter/getter方法的时候不能添加之外，可以被添加在其他所有语法形式之中。我们可以通过其生成函数声明、表达式、定义，甚至是构造函数：

1  //生成器声明  
2 function *AaA(){}

1 //另一种not-so-anonymous生成器声明  
2 export default function *(){}

1  //命名生成器表达式  
2 //AaA对函数外部不可访问  
3 (function *AaA(){});

1 //匿名生成器表达式  
2 (function *(){});

1 //方法定义  
2 let object={  
3     *methodName(){},  
4     *['computedName'](){}  
5 };

1 //类声明中的方法定义  
2 class C{    
3     *methodName(){},  
4     *['computedName'](){}  
5 }

1 //类声明中的静态方法定义  
2 class C{    
3     static *methodName(){},  
4     static *['computedName'](){}  
5 }

1 //类表达式中的方法定义  
2 let C=class{    
3     static *methodName(){},  
4     static *['computedName'](){}  
5 }

1 //类表达式中的静态方法定义  
2 let C=class{    
3     static *methodName(){},  
4     static *['computedName'](){}  
5 }

随笔一篇，欢迎各位方友斧正

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有

上一篇：使用dva脚手架（dva-cli）快速构建React项目

下一篇：select2 插件编辑时设置默认值

IDC资讯：主机资讯注册资讯托管资讯 vps资讯网站建设

网站运营：建站经验策划盈利搜索优化网站推广免费资源

网站联盟：联盟新闻联盟介绍联盟点评网赚技巧

行业资讯：搜索引擎网络游戏电子商务广告传媒

网络编程： Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它

服务器技术： Web服务器 Ftp服务器 Mail服务器 Dns服务器安全防护

软件技巧：其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷

网页制作： FrontPages Dreamweaver Javascript css photoshop fireworks Flash

程序设计： Java技术 C/C++ VB delphi

网络知识：网络协议网络安全网络管理组网方案 Cisco技术

操作系统： Win2000 WinXP Win2003 Mac OS Linux FreeBSD

热门词条

最新资讯

热门关注

热门标签