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 相关文章推荐
jQuery autocomplate 自扩展插件、自动完成示例代码
Mar 28 Javascript
jquery中dom操作和事件的实例学习 下拉框应用
Dec 01 Javascript
javascript之typeof、instanceof操作符使用探讨
May 19 Javascript
通过JS来判断页面控件是否获取焦点
Jan 03 Javascript
jQuery实现表格行上下移动和置顶效果
Jun 05 Javascript
BootStrap智能表单实战系列(六)表单编辑页面的数据绑定
Jun 13 Javascript
bootstrap datetimepicker日期插件使用方法
Jan 13 Javascript
js学习心得_一个简单的动画库封装tween.js
Jul 14 Javascript
vue基于Element构建自定义树的示例代码
Sep 19 Javascript
vue 页面加载进度条组件实例
Feb 05 Javascript
基于vue框架手写一个notify插件实现通知功能的方法
Mar 31 Javascript
JavaScript数组去重实现方法小结
Jan 17 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
Zend Guard一些常见问题解答
2008/09/11 PHP
Laravel框架学习笔记(一)环境搭建
2014/10/15 PHP
php实现html标签闭合检测与修复方法
2015/07/09 PHP
laravel model 两表联查示例
2019/10/24 PHP
CSS JavaScript 实现菜单功能 改进版
2008/12/09 Javascript
jQuery ul标签下拉菜单演示代码
2010/12/11 Javascript
JavaScript高级教程5.6之基本包装类型(详细)
2015/11/23 Javascript
AngularJS入门教程之路由与多视图详解
2016/08/19 Javascript
JavaScript 冒泡排序和选择排序的实现代码
2016/09/03 Javascript
es7学习教程之Decorators(修饰器)详解
2017/07/21 Javascript
通过示例彻底搞懂js闭包
2017/08/10 Javascript
vue  directive定义全局和局部指令及指令简写
2018/11/20 Javascript
微信JS-SDK updateAppMessageShareData安卓不能自定义分享详解
2019/03/29 Javascript
layui原生表单验证的实例
2019/09/09 Javascript
2019最新21个MySQL高频面试题介绍
2020/02/06 Javascript
Vue开发中遇到的跨域问题及解决方法
2020/02/11 Javascript
微信小程序学习总结(四)事件与冒泡实例分析
2020/06/04 Javascript
如何利用Node.js与JSON搭建简单的动态服务器
2020/06/16 Javascript
使用纯前端JavaScript实现Excel导入导出方法过程详解
2020/08/07 Javascript
python操作gmail实例
2015/01/14 Python
python实现rsa加密实例详解
2017/07/19 Python
TensorFlow深度学习之卷积神经网络CNN
2018/03/09 Python
对web.py设置favicon.ico的方法详解
2018/12/04 Python
Python多线程应用于自动化测试操作示例
2018/12/06 Python
Python进阶之使用selenium爬取淘宝商品信息功能示例
2019/09/16 Python
给Python学习者的文件读写指南(含基础与进阶)
2020/01/29 Python
Spring @Enable模块驱动原理及使用实例
2020/06/23 Python
Python3+Appium安装及Appium模拟微信登录方法详解
2021/02/16 Python
HTML 5 标签、属性、事件及浏览器兼容性速查表 附打包下载
2012/10/20 HTML / CSS
安德玛菲律宾官网:Under Armour菲律宾
2020/07/28 全球购物
介绍一下Python下range()函数的用法
2013/11/07 面试题
奥利奥广告词
2014/03/20 职场文书
大学拉赞助协议书范文
2014/09/26 职场文书
《吃水不忘挖井人》教学反思
2016/02/22 职场文书
交通事故协议书范本
2016/03/19 职场文书
sqlserver2017共享功能目录路径不可改的解决方法
2021/04/16 SQL Server