浅谈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 方法大全方便学习参考
Feb 25 Javascript
Extjs 继承Ext.data.Store不起作用原因分析及解决
Apr 15 Javascript
Javascript表单验证要注意的事项
Sep 29 Javascript
图解JavaScript中的this关键字
May 28 Javascript
js获取鼠标位置实例详解
Dec 09 Javascript
移动端jQuery修正Web页面滑动时div问题的两则实例
May 30 Javascript
Bootstrap三种表单布局的使用方法
Jun 21 Javascript
jQuery的ajax中使用FormData实现页面无刷新上传功能
Jan 16 Javascript
[js高手之路]寄生组合式继承的优势详解
Aug 28 Javascript
vuejs点击class变化的实例
Sep 05 Javascript
Vue 后台管理类项目兼容IE9+的方法示例
Feb 20 Javascript
vue实现分页的三种效果
Jun 23 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/08/08 PHP
PHP Cookei记录用户历史浏览信息的代码
2016/02/03 PHP
php使用PDO事务配合表格读取大量数据插入操作实现方法
2017/02/16 PHP
PHP实现简易用户登录系统
2020/07/10 PHP
PHP如何使用cURL实现Get和Post请求
2020/07/11 PHP
基于jQuery架构javascript基础体系
2011/01/01 Javascript
javascript小组件 原生table排序表格脚本(兼容ie firefox opera chrome)
2012/07/25 Javascript
JQuery-tableDnD 拖拽的基本使用介绍
2013/07/04 Javascript
理解和运用JavaScript的闭包机制
2015/08/13 Javascript
JS实现仿Windows7风格的网页右键菜单效果代码
2015/09/11 Javascript
JavaScript学习笔记之取数组中最大值和最小值
2016/03/23 Javascript
js+css实现select的美化效果
2016/03/24 Javascript
浅谈JavaScript异步编程
2017/01/20 Javascript
vue+vuex+axio从后台获取数据存入vuex实现组件之间共享数据
2017/04/22 Javascript
JavaScript通过filereader接口读取文件
2017/05/10 Javascript
JavaScript制作简单的框选图表
2017/05/15 Javascript
Angular实现表单验证功能
2017/11/13 Javascript
vue获取验证码倒计时组件
2019/08/26 Javascript
layui 实现自动选择radio单选框(checked)的方法
2019/09/03 Javascript
微信小程序实现canvas分享朋友圈海报
2020/06/21 Javascript
Python中 Lambda表达式全面解析
2016/11/28 Python
Linux 修改Python命令的方法示例
2018/12/03 Python
python多线程并发让两个LED同时亮的方法
2019/02/18 Python
Python 忽略文件名编码的方法
2020/08/01 Python
教师党性分析材料
2014/02/04 职场文书
测试工程师程序员求职信范文
2014/02/20 职场文书
大学生村官座谈会发言材料
2014/05/25 职场文书
委托书的写法
2014/08/30 职场文书
清明节扫墓活动总结
2015/02/09 职场文书
酒店前台辞职书
2015/02/26 职场文书
因公司原因离职的辞职信范文
2015/05/12 职场文书
详解Javascript实践中的命令模式
2021/05/05 Javascript
教你怎么用python实现字符串转日期
2021/05/24 Python
springboot+VUE实现登录注册
2021/05/27 Vue.js
OpenCV-Python实现怀旧滤镜与连环画滤镜
2021/06/09 Python
Java 死锁解决方案
2022/05/11 Java/Android