`
jonson
  • 浏览: 168532 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

js 函数的定义、运行 顺序。

IEJavaScript编程Firefox浏览器 
阅读更多
js 执行的一些疑问。
js是顺序加载，解释执行的。函数定义顺序 对函数的执行 并没有影响。

对于下面一种测试的js调用情况。
－－－－－－－－－－－－－－－－test.html---start-----------------
<HTML> <HEAD> 
<SCRIPT  LANGUAGE="JavaScript"> 
function callBack(){
alert('run callback!');
}
</SCRIPT> 
<script type="text/javascript" src="test.js"></script>
</HEAD>  <BODY> 
<button onclick="test(callBack);">click me</button>
</BODY> 
</HTML> 
----------------------------test.html---end--------------------
----------------------------test.js--start-----------------
function test(callback){
alert("run test function");
callback();
}
-----------------------------test.js----end----------------------

对于 callBack函数的定义位置，如果在 test.js 引入之后，则会报  函数未定义错误；如果在test.js引入之前，则函数触发运行正常正常。    对于这个现象 不是很明白，大家讨论下。

在实际的编程中，还有有用的，因为，如果我们可以在任意位置 定义 callBack 函数。对于很多功能我们 可以定义成一个模块， 调用时传入一个 回掉函数，完成相应的功能就 调用它，这样，整个程序的 耦合性比较小。 
分享到：
| JAXB data binding .boolean type
评论
15 楼 cyan19851224 2008-07-10  
niuyuewanzi 写道
jonson 写道
afcn0 写道
大哥你不会指的是这样写吧 
<script type="text/javascript" src="test.js" /> 
<SCRIPT LANGUAGE="JavaScript"> 
function callBack(){ 
alert('run callback!'); 
} 
</SCRIPT>

看来你也有制定新语法的资质,厉害,实在是高
这样子不符合语法吗？
那就是说 我们定义回调函数 不能随便什么位置！？


语法没错,顺序错了.

要是全写在一个<SCRIPT></SCRIPT>里,FUNCTION在哪儿都成. 但是如果有多个<SCRIPT></SCRIPT>就有顺序之分了...从上到下....你不用FUNCTION,用一般变量一样也能看出来. 

<script type="text/javascript" src="test.js" ></script>
<SCRIPT LANGUAGE="JavaScript"> 
function callBack(){ 
alert('run callback!'); 
} 
</SCRIPT>


和顺序没有关系必须这样写：<script></script>
14 楼 hax 2007-11-16  
还真是不开窍。

不是所有浏览器都允许<script/>的写法。所以你应该写成<script></script>。

<script src="xxx"/>
<script>...</script>
在IE和FF中会被解释为
<script src="xxx">
  <script>
  ...
</script>

它们的解析规则是，script标签开始就是CDATA直到遇到</script>，并且对于有src的script，其内容会被忽略。
13 楼 jonson 2007-11-15  
afcn0 写道
好,给你个建议,看看这样能执行吗 
<HTML> <HEAD> 
<script type="text/javascript" src="test.js"></script> 
<SCRIPT LANGUAGE="JavaScript"> 
function callBack(){ 
alert('run callback!'); 
} 
</SCRIPT> 
</HEAD> <BODY> 
<button onclick="test(callBack);">click me</button> 
</BODY> 
</HTML>
可以了。非常感谢老大的指点。

为什么 <script/>这样子也可以导入相应的文件，但是却会发生 未定义的错误。   底层的原理是什么。
12 楼 afcn0 2007-11-15  
好,给你个建议,看看这样能执行吗 
<HTML> <HEAD> 
<script type="text/javascript" src="test.js"></script> 
<SCRIPT LANGUAGE="JavaScript"> 
function callBack(){ 
alert('run callback!'); 
} 
</SCRIPT> 
</HEAD> <BODY> 
<button onclick="test(callBack);">click me</button> 
</BODY> 
</HTML>
11 楼 jonson 2007-11-15  
afcn0 写道
楼上也是高人,发帖前最好仔细看看帖,要不会造成资源浪费,我在第一个回帖就解决了lz问题,可惜lz不领情,坚信自己语法的正确,无奈,无奈,无奈,无奈


我想知道的 是 有没有 某中方法，可以定义callback 方法，不受位置的限制。
第1帖，好像没有解决问题吧。

现在应该说是在  两个  <script>见的 函数变量的定义，是受到限制。即一个块里面要想调用 另一个块的函数，那么 被调用者应该在调用者之前就被定义。 
10 楼 jonson 2007-11-15  
niuyuewanzi 写道
应该明白你的意思...如果有多个<SCRIPT>标签,也应该是从上到下按顺序EXECUTE的. 就是说上面的<SCRIPT>里有个FUNCTION,下面的<SCRIPT>就可以继续用上面声明过的FUNCTION,反过来是不行的. 因为他们不在同一个<SCRIPT></SCRIPT>里. 当然也有例外,<SCRIPT DEFER>..</SCRIPT>有DEFER属性出现后,就等于告诉JAVASCRIPT,该<SCIRPT>要在整个DOCUMENT被处理完后在被执行,DEFER只在IE中有用...



使用 DEFER属性 相当于就是  把这个test.js文件 在 callBack之前  load
9 楼 afcn0 2007-11-15  
楼上也是高人,发帖前最好仔细看看帖,要不会造成资源浪费,我在第一个回帖就解决了lz问题,可惜lz不领情,坚信自己语法的正确,无奈,无奈,无奈,无奈
8 楼 niuyuewanzi 2007-11-15  
jonson 写道
afcn0 写道
大哥你不会指的是这样写吧 
<script type="text/javascript" src="test.js" /> 
<SCRIPT LANGUAGE="JavaScript"> 
function callBack(){ 
alert('run callback!'); 
} 
</SCRIPT>

看来你也有制定新语法的资质,厉害,实在是高
这样子不符合语法吗？
那就是说 我们定义回调函数 不能随便什么位置！？


语法没错,顺序错了.

要是全写在一个<SCRIPT></SCRIPT>里,FUNCTION在哪儿都成. 但是如果有多个<SCRIPT></SCRIPT>就有顺序之分了...从上到下....你不用FUNCTION,用一般变量一样也能看出来.
7 楼 jonson 2007-11-15  
afcn0 写道
大哥你不会指的是这样写吧 
<script type="text/javascript" src="test.js" /> 
<SCRIPT LANGUAGE="JavaScript"> 
function callBack(){ 
alert('run callback!'); 
} 
</SCRIPT>

看来你也有制定新语法的资质,厉害,实在是高
这样子不符合语法吗？
那就是说 我们定义回调函数 不能随便什么位置！？
6 楼 afcn0 2007-11-15  
大哥你不会指的是这样写吧 
<script type="text/javascript" src="test.js" /> 
<SCRIPT LANGUAGE="JavaScript"> 
function callBack(){ 
alert('run callback!'); 
} 
</SCRIPT>

看来你也有制定新语法的资质,厉害,实在是高
5 楼 jonson 2007-11-15  
afcn0 写道
常见个鸟,只要各个外部js文件都是声明,那就不会有问题,如果外部js也包括加载处理,但是不依赖别的文件中的声明或加载那也没问题,问题就是出现在后加载的需要前加载的进行一些声明设置,当然是按照顺序了,注意声明比较特殊,虽说声明是预处理,但是不同js文件当中的声明是不是预处理得看各个实现如何
但是现在 test.js文件中是一个 函数申明，并没有依赖于 callBack()函数的定义。   那么 callBack的定义位置怎么会 对 这个函数的造成影响呢
4 楼 afcn0 2007-11-15  
常见个鸟,只要各个外部js文件都是声明,那就不会有问题,如果外部js也包括加载处理,但是不依赖别的文件中的声明或加载那也没问题,问题就是出现在后加载的需要前加载的进行一些声明设置,当然是按照顺序了,注意声明比较特殊,虽说声明是预处理,但是不同js文件当中的声明是不是预处理得看各个实现如何
3 楼 niuyuewanzi 2007-11-15  
应该明白你的意思...如果有多个<SCRIPT>标签,也应该是从上到下按顺序EXECUTE的. 就是说上面的<SCRIPT>里有个FUNCTION,下面的<SCRIPT>就可以继续用上面声明过的FUNCTION,反过来是不行的. 因为他们不在同一个<SCRIPT></SCRIPT>里. 当然也有例外,<SCRIPT DEFER>..</SCRIPT>有DEFER属性出现后,就等于告诉JAVASCRIPT,该<SCIRPT>要在整个DOCUMENT被处理完后在被执行,DEFER只在IE中有用...

2 楼 jonson 2007-11-15  
这个只是一个测试的js程序。
只测试了firefox，没有测ie哦。

这个情况在 写js的时候，应该 比较常见阿。
1 楼 afcn0 2007-11-15  
这都是什么古怪问题，大哥，你这么写<script type="text/javascript" src="test.js"/> 我都怀疑ie 怎么去解释，script元素不是这么结素的，是<script src=.....></script>
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    JavaScript函数的定义方法及函数的参数和优化.docx

    这种方法可以在函数定义之前或之后调用函数。 函数赋值式（function expression）是一种使用 var 关键字定义函数的方法，语法为：`var fun_name = function() { }`，把一个函数当作值直接赋值给这个变量。这种方法...

    JavaScript函数参数使用带参数名的方式赋值传入的方法

    传统的JavaScript函数参数传递是基于位置的，即按照参数在函数定义中的位置来接收值。然而，这种方式在参数较多时容易出错，特别是当参数顺序不正确或者缺失时。为了解决这一问题，JavaScript引入了一种更加直观的...

    JS函数库（很详尽的哦）

    JavaScript函数库是Web开发中不可或缺的一部分，它们提供了一系列预定义的函数和方法，极大地提高了开发效率，降低了代码的复杂性。这些库通常包含了各种实用工具、动画效果、数据处理、事件处理、AJAX交互等功能，...

    JS函数集（打印版）

    JavaScript 中的函数定义是：function functionName ([parameter], ...) { statement[s] }。 18. 多个 form 表单的处理： 可以使用 document.forms[0], document.forms[1] 等来处理多个 form 表单。 19. 窗口的...

    js 异步操作回调函数如何控制执行顺序

    与arguments.length不同，函数的length属性表示的是函数定义时的形参个数，而不是实际调用时传入的参数个数。这个属性可以提供关于函数接口的额外信息，例如函数预期接收的参数数量。 总而言之，控制JavaScript中的...

    javascript 构造函数方式定义对象

    默认情况下，它将元素按字符串顺序排序，但可以通过提供比较函数来自定义排序规则。在示例中，提供了两种方式定义比较函数： - 显式命名函数： ```javascript array.sort(compare); function compare(num1, num2...

    基础常用JS函数和语法集合大全

    本文总结了 JavaScript 中常用的函数和语法，涵盖了输出语句、注释、HTML 文档结构、DOM 顺序、元素选择、字符串操作、值类型转换、比较操作符、变量声明、判断语句、循环结构、函数定义、窗口操作、状态栏设置、弹...

    JS函数大全

    16. **函数定义**：使用`function functionName(参数) { ... }`形式定义函数。 #### 五、表单与用户交互 17. **表单操作**： - 使用`document.forms[index]`访问文档中的表单。 - 清空表单中所有文本型成员的值：...

    浅谈js函数三种定义方式 & 四种调用方式 & 调用顺序

    本文将深入探讨JavaScript函数的三种定义方式、四种调用方式以及调用顺序的原理。 首先，我们来看JavaScript中定义函数的三种常见方式： 1. 函数关键字(function)语句： 这是最传统的定义函数的方式，通过`...

    JavaScript 函数速查

    10. **迭代器和生成器函数**：`for...of`循环可以遍历`Symbol.iterator`方法返回的迭代器，`function*`定义的生成器函数允许你在运行时动态生成数据。 这只是JavaScript函数海洋的一小部分。深入学习JavaScript函数...

    JavaScript执行顺序

    JavaScript作为一种网页脚本语言，其执行顺序直接影响到脚本的运行效果和页面的行为。理解JavaScript代码是如何按照顺序被执行的是开发高质量Web应用的基础之一。 **1.1 按HTML文档流顺序执行JavaScript代码** ...

    JavaScript函数个人总结笔记

    JavaScript 函数个人总结...JS 中只有函数能生成局部作用域。 3. 作用域链 作用域链是指在内部函数可以访问外部函数变量的机制，用链式查找决定哪些数据能被内部函数访问。采用就近原则的方式来查找变量最终的值。

    javascript函数库

    JavaScript函数库是编程中常用的工具，它集合了一系列预先定义好的函数，方便开发者在编写代码时调用，以提高效率和代码的可维护性。在这个特定的JavaScript函数库中，我们看到许多用于数据验证和字符串处理的函数。...

    javascript的解析执行顺序在各个浏览器中的不同

    从提供的部分内容来看，文档设计了八个实验来探究在不同浏览器环境下JavaScript函数定义和调用顺序的差异性。下面是对这些实验的总结和分析： 实验一和实验二展示了当同名函数被不同次序定义时，对JavaScript代码...

    JavaScript程序设计课件：匿名函数.pptx

    ③ 函数定义与调用顺序不同 5.5 匿名函数 2. 匿名函数 概念：匿名函数指的是没有函数名称的函数。 作用：可以有效的避免全局变量的污染以及函数名的冲突问题。 说明：既是函数表达式的另一种表示形式，又可通过函数...

    深入理解JS函数的参数(arguments)的使用

    JavaScript函数的参数是一个重要的特性，它允许我们灵活地处理不同数量和类型的输入值。`arguments`对象是一个内置的类数组对象，它在每个函数内部都可用，提供了访问函数调用时传入的所有参数的能力，无论这些参数...

    Node.js-start-超级简单的任务Runner基于复合函数和promise链接

    这些文件可能包括任务定义、组合函数、主运行逻辑以及配置和错误处理的实现。通过阅读和分析这些代码，你可以更好地理解和应用上述技术。 总结来说，创建一个基于Node.js的超级简单任务Runner涉及Promise的使用、...

    JavaScript函数手册

    JavaScript函数手册是一本详细阐述JavaScript函数使用和理解的资源，主要以HTML格式提供，适合英文阅读者学习。手册涵盖了从基础到高级的各种函数用法，是开发者深入理解JavaScript语言的重要参考资料。通过各个部分...

    深入理解JavaScript执行上下文、函数堆栈、提升的概念.pdf

    函数堆栈则描述了函数调用时的顺序和结构，而变量提升则是 JavaScript 中的一个特殊机制，它允许变量和函数声明在实际代码执行之前被移动到它们所在作用域的顶部。 执行上下文（Execution Context）可以分为三种...

Magicbox
Global site tag (gtag.js) - Google Analytics