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入门·动态的时钟,显示完整的一些方法,新年倒计时
Oct 01 Javascript
JSON传递bool类型数据的处理方式介绍
Sep 18 Javascript
JS数组合并push与concat区别分析
Dec 17 Javascript
node.js 和HTML5开发本地桌面应用程序
Dec 13 Javascript
原生JS实现九宫格抽奖效果
Apr 01 Javascript
关于 angularJS的一些用法
Nov 29 Javascript
AngularJs点击状态值改变背景色的实例
Dec 18 Javascript
JS把字符串格式的时间转换成几秒前、几分钟前、几小时前、几天前等格式
Jul 10 Javascript
Element-ui DatePicker显示周数的方法示例
Jul 19 Javascript
JS使用H5实现图片预览功能
Sep 30 Javascript
vue 解决uglifyjs-webpack-plugin打包出现报错的问题
Aug 04 Javascript
react合成事件与原生事件的相关理解
May 13 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
PHP遍历XML文档所有节点的方法
2015/03/12 PHP
php为字符串前后添加指定数量字符的方法
2015/05/04 PHP
thinkPHP连接sqlite3数据库的实现方法(附Thinkphp代码生成器下载)
2016/05/27 PHP
document.all还是document.getElementsByName?
2006/07/21 Javascript
jquery插件珍藏(图片局部放大/信息提示框)
2013/01/08 Javascript
jquery 提示信息显示后自动消失的具体实现
2013/12/18 Javascript
js实现的map方法示例代码
2014/01/13 Javascript
jquery控制页面部分刷新的方法
2015/06/24 Javascript
基于OL2实现百度地图ABCD marker的效果
2015/10/01 Javascript
jQuery Validate初步体验(一)
2015/12/12 Javascript
JavaScript的ExtJS框架中表格的编写教程
2016/05/21 Javascript
JavaScript对象创建模式实例汇总
2016/10/03 Javascript
AngularJS变量及过滤器Filter用法分析
2016/11/22 Javascript
JavaScript高阶函数_动力节点Java学院整理
2017/06/28 Javascript
vue多页面开发和打包正确处理方法
2018/04/20 Javascript
JS实现把一个页面层数据传递到另一个页面的两种方式
2018/08/13 Javascript
如何在vue项目中嵌入jsp页面的方法(2种)
2020/02/06 Javascript
原生js实现拖拽移动与缩放效果
2020/08/24 Javascript
[01:31:22]DOTA2-DPC中国联赛定级赛 LBZS vs Magma BO3第二场 1月10日
2021/03/11 DOTA
神经网络(BP)算法Python实现及应用
2018/04/16 Python
Python中矩阵创建和矩阵运算方法
2018/08/04 Python
python机器学习之KNN分类算法
2018/08/29 Python
对Python3+gdal 读取tiff格式数据的实例讲解
2018/12/04 Python
世界上最大的曲棍球商店:Pro Hockey Life
2017/10/30 全球购物
佳能法国商店:Canon法国
2019/02/14 全球购物
瑞典度假品牌:OAS
2019/05/28 全球购物
一套C#面试题
2013/10/09 面试题
一套软件开发工程师笔试题
2015/05/18 面试题
银行会计职员个人的自我评价
2013/09/29 职场文书
毕业生的自我评价范文
2013/12/31 职场文书
五型班组建设方案
2014/02/10 职场文书
汉语言文学毕业生自荐信范文
2014/03/24 职场文书
欢度春节标语
2014/07/01 职场文书
2014年军人思想汇报范文
2014/10/12 职场文书
2015毕业设计工作总结
2015/07/24 职场文书
2016年清明节期间群众祭祀活动工作总结
2016/04/01 职场文书