浅谈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 相关文章推荐
js 操作select相关方法函数
Dec 06 Javascript
仿中关村在线首页弹出式广告插件(jQuery版)
May 03 Javascript
jQuery使用技巧简单汇总
Apr 18 Javascript
jquery实现下拉菜单的二级联动利用json对象从DB取值显示联动
Mar 27 Javascript
AngularJS基础知识笔记之表格
May 10 Javascript
IE7浏览器窗口大小改变事件执行多次bug及IE6/IE7/IE8下resize问题
Aug 21 Javascript
jQuery EasyUI结合zTree树形结构制作web页面
Sep 01 jQuery
JS兼容所有浏览器的DOMContentLoaded事件
Jan 12 Javascript
vue使用xe-utils函数库的具体方法
Mar 06 Javascript
jQuery实现的上传图片本地预览效果简单示例
Mar 29 jQuery
浅谈发布订阅模式与观察者模式
Apr 09 Javascript
Node.js系列之连接DB的方法(3)
Aug 30 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
文章推荐系统(三)
2006/10/09 PHP
php array_merge下进行数组合并的代码
2008/07/22 PHP
php数组函数序列之array_key_exists() - 查找数组键名是否存在
2011/10/29 PHP
php实现Mysql简易操作类
2015/10/11 PHP
php自定义分页类完整实例
2015/12/25 PHP
基于laravel Request的所有方法详解
2019/09/29 PHP
PHPUnit + Laravel单元测试常用技能
2019/11/06 PHP
在javascript将NodeList作为Array数组处理的方法
2010/07/09 Javascript
JavaScript初学者需要了解10个小技巧
2010/08/25 Javascript
jQuery应用之jQuery链用法实例
2015/01/19 Javascript
jquery遍历table的tr获取td的值实现方法
2016/05/19 Javascript
JS实现的自定义显示加载等待图片插件(loading.gif)
2016/06/17 Javascript
AngularJS之依赖注入模拟实现
2016/08/19 Javascript
详解webpack+gulp实现自动构建部署
2017/06/29 Javascript
JavaScript选取(picking)和反选(rejecting)对象的属性方法
2017/08/16 Javascript
vue 微信授权登录解决方案
2018/04/10 Javascript
关于js陀螺仪的理解分析
2019/04/11 Javascript
富文本编辑器vue2-editor实现全屏功能
2019/05/26 Javascript
python对字典进行排序实例
2014/09/25 Python
Python实现批量下载文件
2015/05/17 Python
python 开发的三种运行模式详细介绍
2017/01/18 Python
Python+Socket实现基于UDP协议的局域网广播功能示例
2017/08/31 Python
django小技巧之html模板中调用对象属性或对象的方法
2018/11/30 Python
对dataframe数据之间求补集的实例详解
2019/01/30 Python
python可视化实现KNN算法
2019/10/16 Python
Python 项目转化为so文件实例
2019/12/23 Python
利用python3筛选excel中特定的行(行值满足某个条件/行值属于某个集合)
2020/09/04 Python
美国在线咖啡、茶和餐厅供应商:LollicupStore
2018/05/04 全球购物
Wiggle美国:英国骑行、跑步、游泳、铁人三项商店
2018/10/27 全球购物
私有程序集与共享程序集有什么区别
2013/04/05 面试题
业务员岗位职责范本
2013/12/15 职场文书
聘用意向书范本
2014/04/01 职场文书
活动总结怎么写
2014/04/28 职场文书
2014年销售工作总结
2014/12/01 职场文书
四年级小学生评语
2014/12/26 职场文书
解决golang在import自己的包报错的问题
2021/04/29 Golang