浅谈JavaScript的函数及作用域


Posted in Javascript onDecember 30, 2016

函数和作用域是JavaScript的重要组成部分,我们在使用JavaScript编写程序的过程中经常要用到这两部分内容,作为初学者,我经常有困惑,借助写此博文来巩固下之前学习的内容。

(一)JavaScript函数

JavaScript函数是指一个特定代码块,可能包含多条语句,可以通过名字来供其他语句调用以执行函数包含的代码语句。

1.JavaScript创建函数的方法有两种:

函数声明:

function funcDeclaration(){ return 'A is a function'; }

函数表达式:

var funExpression=function(){ return 'A is a function '; }

上述函数声明和函数表达式的区别(注明:翻译自:不同的方式来写一个函数)在:

JavaScript解析器中存在一种变量声明被提升(hosting)的机制,也就是说变量(函数)的声明会被提升到作用域的最前面,即使写代码的时候是写在最后面,也还是会被提升至最前面。

例如以下代码段:

alert(foo); // function foo() {}
alert(bar); // undefined
function foo() {}
var bar = function bar_fn() {};
alert(foo); // function foo() {}
alert(bar); // function bar_fn() {}

输出结果分别是function foo() {} 、undefined 、function foo() {} 和function bar_fn() {} 。

可以看到foo 的声明写在alert之后,仍然可以被正确调用,因为JavaScript解释器会将其提升到alert前面,而以函数表达式创建的函数bar则不享受此待遇。

所以,JavaScript 引擎执行以上代码的顺序可能是这样的:

  • 创建变量foo和 bar,并将它们都赋值为undefined。
  • 创建函数 foo 的函数体,并将其赋值给变量foo。
  • 执行前面的两个 alert。
  • 创建函数 bar_fn ,并将其赋值给 bar。
  • 执行后面的两个 alert。

2.函数的参数

在调用函数时,你可以向其传递值,这些值被称为参数。

function printName(name){
  console.log(name);
}
printName('Byron');
printName('Casper);

其中name是形参,'Byron'和'Casper'是实参。

说到函数的参数,我们不得不提到arguments。此处涉及的内容有点多,请看客们参考楼主之前转载的javascript arguments。

3.函数重载

重载是很多面向对象语言实现多态性的手段之一,在静态语言中确定一个函数的手段是靠方法签名--函数名+参数列表,也就是说相同名字的函数参数个数不同或者顺序不同都被认为是不同的函数,成为函数重载。

在JavaScript中没有函数重载的概念,函数通过名字确定唯一性,参数不同也被认为是相同的函数,后面的覆盖前面的。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
jquery validator 插件增加日期比较方法
Feb 21 Javascript
javascript中删除指定数组中指定的元素的代码
Feb 12 Javascript
标题过长使用javascript按字节截取字符串
Apr 24 Javascript
JS 弹出层 定位至屏幕居中示例
May 21 Javascript
JQuery中使用ajax传输超大数据的解决方法
Jul 14 Javascript
jQuery动态修改超链接地址的方法
Feb 13 Javascript
Node.js检测端口(port)是否被占用的简单示例
Sep 29 Javascript
Vue实现路由跳转和嵌套
Jun 20 Javascript
vue Element-ui input 远程搜索与修改建议显示模版的示例代码
Oct 19 Javascript
微信小程序request请求封装,验签代码实例
Dec 04 Javascript
vue组件中实现嵌套子组件案例
Aug 31 Javascript
Webpack的Loader和Plugin的区别
Nov 09 Javascript
解析ajaxFileUpload 异步上传文件简单使用
Dec 30 #Javascript
JS实现的样式切换功能tableCSS实例
Dec 30 #Javascript
浅谈js script标签中的预解析
Dec 30 #Javascript
jQuery实现页面顶部下拉广告
Dec 30 #Javascript
jQuery Password Validation密码验证
Dec 30 #Javascript
JS编写函数实现对身份证号码最后一位的验证功能
Dec 29 #Javascript
EasyUI学习之Combobox下拉列表(1)
Dec 29 #Javascript
You might like
php实现字符串反转输出的方法
2015/03/14 PHP
PHP 自动加载的简单实现(推荐)
2016/08/12 PHP
在 Laravel 项目中使用 webpack-encore的方法
2019/07/21 PHP
js数据验证集合、js email验证、js url验证、js长度验证、js数字验证等简单封装
2010/05/15 Javascript
jQuery调用WebService的实现代码
2011/06/19 Javascript
Fastest way to build an HTML string(拼装html字符串的最快方法)
2011/08/20 Javascript
jQuery平滑旋转幻灯片特效代码分享
2015/09/07 Javascript
仿Angular Bootstrap TimePicker创建分钟数-秒数的输入控件
2016/07/01 Javascript
jQuery解析与处理服务器端返回xml格式数据的方法详解
2016/07/04 Javascript
js HTML5上传示例代码完整版
2016/10/10 Javascript
JavaScript的六种继承方式(推荐)
2017/06/26 Javascript
EasyUI Tree树组件无限循环的解决方法
2017/09/27 Javascript
Angular实现搜索框及价格上下限功能
2018/01/19 Javascript
原生JS实现简单的倒计时功能示例
2018/08/30 Javascript
vue实现弹框遮罩点击其他区域弹框关闭及v-if与v-show的区别介绍
2018/09/29 Javascript
Vue项目使用localStorage+Vuex保存用户登录信息
2019/05/27 Javascript
使用JQuery自动完成插件Auto Complete详解
2019/06/18 jQuery
使用axios请求时,发送formData请求的示例
2019/10/29 Javascript
[08:08]DOTA2-DPC中国联赛2月28日Recap集锦
2021/03/11 DOTA
python实现2048小游戏
2015/03/30 Python
python3.4用循环往mysql5.7中写数据并输出的实现方法
2017/06/20 Python
python修改txt文件中的某一项方法
2018/12/29 Python
运用Python的webbrowser实现定时打开特定网页
2019/02/21 Python
使用jupyter Nodebook查看函数或方法的参数以及使用情况
2020/04/14 Python
一个J2EE项目团队的主要人员组成是什么
2012/06/04 面试题
教学大赛获奖感言
2014/01/15 职场文书
班级入场式解说词
2014/02/01 职场文书
简单通用的简历自我评价
2014/09/21 职场文书
离职报告范文
2014/11/04 职场文书
学校计划生育责任书
2015/05/09 职场文书
2015年财务人员个人工作总结
2015/07/27 职场文书
我爱我班主题班会
2015/08/13 职场文书
创业计划书详解
2019/07/19 职场文书
使用Selenium实现微博爬虫(预登录、展开全文、翻页)
2021/04/13 Python
redis实现的四种常见限流策略
2021/06/18 Redis
Nginx下SSL证书安装部署步骤介绍
2021/12/06 Servers