javascript 函数介绍

1. 函数的定义和调用
在JavaScript中,定义函数最常用的方法就是调用function语句。该语句是由function关键字构成的,它后面紧跟的是:
Ø 函数名
Ø 一个用括号的参数列表,参数是可选的,参数是用逗号分隔开
Ø 包括在大括号中的函数体
使用函数需要注意的几个地方:
Ø 在函数体中如果有return语句,它返回一个值;如果没有的话,它返回undefined
Ø JavaScript不会检测函数参数个数是否正确,如果传递实参多于形参,多余的实参将没忽略;如果少于的话,那么没有被传递参数的形参被赋于undefined,在这种情况一般程序运行将出错

//print1返回一个值
function print1(){
return 'ddxkj';
}
//print1没有return语句,返回undefined
function print2(){
}
function print3(str1,str2,str3){
document.write(str1,"
");
document.write(str2,"
");
document.write(str3,"
");
}
document.write(print1(),"
");
document.write(print2(),"
");
print3('aaa','bbb','ccc'); //实参和形参个数相同
print3('aaa','bbb','ccc','ddd','eee'); //实参个数多于形参
print3('aaa','bbb'); //实参个数小于形参

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

运行结果:
ddxkj
undefined
aaa

ccc
aaa

ccc
aaa

undefined
1.1. 嵌套的函数
JavaScript 1.2和ECMAScript v3允许一个函数定义可以出现在另个函数中,也就是函数的嵌套。需要注意的是,ECMAScript v3不允许函数定义任意出现,它们仍然被限制在顶层全局代码和顶层函数代码中,这意味着函数定义不能出现在循环和条件语句中。例如:

function print(a){
function square(x) {return x*x;}
document.write(square(a));
}
print(100);

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

运行结果:
10000
1.2. Function()构造函数
在ECMAScript v1和JavaScript 1.1中,允许使用Function()和new动态定义一个函数。例如:var f = new Function("x", "y", "return x*y;");
该行代码几乎等价于:function f(x,y){return x*y;}
Function()构造函数可以接受任意多个字符串参数,最后一个参数就是函数体,可以包含任何JavsScrpt语句,每行语句之间使用;隔开。如果说函数没有参数,只需一个函数体的字符串就可以了。
有时时Function()构造函数也被称为匿名函数,是没有定义了函数名。
Function()构造函数的用途:
Ø 动态创建和编译一个函数。每调用一次函数,Function()构造函数都要编译一次函数,这也就成了一个缺点。因此,在循环或经常被调用的函数中,一般不使用Function()构造函数。
Ø 将函数定义为JavaScript的表达式,而不是语句。不过在JavaScript中,如果想在表达式中定义一个函数,而不是在语句,使用函数直接量会更方便。
1.3. 函数直接量
函数直接量的语法和function语句非常相似,只不过它被用作表达式,而不是语句,而且可以不指定函数名。和function语句、Function()构造函数一样,函数直接量也是创建函数的方式之一。如:
Ø function f(x){return x*x;} //function语句
Ø var f = new Funtion("x","return x*x;"); //Function()构造函数
Ø var f = function(x){return x*x;};
虽然函数直接量创建的是未命名函数,但也可以指定函数名,这在编写调用
自身递归函数非常有用。如:
var f = function fact(x) { if (x <= 1) return 1; else return x*fact(x-1); };
上面代码定义了一个未命名函数,并把它的引用存储在f中。它并没有创建fact()这个函数,只是允许函数体用这个名称没调用自身。
函数直接量可以像变量一样,被赋值、被传递给函数,甚至直接调用。例如:

var f1 = function(x){return x*x;}; //定义并保存
var f2 = function(x){return x*x;}(5); //直接调用
document.write(f1(10),"
");
document.write(f2,"
");

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

运行结果:
100
25
2. 作为数据的函数
当函数被做为一种数据时,就可以像变量,被赋值、存储在对象属性或数组、传递给函数。
当以如下方式定义一个函数时,function square(x){return x*x;},定义了一个函数对象,并把这个函数对象赋值给了square。在这里square没有任何意义,不过只是一个对象而已,存储了函数对象。可以将这个函数赋值给其它变量。例如:

function square(x) {
return x*x;
}
var a = square(4);
document.write(a,"
"); //打印出16
var b = square;
var c = b(10);
document.write(c,"
"); //打印出100

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

运行结果:
16
100

function add(x,y) { return x + y; }
function subtract(x,y) { return x - y; }
function multiply(x,y) { return x * y; }
function divide(x,y) { return x / y; }
function operate(operator, operand1, operand2)
{
return operator(operand1, operand2);
}
var i = operate(add, operate(add, 2, 3), operate(multiply, 4, 5));
document.write(i,"
");
var operators = new Object( );
operators["add"] = function(x,y) { return x+y; };
operators["subtract"] = function(x,y) { return x-y; };
operators["multiply"] = function(x,y) { return x*y; };
operators["divide"] = function(x,y) { return x/y; };
operators["pow"] = Math.pow;
function operate2(op_name, operand1, operand2)
{
if (operators[op_name] == null) return "unknown operator";
else return operators[op_name](operand1, operand2);
}
var j = operate2("add", "hello", operate2("add", " ", "world"))
var k = operate2("pow", 10, 2)
document.write(j,"
");
document.write(k,"
");

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

运行结果:
25
hello world
100

(0)

相关推荐

  • javascript 函数介绍

    1. 函数的定义和调用 在JavaScript中,定义函数最常用的方法就是调用function语句.该语句是由function关键字构成的,它后面紧跟的是: Ø 函数名 Ø 一个用括号的参数列表,参数是可选的,参数是用逗号分隔开 Ø 包括在大括号中的函数体 使用函数需要注意的几个地方: Ø 在函数体中如果有return语句,它返回一个值:如果没有的话,它返回undefined Ø JavaScript不会检测函数参数个数是否正确,如果传递实参多于形参,多余的实参将没忽略:如果少于的话,那么没有被

  • String.prototype实现的一些javascript函数介绍

    复制代码 代码如下: //String.prototype使用 //批量替换,比如:str.ReplaceAll([/a/g,/b/g,/c/g],["aaa","bbb","ccc"])   String.prototype.ReplaceAll=function (A,B) {       var C=this;       for(var i=0;i<A.length;i++) {           C=C.replace(A[i]

  • javascript函数命名的三种方式及区别介绍

    javascript函数命名的三种方式及区别介绍 第一 复制代码 代码如下: function fn(val1,val2) { alert(val1+val2); } fn(1,2); 第二 复制代码 代码如下: var fn=function() { alert(val1+val2); } fn(1,2); 第三 复制代码 代码如下: var fn=new Function("alert(val1+val2)"); fn(1,2); 上面三种方式逻辑上是等价的,但是还是有点小区别:区

  • javascript条件式访问属性和箭头函数介绍

    目录 一.条件式访问属性 二.箭头函数介绍 一.条件式访问属性 ?. 是ES2020引入的新特性,是一个条件式属性访问操作符,当你访问值为undefined变量的某个属性值时,如果使用.操作符会直接报错,如果使用条件式属性访问操作符来访问会返回undefined. 看例子: let book = {price:10, edition:10, name:"javascirpt" } console.log(book.page.num) 直接报错: TypeError: Cannot re

  • JavaScript数组去重和扁平化函数介绍

    目录 1.数组扁平化(又称数组降维) 方法一:使用 reduce 方法 方法二:栈 2.数组去重 方式一:Set(ES6) 方式二:reduce 方法三:filter 1.数组扁平化(又称数组降维) flat() 方法会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回 const test = ["a", ["b", "c"], ["d", ["e", ["

  • 浅谈JavaScript函数节流

    浏览器中某些计算和处理要比其他的昂贵的多.例如,DOM操作比起非DOM交互需要更多的内存和CPU时间.连续尝试进行过多的DOM相关操作可能会导致 浏览器挂起,有时候甚至会崩溃.尤其在IE中使用onresize事件处理程序的时候容易发生,当调整浏览器大小的时候,该事件连续触发.在 onresize事件处理程序内部如果尝试进行DOM操作,其高频率的更改可能会让浏览器崩溃. 函数节流背后的基本思想是,某些代码不可以在没有间断的情况连续重复执行.第一次调用函数,创建一个定时器,在指定的时间间隔之后运行代

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

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

  • JavaScript函数详解

    简介 在很多传统语言(C/C++/Java/C#等)中,函数都是作为一个二等公民存在,你只能用语言的关键字声明一个函数然后调用它,如果需要把函数作为参数传给另一个函数,或是赋值给一个本地变量,又或是作为返回值,就需要通过函数指针(function pointer).代理(delegate)等特殊的方式周折一番. 而在JavaScript世界中函数却是一等公民,它不仅拥有一切传统函数的使用方式(声明和调用),而且可以做到像简单值一样赋值.传参.返回,这样的函数也称之为第一级函数(First-cla

  • JavaScript 函数节流详解及方法总结

    JavaScript 函数节流详解 浏览器一个网页的UI线程只有一个,他同时会处理界面的渲染和页面JavaScript代码的执行(简单扩展一下,浏览器或者JavaScript运行大环境并不是单线程,诸如ajax异步回调.hybrid框架内与native通信.事件队列.CSS运行线程等等都属于多线程环境,不过ES6引入了Promise类来减少了部分异步情况).因此当JavaScript代码运行计算量很大的方法时,就有可能阻塞UI线程,小则导致用户响应卡顿,严重的情况下浏览器会提示页面无响应是否强制

  • JavaScript函数的一些注意要点小结及js匿名函数

    下面给大家介绍javascript函数 函数的基本语法是: function functionName(arg0,arg1,...,argN) { statements } 下面是个示例: function str(name,age){ document.write("hello my name is " + name + ". and i am " + age + " years old."); } str(" oliver"

随机推荐