JavaScript 函数进阶：从嵌套、参数到 apply/call 详解

JavaScript 函数基础与创建

1、函数的创建

鉴于前文已多次涉及函数使用，此处不再赘述基础概念。

2、嵌套函数

 
function china()
{ 
function people()//嵌套函数，只有china用它
{ 
document.write("我的心愿是当杜甫，最近网上他的漫画，他活的好潇洒");
} 
people();
} 

3、函数的直接量

JavaScript 允许使用直接量定义函数，即通过表达式创建匿名函数。需特别注意：匿名函数后续应用广泛，务必理解其原理。

 
function china(people) //函数声明
{ 
return peole;
} 
var fun = function(people){return people;};//通过表达式声明。效果等同

4、函数的参数（这里大家要注意)

当调用函数时提供的参数少于声明的形参数量时，未传入的参数值将自动设为 undefined。

 
//打印函数
function displayArray(arr)
{ 
if(!arr)return;
for(var num =0;num<arr.length;num++)
{ 
document.write("Num is "+ arr[num]+ "\t");
} 
document.write(" "+"<br />");
} 
var array = [2,32,14,57,6];
function borrowArray(from,/*optional*/to)
{ 
if(!to) to = []; //to = to||[] 效果是等同的
for(var element in from) //使用枚举遍历数组
to.push(from[element]);//将元素添加到数组
return to;//返回
} 
var returnnumber = borrowArray(array);//执行
displayArray(returnnumber);//打印
//输出：Num is 2 Num is 32 Num is 14 Num is 57 Num is 6

可变参数与 Arguments 对象处理

5、可变的参数（Arguments 对象)

初次接触此处可能感到困惑，为何参数可变？实际上，arguments 对象充当了函数参数的管理者角色。例如，若函数定义了3个参数，arguments 对象就会包含一个与定义参数数量一致的数据集。

需注意：arguments 标识符仅在函数体内有效，可将其视为函数的一个属性。

 
function checkArgument(x,y,z)
{ 
if(arguments.length != 3) throw new Error("参数不匹配"); //检查参数是否合法，挺好用吧！
return x+y+z;
} 

下面的例子是一个比较数字大小的例子，参数是可以变的。

 
function compareMaxNumber()
{ 
var temp = Number.NEGATIVE_INFINITY;//表示javascript最小的复数
for(var arg=0;arg<arguments.length;arg++)
{ 
if(arguments[arg]>temp) temp = arguments[arg];
} 
return temp; //返回参数中最大的数字
} 
document.write(compareMaxNumber(2,34,5,23,766,1000)+"<br />");//这里的参数可以有很多，输出1000

对象属性传参与函数作为数据

6、将对象属性作为参数

 
function displayArray(arr) //打印函数
{ 
if(!arr)return;
for(var num =0;num<arr.length;num++)
{ 
document.write("Num is "+ arr[num]+ "\t");
} 
document.write(" "+"<br />");
} 
// 
function copyArray(from,from_start,to,to_start,length)//复制数组
{ 
for(var i = from_start; i <length;i++)
{ 
to.push(from[i]);//填充
} 
return to;
} 
//getArray 接受对象
function getArray(objarray)
{ 
//再次封装,调用copyArray
return copyArray(objarray.from,objarray.from_start ||0,objarray.to|| [],objarray.to_start ||0,objarray.length);//这里用了一点技巧。
} 
var arr1 = [1,2,3,4,5];
displayArray(getArray({from:arr1,length:4}));

6、作为数据的函数

 
function add(x,y){return x + y;}
function multply(x,y){return x*y;}
function cut(x,y){return x -y ;}
operator(operator1,operator2,operator3)//接收3个参数，可以把函数作为参数使用。
{ 
return operator1(operator2,operator3);//执行的是add();
} 
document.write(operator(add,operator(multply,2,4),operator(cut,12,2)));//输出18了

函数作为方法与构造函数应用

7、作为方法的函数

所谓方法，即把函数存储在对象的属性中，并通过该属性进行调用。函数可以赋值给任何变量。

 
var obj = {};
function display() //(something) 带参数
{ 
return "Love";//something;
} 
obj.method = display;//使用对象的直接量赋值。
obj.method();//调用。obj.method("Love");

JavaScript 引入了 this 关键字。需牢记：调用方法的对象即为 this 的值。例如 Object.method() 中，Object 即为 this 所指代的对象。

 
var privatename =
{name:"Frank",
age:21,
sex:'男',
display:function()
{document.write("my name is:"+this.name+"\t age :"+this.age)}};
privatename.display(); //输出 name is:Frank age :21

8、构造函数

构造函数用于初始化对象属性，专门与 new 运算符配合使用。new 运算符创建新对象后调用构造函数，并将新创建的对象作为 this 值传递进行赋值（需深入理解）。

 
function createProperty(name,version)//构造函数
{ 
this.name = name;
this.version = version;
} 
var tools = new createProperty("Multply",1.0);初始化，工具的名称，版本

函数属性定义与 apply/call 调用机制

9、定义函数的属性

当需要使用全局不变值时，利用 Function 对象的属性十分便捷（未来创建命名空间或类属性时，常依托于此）。

 
createNamespace.name = "360buy.define";
createNamespace.version = 1.2;
function createNamespace()
{ 
document.write("名称空间:"+createNamespace.name +"版本:" + createNamespace.version);
} 
createNamespace();//输出：名称空间:360buy.define版本:1.2

10、方法apply()和call()

使用这两个方法可以像调用其他对象方法一样调用函数。两者的第一个参数均为要调用的对象，后续参数为函数所需的参数。

 
function applyCallOperator(args,args2)
{ 
document.write(args+"<br />");
} 
var objpeople = {};
applyCallOperator.apply(objpeople.Frank,[3,4]);//等同 applyCallOperator.call(objpeople.Frank,3,4) 前面就多[]
objpeople.Frank();

小结：本篇分享到此结束，下一篇我们将共同实现 JavaScript 类。