`

JAVASCRIPT基础学习篇(9)--ECMAScript Basic5(EcmaScript Function)

阅读更多

第五章 方法


1、The basic syntax is:


function functionName(arg0, arg1,...,argN) {
statements
}

如果方法有返回值,不需要声明返回的类型就象JAVA的VOID一样如:

function sum(iNum1, iNum2) {
return iNum1 + iNum2;
}

The value of the sum function is returned and assigned to a variable like this:
var iResult = sum(1,1);
alert(iResult); //outputs “2”

Another important concept is that, just as in Java, the function stops executing code after a return statement is executed.(return后面的语句将不再执行)

If a function doesn’t return a value, it can use the return operator without any parameters to exit a function at any time. Example:
function sayHi(sMessage) {
if (sMessage == “bye”){
return;
}
alert(sMessage);
}
In this code, the alert will never be displayed if the message is equal to the string “bye”.

When a function doesn’t explicitly return a value or uses the return statement without a value, the function actually returns undefined as its value.

当方法没有明确声明返回某个确定的值而使用了return;实际上方法返回的值为undefined

2、No overloading(js方法没有重载)

You can define two functions with the same name in the same scope without an error; however, the last function becomes the one that is used.

在JS中你可以定义任何多个同名的方法,但是真正起作用的是最后一个定义的方法,也就是说后面的方法相当于重写了前面的方法,前面的方面就不起作用了。

测试例子如下:

<script language="JavaScript">
<!--

function testArgu(arg1){
alert('arg1')
}

function testArgu(arg1,arg2){
alert('arg2')
}
function testArgu(arg1,arg2,arg3){
alert('arg3')
}

testArgu(23);
testArgu(23,23);
testArgu(23,23,23,23);
//-->
</script>

以上定义三个同名的方法,但参数个数不同,你会发现测试结果输出全是arg3.

你会发现testArgu(23,23,23,23);有四个参数,按理说没有方法与之匹配,但它确实输出了arg3,这正说明了JS中方法不能重载。调换三个方法的顺序你会发现谁最后定义,那么该方法将会被调用。其它的当作不存在。那么为什么传进去四个参数却可调用小于四个参数的方法呢?

The arguments object

function sayhi(){
if(arguments[0]=="good"){
alert('sfsf')
}
}
sayhi("good")

arguments对象通过index遍历传入的参数,0第一个参数,1第二个。。。。

可通过arguments对象的length属性检测传入的参数数目

上面提到:为什么传进去四个参数却可调用小于四个参数的方法呢?

解释:ECMAScript functions don’t validate the number of arguments passed against the number of arguments defined by the function; any developer-defined function accepts any number of arguments (up to 255, according to Netscape’s documentation) without causing an error. Any missing arguments are passed in as undefined; any excess arguments are ignored.

JS不会验证传入参数的个数是否与方法定义的参数个数是否相等。也就是说我可以传入至多255个参数到方法中,那怕该方法没有定义所谓的形参。

当然,既然可以通过arguments.length判断传入参数的数目,那么可通过这一属性来模拟出JAVA中的方法重载特性如:

function doAdd() {
if(arguments.length == 1) {
alert(arguments[0] + 10);
} else if (arguments.length == 2) {
alert(arguments[0] + arguments[1]);
}
}
doAdd(10); //outputs “20”
doAdd(30, 20); //outputs “50”

3、The Function class(方法类)

创建一个方法(函数)可以使用:

function functionName(arg0, arg1,...,argN) {
statements
}

你会发现这里使用的是function,注意首字母是小写的,JS中大小写是敏感的。那么通过Function类怎么来创建函数呢?

var function_name = new Function(argument1, argument2,..,argumentN, function_body);

这里要注意的是new Function后面的格式,所有参数必需都为字符串格式,最后为函数体部分

看下面的方法:

function doAdd(iNum) {
alert(iNum + 100);
}
function doAdd(iNum) {
alert(iNum + 10);
}
doAdd(10); //outputs “20”

上面解释过这里定义的方法,后面的方法重写了前面的方法那么将上面的方法換成另一种形式,也就是采用类定义的形式如下:

var doAdd = new Function("iNum","alert(iNum+100)");
var doAdd = new Function("iNum","alert(iNum+10)");
doAdd(10)

看看是不是很容易理解为什么方法名相同的时候最的是后一个方法了。。

不过这里看清楚了,方法名doAdd实际上是一个指向Function对象的引用。所以可以这样:

var doAdd = new Function("iNum","alert(iNum+100)");
var doAdd = new Function("iNum","alert(iNum+10)");
doAdd(10) //outputs “20”
var doAddagain = doAdd;
doAddagain(30) //outputs “40”

既然方法名是一个引用变量,那么就可以完全作为变量来使用,可以将这个变量作为另一个方法的参数。

var doAdd = new Function("iNum","alert(iNum+100)");
function callFun(fnFun,arg){
fnFun(arg)
}
callFun(doAdd,23) //outputs 123

同样可以使用length属性和toString方法

function doAdd(iNum){
alert(iNum + 100);
}
alert(doAdd.length) //outputs 1 代表参数个数
alert(doAdd.toString()) //方法体内容

alert(doAdd.valueOf()) //方法体内容

4.Closures方法的闭合区域(闭包)

我们知道JAVA等语言是以(if,while,for)等块作为变量范围控制的,在块以肉定义的变量在块以外是不能使用的。在块以块定义的变量是全局变量。那么在JS中是以方法来划分变量作用域范围的,也就是说在本方法以内定义的变量是局部变量,在方法以外定义的变量是全局变量,那么当一个方法调用另一个方法的时候,在被调用方法里就可以直接使用外层方法的变量了,而不用象java里面一样,如果被调用方法要使用外层方法的变量必须将其作为参数传入。

var tempVal = 34;
function alertNum()
{
alert(tempVal)
tempVal = 12;

}
tempVal = 23;
alertNum();
alert(tempVal)

//outputs 23

//outputs 12

JS中方法中可以访问外面环境的变量并改变它,它能侦测变量的变化并把调用前变量的最终值传入方法。

var tempVal = 34;
function alertNum()
{
var tempVal =66
alert(tempVal)
tempVal = 12;
alert(tempVal)

}
tempVal = 23;
alertNum();
alert(tempVal)

//outputs 66

//outputs 12

//outputs 23

这个例子中,首先定义了全局变值为34,再更改为23,而调用方法alerNum(),方法内部自己又定义了一个同名的变量,但是由于方法划分作用域,所以方法内部定义的变量为局部变量,下面将该局部变量改为12,最后调用结束,输出66,12而在方法外面为全局变量范围,所以输出23.

var tempVal = 34;
function alertNum()
{
tempVal =66
alert(tempVal)
tempVal = 12;
alert(tempVal)

}
tempVal = 23;
alertNum();
alert(tempVal)

//outputs 66

//outputs 12

//outputs 12

输出结果与上例不同,两例子的区别是在方法中变量tempVal的定义中使用了var和不使用var,我们知道JS中如果不使用var定义变量,那么会作为全局变量,也就是说这里其实跟下面是一样的效果:

var tempVal = 34;
function alertNum()
{
//tempVal =66
alert(tempVal)
tempVal = 12;
alert(tempVal)

}
tempVal = 23;
var tempVal =66; //重新定义了一个变量,也就是前面的tempVal已经不起作用。
alertNum();
alert(tempVal)

所以我们在方法里面声明变量的时候一定要注意细节。。。

再看下面例子,在方法中调用另一方法时发生的:

var tempVal = 34;
function alertNum(tempNum)
{
var tempNum2 = 23;
function doAdd(){
return tempNum + tempNum2;
}
return doAdd();
}

var result = alertNum(tempVal);
alert(result);

//outputs 57

结果表明,doAdd方法中使用了外围方法alertNum中的变量,在JS中这是一种特性,但在JAVA中是不行的。

对于浏览器来说,全局变量其实是window对象的一个属性:如下

var tempVal = 34;

alert(window.tempVal == 34)

//outputs true

分享到:
评论

相关推荐

    Apply-JavaScript-Basic-Concept

    在"应用JavaScript基本概念"中,我们将深入探讨JavaScript的核心要素,包括变量、数据类型、控制结构、函数以及对象等,这些都是JavaScript编程的基础。 首先,让我们从变量开始。在JavaScript中,变量用于存储数据...

    JavaScript Functional Programming for JavaScript Developers (PDF, EPUB, MOBI)

    Understand the basic concurrency constructs in Javascript and best performance strategies Harness the power of patterns for tasks ranging from application building to code testing Build large-scale ...

    freeCodeCamp-Basic-JavaScript

    【免费编程营-Basic-JavaScript】是freeCodeCamp学习平台的一个重要部分,专注于教授初学者JavaScript的基础知识。JavaScript是一种广泛使用的编程语言,主要用于网页和网络应用的开发,赋予了网页动态交互的能力。...

    Basic-knowledge-of-java.zip_Knowledge

    以上是JavaScript基础知识的概览,通过深入学习和实践,你可以更好地掌握这门强大的脚本语言。对于压缩包中的"Basic knowledge of java.doc"文档,很可能是针对JavaScript的基础知识进行的详细讲解,包括上述知识点...

    basic-course-javascript

    【JavaScript基础课程】 JavaScript,简称JS,是一...这个"basic-course-javascript"课程将涵盖以上这些关键知识点,并通过实例和练习帮助学习者逐步掌握JavaScript编程,为他们进一步探索Web开发世界打下坚实的基础。

    Java-Script-Basic-Program

    这个"Java-Script-Basic-Program"压缩包很可能包含了一系列基础的JavaScript编程教程或者示例,帮助初学者理解这门语言的核心概念。 1. **变量与数据类型**:JavaScript支持动态数据类型,意味着变量可以存储不同...

    basic-javascript

    JavaScript,也被称为JS,是一种广泛应用于网页和网络应用的脚本语言。...掌握这些知识将为学习更高级的JavaScript概念和框架打下坚实的基础。通过实际编写代码和练习项目,可以更好地理解和运用这些知识点。

    JavaScript_Course_Basic

    "JavaScript_Course_Basic"很显然是一门针对初学者的JavaScript基础课程,旨在帮助学习者掌握这门语言的核心概念和基本用法。 JavaScript的基础知识点包括: 1. **变量与数据类型**:JavaScript支持动态类型,这...

    Javascript-Basic

    在“Javascript-Basic”这个主题中,我们主要会探讨JavaScript的基础知识,这包括变量、数据类型、控制流、函数以及对象等核心概念。 1. **变量**:在JavaScript中,变量用于存储数据。你可以使用`var`、`let`或`...

    脚本编译器该工具(javascript、vbs)

    JavaScript的关键字包括`var`、`function`、`if...else`、`for`、`while`等,它们是构建程序结构的基础。 VBScript,全称Visual Basic Script,是Microsoft开发的一种脚本语言,主要用于Windows环境,尤其是...

    JavaScript内核系列

    1996年后期,网景向欧洲电脑厂商协会(ECMA)提交了 Javascript的设计,以申请标准化,ECMA去掉了其中的一些实现,并提出了ECMAScript-262标准,并确定Javascript的正 式名字为ECMAScript,但是JavaScript的名字已经...

    javascript-basic

    以上只是JavaScript基础知识的一部分,深入学习还需要涉及错误处理、正则表达式、模块系统、性能优化等方面。通过不断实践和学习,你将能够熟练掌握这门强大的脚本语言,为网页和网络应用开发打下坚实的基础。

    js-basic-workshop:关于JS基本知识的讲习班

    以上只是JavaScript基础工作坊的一部分内容,实际学习中还应涉及错误处理、类型转换、模块化开发、前端框架等内容。通过这个讲习班,你将建立起坚实的语言基础,为进一步的Web开发打下牢固的根基。

    Basic-[removed]基本内容

    标题“Basic-[removed]基本内容”暗示我们将探讨JavaScript的基础知识,这包括但不限于语法、数据类型、变量、控制流程、函数以及对象。 1. **语法与数据类型**:JavaScript的基础是它的语法结构。它支持多种数据...

    VBscript速查手册

    VBScript(Visual Basic Scripting Edition)是一种轻量级的脚本语言,主要应用于Web开发、Windows脚本环境以及Microsoft Office自动化等场景。它基于Visual Basic,但不包含VB的全部特性,更专注于提供简单易用的...

    VBScript与JScript实例教程1-4

    它是Visual Basic家族的一部分,由Microsoft公司开发,与JavaScript类似,但两者并不完全相同。JScript是Microsoft对ECMAScript标准的实现,而VBScript则是微软特有的一种脚本语言。 本教程“VBScript与JScript实例...

    es6-basic

    **ES6(ECMAScript 2015)基本知识点详解** ES6,全称ECMAScript 2015,是JavaScript语言的一个重大更新...在学习和实践中,理解这些新特性的原理及其应用场景,能够帮助开发者写出更高效、更易维护的JavaScript代码。

    bc_basic_js

    "bc_basic_js"这个压缩包很可能包含了一系列关于JavaScript基础知识的教程或者示例代码,旨在帮助学习者理解并掌握JS的基本概念和用法。 JavaScript主要由以下几个核心部分组成: 1. **变量与数据类型**:...

Global site tag (gtag.js) - Google Analytics