`
zccst
  • 浏览: 3319263 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js-arguments的认识

阅读更多
作者:zccst



2014-6-10  自己构造一个Array like
类数组的构成要点:
1,元素是数组式索引
2,有length属性

var test3 = {
	0 : 10,
	1 : function(){
		return this[0];
	},
	length:2
}
console.log(Array.prototype.slice.call(test3));//打印[10, function()]




2014-6-9
函数参数arguments是类数组,但不是数组。(arguments是对象)
如果希望转成真正的数组,则可以
var slice = [].slice;
slice.call(arguments);
也可以:Aarray.prototype.slice.call(arguments);

var o = {
	name:"javascript"
};
var f1 = function(){
	return 2;
}
var foo = function(a,b,c){
	console.log(arguments, typeof arguments, $.type(arguments), typeof arguments.push);
	//[100, function(), Object { name="javascript"}] object object undefined

	//尽管arguments不是数组,但仍可以通过for循环取出每一个元素
	for (var i in arguments ){
		console.log(arguments[i]);
	}
	/*打印
		100
		function()
		Object { name="javascript"}
	*/

	//现在让数组的slice运行在arguments的context中,参数为0,则将arguments转成了数组,(arguments本身没变)
	var ret = Array.prototype.slice.call(arguments);

	console.log(ret, typeof ret, $.type(ret), typeof ret.push);
	//[100, function(), Object { name="javascript"}] object array function
}
foo(100,f1,o);









基础介绍
js进行函数调用时,除了指定的参数外,还创建一个隐含的对象——arguments。
一、arguments可以用arguments[index]这样的语法取值,拥有长度属性length。arguments对象存储的是实际传递给函数的参数,而不局限于函数声明所定义的参数列表,例如:
function func(a,b){
    alert(a);
    alert(b);
    for(var i=0;i<arguments.length;i++){
        alert(arguments[i]);
    }
}
func(1,2,3,4);

代码运行时会依次显示:1,2,1,2,3,4。函数定义了两个参数,但是在调用的时候传递了4个参数。

二、arguments的callee属性
它表示对函数对象本身的引用,这有利于实现无名函数的递归或者保证函数的封装性。例如:用递归来计算1到n的自然数之和:
var sum=function(n){
    if(1==n) {
        return 1;
    } else {
        return n + arguments.callee(n-1);
    }
}
alert(sum(100));

arguments.callee表示引用当前正在执行的函数,或者说是调用arguments.callee的函数对象的引用,它给匿名函数提供了一种自我引用的方式。





更深入,包括了caller, call, apply
/*
 * 演示arguments的用法,如何获取实参数和形数数
 */
function argTest(a,b,c,d){
    var numargs = arguments.length;     // 获取被传递参数的数值。
    var expargs = argTest.length;       // 获取期望参数的数值。
    alert("实参数目为:"+numargs)
    alert("形数数目为:"+expargs)

    alert(arguments[0])         
    alert(argTest[0])          //undefined 没有这种用法
}
//argTest(1,2)
//argTest(1,2,3,4,5)


/*
 *  arguments不是数组(Array类)
 */

Array.prototype.selfvalue = 1;
function testAguments(){
    alert("arguments.selfvalue="+arguments.selfvalue);
}
//alert("Array.sefvalue="+new Array().selfvalue); // 1
//testAguments();  //arguments.selfvalue = undefined



/*
 * 演示函数的callee属性.
 * 说明:arguments.callee:初始值就是正被执行的 Function 对象,用于匿名函数
 */
function calleeDemo() {
    alert(arguments.callee);
}
//calleeDemo();
//(function(arg0,arg1){alert("形数数目为:"+arguments.callee.length)})();




/*
 * 演示函数的caller属性.
 * 说明:(当前函数).caller:返回一个对函数的引用,该函数调用了当前函数
 */

function callerDemo() {
    if (callerDemo.caller) {
        var a= callerDemo.caller.arguments[0];
        alert(a);
    } else {
        alert("this is a top function");
    }
}
function handleCaller() {
    callerDemo();
}

//callerDemo();
//handleCaller("参数1","参数2");





/*
 * 演示apply,call函数的用法
 * 说明:作用都是将函数绑定到另外一个对象上去运行,两者仅在定义参数方式有所区别:
 *       apply(thisArg,argArray);
 *     call(thisArg[,arg1,arg2…] ]);
 *     即所有函数内部的this指针都会被赋值为thisArg
 */

 function ObjectA(){
    alert("执行ObjectA()");
    alert(arguments[0]);
    alert(this.b);//在ObjectB中用call/apply调用ObjectA时,ObjectB的变量b的值。
    this.hit=function(msg){alert(msg)}
    this.info="我来自ObjectA"
 }
 
 function ObjectB(){
    alert("执行ObjectB()");
    this.b = '2b';
    //调用ObjectA()方法,同时ObjectA构造函数中的所有this就会被ObjectB中的this替代
    ObjectA.apply(this,arguments);//ObjectA.call(this);
    alert(this.info);
 }
 //ObjectB('参数0');


 var value="global 变量";
 function Obj(){
    this.value="对象!";
 }
 function Fun1(){
    alert(this.value);
 }
 //Fun1();
 //Fun1.apply(window); 
 //Fun1.apply(new Obj()); 
分享到:
评论

相关推荐

    javascript

    1. **认识JavaScript**:介绍JavaScript的基本概念,包括其历史背景、特点以及在Web开发中的作用。 2. **数据类型**:讲解JavaScript中的基本数据类型(如数字、字符串、布尔值等)以及复杂数据类型(如数组、对象...

    javascript常用函数集合

    JavaScript是一种广泛应用于网页和网络应用的脚本语言,它在客户端运行,为用户提供动态...通过阅读和学习"Javascript常用函数及基本教材集合.txt",你将对JavaScript有更全面的认识,并能够解决实际开发中遇到的问题。

    js代码-手写bind方法

    JavaScript中的`bind`方法是ECMAScript5引入的一个非常重要的函数,它允许我们...通过上文的讲解和示例,相信你已经对手写`bind`有了清晰的认识。在实际开发中,合理运用`bind`方法可以提高代码的可读性和可维护性。

    js正则表达式replace替换变量方法

    接下来,我们来认识一下replace方法。replace方法有几种不同的使用方式: 1. 直接替换:`var result = string.replace(reg, replacement);` 2. 使用回调函数进行替换: - 固定参数的回调函数:`var result = string...

    详解javascript函数的参数

    同时,需要对传值和传址的区别有所认识,以及对“arguments”对象的理解,这些是管理函数参数所不可或缺的知识。最后,区分变量的作用域对于编写可维护的代码至关重要。函数作为JavaScript的核心组成部分,掌握其...

    extjs实践大量实例讲解

    通过本文的学习,相信您已经对 ExtJS 有了较为全面的认识。无论是基础组件还是高级功能,ExtJS 都能提供完善的解决方案。希望您能在实际开发过程中灵活运用所学知识,创造出更多优秀的作品。如果您有任何疑问或建议...

    javascript 词法作用域和闭包分析说明

    通过以上知识点,我们可以对JavaScript中词法作用域和闭包的行为有更清晰的认识。理解这些概念对于编写可维护和高效的JavaScript代码是非常重要的,尤其是在处理异步回调函数或需要保护数据不被外部直接访问的情况下...

    AJAX基础概念、核心技术与典型案例(内涵动态实例)

    /js/all.js JavaScript脚本文件 /images 图片文件 第24章(/ch24) 程序描述:本章将使用Ajax技术实现无刷新即可浏览RSS的阅读器。添加一个RSS地址时,自动保存到数据库。打开阅读RSS时,自动获取...

    分析了一下JQuery中的extend方法实现原理

    目的为了提高自己对JQuery的认识,也想了解JavaScript高手是如何编写JS的,如有不足请指正。谢谢! 下面是JQuery.extend方法源代码: 代码如下: jQuery.extend = jQuery.fn.extend = function() {   var options,...

Global site tag (gtag.js) - Google Analytics