[刘阳Java]_步步窥探JS变量做用域

时间 2019-12-09

标签 java 步步窥探变量栏目 Java 繁體版

原文原文链接

今天的这个文章题目名称甚是让人会突发异想。JS变量做用域是务必须要搞懂的，单从面试过程就会让面试者烧脑袋。因此，咱们仍是写一篇关于JS变量做用域的技术专题，让全部小伙伴可以借此文章去整理JS的基础学习。说不定不少人会比我理解这方面基础知识有更好地看法javascript

黄金守则第一条： JS没有块级做用域（你能够本身闭包或其余方法实现），只有函数级做用域，函数外面的变量函数里面能够找到，函数里面的变量外面找不到html

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <script>
	var a = 10;
	function m01() {
		alert(a);
	}
	function m02() { // 尝试经过m02方法去改变变量a的值
		var a = 20;
		m01();
	}
	m02();
  </script>
 </head>
 <body>
 </body>
</html>

黄金守则第一条原理：由于在方法m02里面定义变量a是局部变量，它不会影响最外面的var a = 10; 的值java

黄金守则第二条：在函数里面定义变量 var a = b = 10; 其实a是局部变量，b是全局变量。此程序的坑实在是难以让程序员们接受程序员

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <script>
	function m01() {
		var a = b = 10;	
	}
	m01();
	// alert(a); 运行这段代码就报错; Uncaught ReferenceError: a is not defined
	alert(b);
  </script>
 </head>
 <body>
 </body>
</html>

黄金守则第三条：变量的查找是就近原则，去寻找var定义的变量，当就近没有找到的时候就去查找外层。面试

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <script>
  	var a = 10;
	function m01() {
		alert(a);
		var a = 20;
	}
	m01();
  </script>
 </head>
 <body>
 </body>
</html>

==============================================================闭包

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <script>
  	var a = 10;
	function m01() {
		alert(a);
		a = 20;
	}
	m01();
  </script>
 </head>
 <body>
 </body>
</html>

======================================================函数

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <script>
  	var a = 10;
	function m01() {
		m02();
		alert(a);
		function m02() {
			var a = 20;
		}
	}
	m01();
  </script>
 </head>
 <body>
 </body>
</html>

这段代码有些意思，为何会输出10。由于，在alert(a)的时候，bbb函数中的a确实为20 ，但是它对于这时的alert(a)这句话来讲是局部的，alert(a)根本找不到bbb函数中的a，因此在aaa函数中它找不到a，因而乎去外面找，一找，就找到了10学习

黄金守则第四条：当参数跟局部变量重名时，优先级是等同的。spa

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <script>
  	var a = 10;
	function m01(a) {
		a += 3;
	}
	m01(a);
	alert(a);
  </script>
 </head>
 <body>
 </body>
</html>

=============================================================3d

参数是基本类型，只传了值进去，下面的传个引用类型

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <script>
  	var a = [1,2,3];
	function m01(a) {
		a = [1,2,3,4];
	}
	m01(a);
	alert(a);
  </script>
 </head>
 <body>
 </body>
</html>

==========================================================

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <script>
  	var a = [1,2,3];
	function m01(a) {
		a.push(4);
	}
	m01(a);
	alert(a);
  </script>
 </head>
 <body>
 </body>
</html>

1. 窥探 JavaScript 中的变量做用域
2. js变量做用域
3. JS变量的做用域
4. JS变量、做用域
5. js变量的做用域
6. JS变量+做用域
7. js中变量做用域
8. js的变量，变量做用域，做用域链
9. squid服务初步窥探
10. H5 Canvas | 画布中变量做用域与setInterval方法同步执行探究
更多相关文章...
• PHP 变量 - PHP教程
• ASP 变量 - ASP 教程
• PHP Ajax 跨域问题最佳解决方案
• Composer 安装与使用