JavaScript初级教程第1/2页_基础知识_脚本之家

作者:运维知识    发布时间:2019-12-22 02:24     浏览次数 :

[返回]

我们已了解变量可是数字、字符串及对象参数。还有一个Javascript的重要部分:数组。 数组是一种列表。各种列表比如名单、URL以颜色列表都可以存储在数组中。 这里我们生成颜色的数组: varcolors=newArray; 现在你就有了一个数组,你能对它做什么呢?数组的优点在于数组中的各个元素可以通过数字调用。第一个元素的数字是0,可以用以下方式调用: varthe_element=colors[0]; 执行这一行JavaScript指令时,变量the_element所被赋予的值是字符串"red"。通过写出数组的名称并将数组中元素的顺序号放在方括号内就可调用数组中的该元素。数组中第2个元素的顺序号是1。 一旦生成数组后,你可以添加和修改数组值。如果你打算将颜色数组的第1个元素有红色该为紫色,你可以这样做: colors[0]="purple"; 数组经常用于循环。下面将讲数组和循环的应用。 数组是一项非常有用的东西,因为你可以循环调用数组中的各个元素执行某项功能。以下是循环显示一个URL数组中的各个元素的例子。 首先,要使该例子发挥作用,我们需要声明一些变量: varurl_names=newArray("hits.org","awaken.org","bianca.com"); vara_url; 接下来,我们循环调用数组中的各个元素,打开每个URL并对待用户点击alert框的OK按钮: for(loop=0;loop时间! 在这里这段JavaScript的工作细节并不重要;一会我们再回来复习一下。 重要的是它太长了。若这些时间链接再有10个,你须每次剪贴这段程序。这使你的HTML既长且难看。另外,若你想改变这段程序,就必须在10个不同地方改变。 你可以写一个函数来执行而不用作10次拷贝程序。这里的函数使用变的即容易编辑又容易阅读。 请看如何写一段计时函数。 该HTML页含有一个叫做announceTime的函数。从一个链接调用annoumnceTime: 时间! 就象这样: 下行看起来就象第二课: Hello! 这称为从一个链接调用警告对话框。函数就象一种方法,唯一不同的是,方法依附于一个对象。在这个警告的例子中,这个对象是一个窗口对象。 让我们回到函数本身。如果你看看源码,你将看到函数位于HTML文件的头部中。

以下是代码: function writeTime() { // 获得日期对象 var today = new Date();

无参数函数

很简单,对吧?下面我们看一个复杂循环定时器,一个可以报告时间的定时器。

... 好,让我们逐行复习这个函数。首先,所有函数来自于该种格式: functionfunctionName { statements... } 函数的命名规则于变量差不多。第一个字符必须是字母或一标准符号。其余字符可为数字或一横线。但必须保证函数不于已定义的变量同名。否则将出现很糟糕的结果。我是用内部大写的方式命名函数以保证它们不与字符碰巧重名。 函数名后是一组参数。本例是无参数的函数,下一例中我们再举例描述。 参数后是函数的主体。这是一组当函数调用后是想运行的语句。在下面几个例子中,我打算利用这个报时器,所以让我描述一下它是怎样工作的。 第一行: varthe_date=newDate(); 取得一个新的日期对象。就象你在用数组时取得一个新的数组一样,在你要找出即时是什么时间时你需要先取得一个日期对象。当找到了一个新的日期对象,它自动重置到当前的日期和时间。为了在对象以外得到这个信息,你必须使用这种对象方法: 这些方法从日期对象上取得了合适的数字。 varthe_hour=the_date.getHours(); varthe_minute=the_date.getMinutes(); varthe_second=the_date.getSeconds(); 你可能疑惑:我怎样能假定日期对象知道何种方式?甚或我如何知道有这样一件事可作为日期对象?这些缘由应从Javascript库中获取,我将尽我所能解释内置Javascript对象,但不一定能彻底的使你清楚。 函数的其他部分就很清楚了。它以这种方式调用返回数字,把它们变成字符串,并且调用警告方式以弹出一个字符串对话框。注意你可以在函数内部调用一个方式和函数。我们将详尽讨论。 现在如果你也玩透了时间链接,你可能注意到了有些什么不对的事。你每次可能会得到这样的反馈:“12:12:04”,这是getSecond()将返回值为“4”。那么当你合成为时间时,你看到的就是the_minute+“:”+the_second得到14:4而非是我们想要的。解决它是个容易的事,需要个新的函数来修补分、秒合成值。 请看参数及返回值。 尽管无参数的函数在减少写源码工作量,HTML源码可读性上很有用,但有参数的函数会更为有用。 上一例中,当返回的分、秒值小于10时会有问题发生。我们想要看到的秒值是04而非4。我们可以这样做: varthe_minute=the_date.getMinutes { the_minute="0"+the_minute; } varthe_second=the_date.getSeconds { the_second="0"+the_second; } 它会非常有效。但是注意,同样的源码你写了两次:若某件东西小于10,则前面加“0”。所以要考虑当用同一代码要多次重写时,用函数来做。本例中我写了一个叫fixNumber的函数: functionfixNumber { if { the_number="0"+the_number; } returnthe_number; } fixNumber的参数是the_number。一个参数也是一个变量,当该函数被调用时,其参数值也被设置。在本例中,我们这样调用函数: varfixed_variable=fixNumber; 参数the_number在函数中设置为4。到现在你应该对fixNumber的主体有了一定的了解。它的意思是:如果变量the_number小于10,则在它的前面加一个0。这里面新的内容是return指令:返回the_number的值。在下面的情况中就会用到return指令: varsome_variable=someFunction(); 变量some_variable的值是函数someFunction()的返回值。在fixNumber中,我加入:returnthe_number,则退出函数并将返回the_number的值返回给任何一个等待被设置的变量。 所以,我这样书写代码: varfixed_variable=fixNumber; the_number的初始值将通过函数调用被设置为4,然后由于4小于10,所以the_number将被改为"04"。然后the_number值被返回,而且变量fixed_variable将被设置为"04"。 为了将fixNumber包括在原始函数announceTime()中,我添加了如下内容: functionannounceTime() { //getthedate,thehour,minutes,andseconds varthe_date=newDate(); varthe_hour=the_date.getHours(); varthe_minute=the_date.getMinutes(); varfixed_minute=fixNumber; varthe_second=the_date.getSeconds(); varfixed_second=fixNumber; //puttogetherthestringandalertwithit varthe_time=the_hour+":"+fixed_minute+":"+fixed_second; alert("Thetimeisnow:"+the_time); } 假定时间链接被点击时,时间为12:04:05。用newDate获得小时,用前面所属方法获得分钟,分钟在本例中应该是4,然后调用fixNumber,其参数为the_minute: varfixed_minute=fixNumber; 当fixNumber()被调用时,参数the_number被设置为the_minute。在本例中由于the_minute是4,所以the_number将被设置为4。 设置完参数后,我们进入函数主体。由于4小于10,the_number被改变为"04",然后the_number值用return指令返回。当"04"被fixNumber返回后,本例fixed_minute就等于"04"。 我们一步一步来研究该过程。假定时间为12:04:05。 我们从函数announceTime()开始 1.the_minute=the_date.getMinutes();则the_minute=4 2.fixed_minute=fixNumber;等于函数fixNumber()并将其值返回给fixed_minute 现在进入函数fixNumber() 3.函数fixNumberfixNumber()用the_minute的值调用,the_minute值是4,所以现在the_number=4 4.如果{the_number="0"+the_number;}由于4小于10,所以the_number现在等于"04" 5.返回the_number值,退出该函数并返回值"04" 现在已经退出函数fixTime(),所以现在我们回到announceTime() 6.该函数返回值为"04",所以fixed_minute现在等于"04" 该例用了一个只有一个参数的函数。实际上你可以为函数设置多个参数。下一讲我们将要讲多于一个参数的函数。 12下一页阅读全文

点击这个按钮就可以终止定时器。指令是clearTimeout(),其实很简单,如果你这样设置setTimeout,the_timeout = setTimeout("some javascript",3000);

function fixTime { if { the_time = "0" + the_time; }

12下一页阅读全文

要使定时器循环工作你需要写一个函数实现循环调用。这里是一个例子:

return the_time; }

var the_count = 0; var the_timeout; function doTimer() { window.document.timer_form.the_text.value = the_count; the_count += 2; the_timeout = setTimeout; }

var minutes = today.getMinutes(); var seconds = today.getSeconds类似。

点击“启动时钟”则时钟开始运行。它从你的计算机中读取时间并每半秒更新一次文字框中的显示。这个例子通过一个自调用的函数设置了一个定时器。同时这个例子可以让你了解一点Date对象的功能。当讲解cookies时,我提到过Date对象。

现在时间是:

// fixTime 使分和秒可以正常显示 // 对于小于10的数字则在该数字前加一个0 minutes = fixTime; seconds = fixTime;

如何取消setTimeout?