理解Javascript_14_函数形式参数与arguments

注:在阅读本博文前请先阅读《理解javascript_13_执行模型详解》
注:本文的部分内容是自已的一些推论,并无官文文档作依据,如有错误之后,还望指正。
生涩的代码
我们先来看一段比较生涩的代码:


代码如下:

function say(msg,other,garbage){
alert(arguments[1]);//world
var other = 'nice to meet you!';
var msg;
alert(arguments.length);
alert(msg);//hello
alert(other);//nice to meet you!
alert(arguments[1]);//nice to meet you!
alert(garbage);//undefined
}
say('hello','world');

你能正确的解释代码的执行结果吗?思考一下.
  我想代码运行的结果,应该会和你的想象有很大的出入吧!为什么msg正常输出为hello,而不是undefined呢?函数定义的参数和函数内部定义的变量重复了会发生什么呢?arguments和函数定义时的参数有什么关系呢?让我们来一一解答:
简单的内存图

注:虚线表示的是曾经引用的指向。

解答
  首先,我们来了解两个概念,形式参数和实际参数。形式参数指的是定义方法时所明确指定的参数,由于Javascript语言的灵活性,javascript并不要求方法调用时,所传递的参数个数与形式参数一致.而javascript实际调用时所传递的参数就是实际参数。arguments指的就是实际参数。从say方法中可以看出,say定义了三个形式参数,而实际调用时只传递了两个值。因此arguments.length的值为2,而不是3.接着我们来看一下arguments的特殊行为,个人感觉arguments会将所有的实际参数都当作对象来看待,对于基本数据类型的实际参数则会转换为其对应的对象类型。这是根据在函数内定义与形式参数同名的变量并赋值,arguments对应的值会跟着改变来判断的。
接着我们来分析一下构建say方法执行上下文的过程,由于逻辑比较复杂,这里我写一些'伪代码'来进行说明:


代码如下:

function say(msg,other,garbage){
//先对函数声明的变量进行'预解析',内部执行流程,它是是不可见的
var msg = undefined;
var other = undefined;
var garbage = undefined;
//再对函数内部定义的变量进行'预解析'
var other = undefined;//很明显,此时这个定义已经无意义了。
var msg = undefined;//无意义
//对实际参数进行赋值操作
msg = new String('hello');//arguments的会将所有实际参数当作对象看待
other = new String('world');
//正式进入函数代码部分
alert(arguments[1]);//world
other = 'nice to meet you!';
//var msg;这个已经被预解析了,因此不会再执行
alert(arguments.length);//2
alert(msg);//hello
alert(other);//nice to meet you!
alert(arguments[1]);//nice to meet you!
alert(garbage);//undefined
}

这段代码已经可以解释一面的所有的问题了。我就不多说了。
唯一强调的一点是在内部用var定义与形式参数同名的变量是无意义的,因为在程序'预解析'后,会将它们看作为同一个变量。

其它
关于arguments还有很多特性,我在《伪数组》一文中提到也提到了arguments,有兴趣的读者可以去看一下。arguments的实际应用你还可以参考一下这一篇文章 :
http://www.gracecode.com/archives/2551/

好了,也就这么多了。希望大家能多多指正,多提意见吧。

(0)

相关推荐

  • javascript函数中的arguments参数

    中午的时候稍微研究了下javascript function中的arguments 复制代码 代码如下: <script type="text/javascript"> window.onload = function() { (function(arg1, arg2) { alert(arguments.length); alert(arguments.callee.length); })(); } </script> 其中观察了下arguments.leng

  • javascript arguments 传递给函数的隐含参数

    本人第一次看到这个东东的时候,以为就是"变相"的普通参数,只不过不用在定义函数的时候明确声明而已. 不过,代码是廉价的(Code is cheap.)看代码: function funcTest(a, b) { alert(a); alert(b); for ( var i = 0 ; i < arguments.length; i ++ ) { alert(arguments[i]); } } function test() { funcTest( 1 , 2 , 3 ); /

  • javascript下利用arguments实现string.format函数

    下面摘抄一下源码,深入分析一下他的设计实现思路: 复制代码 代码如下: function format(string) { var args = arguments; var pattern = new RegExp("%([1-" + arguments.length + "])", "g"); return String(string).replace(pattern, function(match, index) { return args

  • 简单谈谈Javascript函数中的arguments

    一.arguments的面貌 在javascript中所有的函数内部都包含了一个隐藏的变量叫arguments;它存放着所有传递到这个函数中的参数: 那么我们打开实例看看arguments的输出形式 (function fn(){ console.log(arguments) })(1,2,3,4) 结果好像是类似数组的形式打印在控制台,相信大多数人包括我看到这种输出就会认为arguments是一个数组,那么既然是数组就可以用数组的一些方法了吧,再看下一个例子: (function fn(){

  • Javascript学习笔记之函数篇(四):arguments 对象

    每一个 Javascript 函数都能在自己作用域内访问一个特殊的变量 - arguments.这个变量含有一个传递给函数的所有参数的列表. arguments 对象不是一个数组.尽管在语法上它跟数组有相同的地方,例如它拥有 length 属性.但它并不是从 Array.prototype 继承而来,实际上,它就是一个对象. 因此,我们不能直接对 arguments 使用一些数组的方法,例如 push, pop 或 slice 等. 所以为了使用这些方法,我们就需要将其转换为一个真正的数组. 转

  • JavaScript中使用arguments获得函数传参个数实例

    JS与PHP在函数传参方面有点不同,PHP形参与实参个数要匹配,而JS就灵活多了,可以随意传参,实参比形参少或多都不会报错. 实参比形参多不会报错 function say(a){    alert(a); }   say('琼台博客','WEB技术博客'); 执行结果 我们再来看看形参比实参多的结果 function say(a,b){    alert('a 的值是 '+a+'\nb 的值是 '+b); }   say('琼台博客'); 执行结果 a 对应第一个实参"琼台博客",b

  • JS函数arguments数组获得实际传参数个数的实现方法

    JS与PHP在函数传参方面有点不同,PHP形参与实参个数要匹配,而JS就灵活多了,可以随意传参,实参比形参少或多都不会报错. 实参比形参多不会报错 function say(a){ alert(a); } say('琼台博客','WEB技术博客'); 执行结果 我们再来看看形参比实参多的结果 function say(a,b){ alert('a 的值是 '+a+'\nb 的值是 '+b); } say('琼台博客'); 执行结果 a 对应第一个实参"琼台博客",b 没有对应的实参所以

  • 深入理解JS函数的参数(arguments)的使用

    JS函数的参数在function内可以用arguments对象来获取. 参数的调用有两种方式: 1.期望参数的使用. 2.实际传递参数的使用. 应用举例: function Test(a, b){ var i, s = "Test函数有"; var numargs = arguments.length; // 获取实际被传递参数的数值. var expargs = Test.length; // 获取期望参数的数值,函数定义时的预期参数个数(有a和b 2个参数). s += (expa

  • JavaScript arguments 多参传值函数

    1.arguments An array corresponding to the arguments passed to a function. 在一个函数体内,标识符arguments引用了arguments对象的一个特殊属性.可以按照数目(而不是名字)获取传递给函数的参数值. 如(prototype.js中的使用): 复制代码 代码如下: function $() { var elements = new Array(); for (var i = 0; i < arguments.len

  • 理解Javascript_14_函数形式参数与arguments

    注:在阅读本博文前请先阅读<理解javascript_13_执行模型详解> 注:本文的部分内容是自已的一些推论,并无官文文档作依据,如有错误之后,还望指正. 生涩的代码 我们先来看一段比较生涩的代码: 复制代码 代码如下: function say(msg,other,garbage){ alert(arguments[1]);//world var other = 'nice to meet you!'; var msg; alert(arguments.length); alert(msg

  • 深入理解JavaScript函数参数(推荐)

    前面的话 javascript函数的参数与大多数其他语言的函数的参数有所不同.函数不介意传递进来多少个参数,也不在乎传进来的参数是什么数据类型,甚至可以不传参数. arguments javascript中的函数定义并未指定函数形参的类型,函数调用也未对传入的实参值做任何类型检查.实际上,javascript函数调用甚至不检查传入形参的个数 function add(x){ return x+1; } console.log(add(1));//2 console.log(add('1'));/

  • 如何理解JS函数防抖和函数节流

    概述 函数防抖和函数节流都是定义一个函数,该函数接收一个函数作为参数,并返回一个添加了防抖或节流功能后的函数. 因此可以将函数防抖和函数节流看作是一个函数工厂,负责对传进来的函数进行相应的加工改造,然后产出一个新的带有某种功能的函数. 函数防抖是某一时间内只执行一次,而函数节流是间隔时间执行 假如有这样一个场景:在某一页面,有一个按钮是 "加载更多",这个按钮的作用就是使用 ajax 从后端服务器请求更多的数据展示在页面,我们都知道,ajax 请求的响应是一个异步的,会存在一定的响应时

  • 深入理解js函数的作用域与this指向

    函数的作用域与this指向是js中很重要的一部分,理清这点东西需要个逻辑,看看我的逻辑怎么样... 下面是个提纲,可以直接挑你感兴趣的条目阅读. • 函数的定义方式:直接定义(window下,内部定义),对象的方法,对象原型的方法: • 函数的调用方式:直接调用,call/apply,with • 对于直接定义的函数和对象的方法,作用域默认状态下是它的定义处的作用域链. • 对于直接定义的函数,this指向window. • 对于对象的方法,this指向实例化对象(对应于实例化对象默认返回thi

  • 深入理解JavaScript 函数

    方法&函数 区别 1.function 是更通用的概念,如数学.编程 2.method 是面向对象中的概念,一般与类或对象成对出现 关系 1.对象的属性可以是任意类型 2.对象的属性如果是函数类型,它就叫做这个对象的方法 3.所以方法的本质还是函数 函数的调用 1.fun() 2.obj.fun() 3.fun.call() 函数的属性和方法 1.name 2.length 3.toString 作用域 变量不是哪里都可以使用 全局变量(跨文件) var n = 1; function fn()

  • 深入理解python函数递归和生成器

    一.什么是递归 如果函数包含了对其自身的调用,该函数就是递归的.递归做为一种算法在程序设计语言中广泛应用,它通常把一个大型复杂的问题层层转化为一个与原问题相似的规模较小的问题来求解,递归策略只需少量的程序就可描述出解题过程所需要的多次重复计算,大大地减少了程序的代码量.例如,要计算1-9的9位数字的乘积,直观的算法是1*2*3*4*5*6*7*8*9,如果要计算1-10000的乘积,直观的算法就难于实现出,而递归就可以很简单的实现.请看示例: def fact(n):#计算给定数字到一的乘积 i

  • Javascript函数中的arguments.callee用法实例分析

    本文实例讲述了Javascript函数中的arguments.callee用法.分享给大话公大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml&

  • 深入理解setTimeout函数和setInterval函数

    前几天学了js,看到了两个非常有趣的函数,他们分别是setTimeout函数和setInterval函数,这两个函数能使网页呈现非常一些网页中比较常见的效果,比如说图片轮播,等一些非常好玩的效果.下面就来一起来了解这两个函数吧! 一setTimeout函数和setInterval函数的语法以及应用 1.setTimeout函数 定义和用法:setTimeout()方法用于在指定的毫秒数后调用函数或计算表达式. 语法:setTimeout(code,millisec); 参数: code (必需)

  • 深入理解C++函数栈帧

    目录 一.什么是函数栈帧 二.具体原理 2.1 main函数的调用 2.2 sum函数的调用 参考: 一.什么是函数栈帧 每一次函数调用都是一个过程,为函数开辟栈空间,用于本次函数调用中临时变量的保存.现场保护.这块栈空间我们称为函数栈帧.栈是从高地址向低地址延伸的.寄存器ebp指向当前的栈帧的底部(高地址),寄存器esp指向当前的栈帧的顶部(低地址) 注:esp:栈指针寄存器(extended stack pointer),其内存放着一个指针,该指针永远指向系统栈最上面一个栈帧的栈顶. bsp

随机推荐