script的函数知识点

最新推荐文章于 2024-06-14 11:12:43 发布

sandalphon4869

最新推荐文章于 2024-06-14 11:12:43 发布

阅读量764

点赞数

分类专栏： html

本文链接：https://blog.csdn.net/sandalphon4869/article/details/118681946

版权

html 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

文章目录

基础
script的两种函数
script与body的位置

基础

碰到出错的语句，抛出错误后就立马停下，之后的都不执行了。
一个<script></script>块和另一个<script></script>块，其内变量互通。

<script>
	var str = '第一块中的变量在第二块中出现了';
	function f1() {
		console.log('第一块中定义的函数，在第二块中成功执行了');
	}
	f2();
	console.log('f2应该不出现')
</script>

<script>
	function f2() {
		console.log('第二块中定义的函数，不应该在第一块中执行成功');
	}
	f1();
	console.log(str);
</script>

在这里插入图片描述

script的两种函数

js代码会先进入预编译阶段，然后再进入执行阶段：

预编译阶段：声明变量；处理声明式函数。
执行阶段：赋值变量；处理赋值式函数；处理调用函数语句。
同一阶段中按语句先后顺序执行。

PS：这个东西只关乎“调用函数语句”和“声明式函数”“赋值式函数”的先后关系，不关乎函数内部实现问题。

例子1

f1();						// 调用函数语句
function f1() { 			// 声明式函数
	console.log('f1');
}
// f1();  					//这就不用说都肯定行

在这里插入图片描述
所以，造成了可以f1()可以写在function f1(){}前的情况。

例子2

f2();						// 调用函数语句
var f2 = function(){  		// 赋值式函数  
	console.log('f2');
}

在这里插入图片描述
f2()和function f2(){}都在执行阶段中，按照顺序处理，所以就会出现未定义的问题。

在这里插入图片描述

例子3：重复定义的覆盖现象

f1();					
function f1() { 
	console.log('f1.A');
}
function f1() { 			
	console.log('f1.B');
}


var f2 = function(){  		
	console.log('f2.A');
}
var f2 = function(){  		
	console.log('f2.B');
}
f2();

结果是f1.B，f2.B。

script与body的位置

<script type="text/javascript">
	console.log("1：body前");
	function f() {
		console.log("3：body的onload()");
	}
</script>

<body onload="f()">
</body>

<script type="text/javascript">
	console.log("2：body后");
</script>

在这里插入图片描述

Reference
javascript运行机制之执行顺序详解

sandalphon4869

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
2
评论
script的函数知识点

文章目录script的两种函数script与body的位置script的两种函数js代码会先进入预编译阶段，然后再进入执行阶段：预编译阶段：声明变量；处理声明式函数。执行阶段：赋值变量；处理赋值式函数；处理调用函数语句。同一阶段中按语句先后顺序执行。例子1f1(); // 调用函数语句function f1() { // 声明式函数 console.log('f1');}所以，造成了可以f1()可以写在function f1(){}前的情况。例子2
复制链接

扫一扫

专栏目录