JS定义函数的几种常用方法小结


Posted in Javascript onMay 23, 2019

本文实例讲述了JS定义函数的几种常用方法。分享给大家供大家参考,具体如下:

在 JavaScript 语言里,函数是一种对象,所以可以说函数是 JavaScript 里的一等公民(first-class citizens)。

之前我们这样定义过一个函数:

function greet(greeting, name) {
 return `${greeting}, ${name}`
}

因为在 JavaScript 里面是对象(object),所以它会有一些属性还有方法。比如 name 属性是函数的名字,length 属性指的是函数里面有多少个必须要传递的参数。比如访问上面定义的这个函数里的两个属性:

greet.name
// 输出 greet
greet.length
// 输出 2,表示有两个参数

函数都是 Function 的实例,所以你可以访问 Function 上定义的属性:name,length,可以使用方法:apply(),call()。可以这样证明:

greet instanceof Function
// 返回 'true'

函数表达式

函数是对象,也可以说函数是一个值,因为在 JavaScript 里面,它跟其它类型的值是一样的,比如字符串,数字。这就可以让我们使用函数表达式的方法来定义函数,也就是定义一个匿名函数(anonymous function),再把它交给一个变量。像这样:

var greet = function (greeting, name) {
 return `${greeting}, ${name}`
}

Lambda 表达式

ES6 可以让我们用 Lambda 表达式,也就是箭头函数(fat arrow function),看起来像这样:

var greet = (greeting, name) => {
 return `${greeting}, ${name}`
}

上面这个函数的主体部分只有一行,就是 return 了一个字符串,所以我们可以让它更简洁一些:

var greet = (greeting, name) => `${greeting}, ${name}`

箭头右边的东西会自动被返回(return)。

对象里的方法

如果有一个函数是在一个对象里,一般我们称这种函数是对象的一个方法(method)。

试一下:

var obj = {
 greet: function (greeting, name) {
  return `${greeting}, ${name}`
 }
}

ES6 可以让我们这样为对象定义方法:

var obj = {
 greet (greeting, name) {
  return `${greeting}, ${name}`
 }
}

上面定义了一个名字是 obj 的对象,在它里面添加了一个叫 greet 的方法。要使用这个方法可以这样:

obj.greet('hello', ' my name is X ')
// 返回 “ hello, my name is X ”

更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JavaScript入门教程(6) Window窗口对象
Jan 31 Javascript
A标签触发onclick事件而不跳转的多种解决方法
Jun 27 Javascript
Js制作简单弹出层DIV在页面居中 中间显示遮罩的具体方法
Aug 08 Javascript
jquery实现pager控件示例
Apr 09 Javascript
js数组去重的方法汇总
Jul 29 Javascript
jquery实现平滑的二级下拉菜单效果
Aug 26 Javascript
AngularJS全局scope与Isolate scope通信用法示例
Nov 22 Javascript
JavaScript中localStorage对象存储方式实例分析
Jan 12 Javascript
微信小程序的生命周期的详解
Oct 19 Javascript
fullpage.js最后一屏滚动方式
Feb 06 Javascript
koa-router源码学习小结
Sep 07 Javascript
代码解析React中setState同步和异步问题
Jun 03 Javascript
vue-test-utils初使用详解
May 23 #Javascript
了解前端理论:rscss和rsjs
May 23 #Javascript
微信小程序使用字体图标的方法
May 23 #Javascript
个人小程序接入支付解决方案
May 23 #Javascript
一篇文章介绍redux、react-redux、redux-saga总结
May 23 #Javascript
微信小程序上传图片到php服务器的方法
May 23 #Javascript
React精髓!一篇全概括小结(急速)
May 23 #Javascript
You might like
多重?l件?合查?(一)
2006/10/09 PHP
php不用内置函数对数组排序的两个算法代码
2010/02/08 PHP
适用于php-5.2 的 php.ini 中文版[金步国翻译]
2011/04/17 PHP
PHP中把stdClass Object转array的几个方法
2014/05/08 PHP
php+mysql查询实现无限下级分类树输出示例
2016/10/03 PHP
PHP通过curl获取接口URL的数据方法
2018/05/31 PHP
JS之小练习代码
2008/10/12 Javascript
javascript 常用方法总结
2009/06/03 Javascript
jquery 模式对话框终极版实现代码
2009/09/28 Javascript
jQuery渐变发光导航菜单的实例代码
2013/03/27 Javascript
Node.js异步I/O学习笔记
2014/11/04 Javascript
jquery搜索框效果实现方法
2015/01/16 Javascript
js实现适用于素材网站的黑色多级菜单导航条效果
2015/08/24 Javascript
TinyMCE汉化及本地上传图片功能实例详解
2016/05/31 Javascript
Bootstrap框架安装使用详解
2017/01/21 Javascript
Vue 中的compile操作方法
2018/02/26 Javascript
10分钟彻底搞懂Http的强制缓存和协商缓存(小结)
2018/08/30 Javascript
解决vuecli3.0热更新失效的问题
2018/09/19 Javascript
微信小程序实现下拉菜单切换效果
2020/03/30 Javascript
vue指令v-html使用过滤器filters功能实例
2019/10/25 Javascript
vue 自定指令生成uuid滚动监听达到tab表格吸顶效果的代码
2020/09/16 Javascript
[02:31]2014DOTA2国际邀请赛2009专访:干爹表现出乎意料 看好DK杀回决赛
2014/07/20 DOTA
Python json 错误xx is not JSON serializable解决办法
2017/03/15 Python
Python QQBot库的QQ聊天机器人
2019/06/19 Python
python中class的定义及使用教程
2019/09/18 Python
css3气泡 css3关键帧动画创建的动态通知气泡
2013/02/26 HTML / CSS
波兰最大的儿童服装连锁店之一:5.10.15.
2018/02/11 全球购物
Java面试题:请说出如下代码的输出结果
2013/04/22 面试题
销售简历自我评价怎么写
2014/09/26 职场文书
博士生专家推荐信
2015/03/25 职场文书
2016春季田径运动会广播稿
2015/12/21 职场文书
七年级生物教学反思
2016/02/20 职场文书
销区经理年终述职报告模板
2019/11/28 职场文书
GoLang中生成UUID唯一标识的实现
2021/05/08 Golang
Python趣味爬虫之用Python实现智慧校园一键评教
2021/05/28 Python
js 实现验证码输入框示例详解
2022/09/23 Javascript