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 相关文章推荐
Add Formatted Text to a Word Document
Jun 15 Javascript
Jquery动态进行图片缩略的原理及实现
Aug 13 Javascript
php析构函数的具体用法小结
Mar 11 Javascript
javascript面向对象之this关键词用法分析
Jan 13 Javascript
jquery仿百度百科底部浮动导航特效
Aug 08 Javascript
详解javascript跨浏览器事件处理程序
Mar 27 Javascript
jQuery简单获取DIV和A标签元素位置的方法
Feb 07 Javascript
vue-router history模式下的微信分享小结
Jul 05 Javascript
jQuery实现王者荣耀手风琴效果
Jan 17 jQuery
用js限制网页只在微信浏览器中打开(或者只能手机端访问)
Dec 24 Javascript
Windows下安装 node 的版本控制工具 nvm
Feb 06 Javascript
JS高级程序设计之class继承重点详解
Jul 07 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函数addslashes和mysql_real_escape_string的区别
2014/04/22 PHP
php实现购物车功能(下)
2016/01/05 PHP
laravel 获取当前url的别名方法
2019/10/11 PHP
js调用后台servlet方法实例
2013/06/09 Javascript
使用jquery组件qrcode生成二维码及应用指南
2015/02/22 Javascript
JavaScript实现添加及删除事件的方法小结
2015/08/04 Javascript
jQuery validate插件submitHandler提交导致死循环解决方法
2016/01/21 Javascript
vue.js初学入门教程(2)
2016/11/07 Javascript
JS+Canvas实现的俄罗斯方块游戏完整实例
2016/12/12 Javascript
js正则表达式验证表单【完整版】
2017/03/06 Javascript
javascript闭包功能与用法实例分析
2017/04/06 Javascript
Vue Element使用icon图标教程详解(第三方)
2018/02/07 Javascript
如何获取TypeScript的声明文件.d.ts
2018/05/01 Javascript
解决vue this.$forceUpdate() 处理页面刷新问题(v-for循环值刷新等)
2018/07/26 Javascript
JS对日期操作封装代码实例
2019/11/08 Javascript
[16:04]DOTA2海涛带你玩炸弹 9月5日更新内容详解
2014/09/05 DOTA
[03:54]Ehome出征西雅图 回顾2016国际邀请赛晋级之路
2016/08/02 DOTA
连接Python程序与MySQL的教程
2015/04/29 Python
Python中title()方法的使用简介
2015/05/20 Python
在Django的视图中使用form对象的方法
2015/07/18 Python
Python实现TCP/IP协议下的端口转发及重定向示例
2016/06/14 Python
Python库skimage绘制二值图像代码实例
2020/04/10 Python
如何利用python正则表达式匹配版本信息
2020/12/09 Python
Canvas 像素处理之改变透明度的实现代码
2019/01/08 HTML / CSS
丝芙兰巴西官方商城:SEPHORA巴西
2016/10/31 全球购物
法国二手手袋、手表和奢侈珠宝购物网站:Collector Square
2018/07/05 全球购物
元旦晚会主持词
2014/03/24 职场文书
《数星星的孩子》教学反思
2014/04/11 职场文书
普通话宣传标语
2014/06/26 职场文书
司机个人年终总结
2015/03/03 职场文书
舞蹈社团活动总结
2015/05/07 职场文书
生日赠语
2015/06/23 职场文书
诚信考试主题班会
2015/08/17 职场文书
2016年读书月活动总结范文
2016/04/06 职场文书
修改MySQL的数据库引擎为INNODB的方法
2021/05/26 MySQL
JavaScript实现酷炫的鼠标拖尾特效
2022/02/18 Javascript