今天的这个文章题目名称甚是让人会突发异想。JS变量作用域是务必需要搞懂的，单从面试过程就会让面试者烧脑壳。所以，我们还是写一篇关于JS变量作用域的技术专题，让所有小伙伴能够借此文章去整理JS的基础学习。说不定很多人会比我理解这方面基础知识有更好地见解

黄金守则第一条： JS没有块级作用域（你可以自己闭包或其他方法实现），只有函数级作用域，函数外面的变量函数里面可以找到，函数里面的变量外面找不到

<!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; 的值

黄金守则第二条：在函数里面定义变量 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

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

<!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>

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

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

<!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>

[刘阳Java]_步步窥探JS变量作用域的更多相关文章

  1. [刘阳Java]_斗胆介绍一下Eclipse快捷键大全[超详细]_第6讲

    斗胆让我在这里介绍一下Eclipse快捷键有哪些 ctrl+shirt+r 打开资源 这组快捷键可以让你开打Eclipse工作区中任何一个文件,你只需要输入你想查找的文件名字即可,而且绝对支持模糊检索 ...

  2. [刘阳Java]_避开环境配置快速的使用Java的开发工具_第5讲

    我们一般学习Java都应该遵循通过系统的命令工具来编译Java程序,然后对编译好Java程序进行运行,这个是非常好的习惯.但是随着后期学习Java技术的深入我们也得像Java的IDE工具屈服.所以,可 ...

  3. [刘阳Java]_为什么要前后端分离

    前后端分离已成为互联网项目开发的业界标准使用方式,通过nginx+tomcat的方式(也可以中间加一个nodejs)有效的进行解耦,并且前后端分离会为以后的大型分布式架构.弹性计算架构.微服务架构.多 ...

  4. [刘阳Java]_第一个Java程序_第7讲

    1. 其实第一个Java程序是很简单,但是当自己编写第一个Java程序时候需要注意如下几个内容: 理解Java程序的运行环境 校验你的Java环境变量是否能够运行你所写的第一个Java程序 理解Jav ...

  5. [刘阳Java]_酷炫视频播放器制作_JS篇

    此文章是接着上次写的<酷炫视频播放器制作_界面篇>将其完善,我们主要给大家介绍一下如何利用JS脚本来控制视频的播放.为了让大家能够保持对要完成的功能有直接的了解,我们还是将效果图附到文章里 ...

  6. [刘阳Java]_精选20道Java多线程面试题

    1. 多线程使用的优缺点? 优点: (1)多线程技术使程序的响应速度更快 (2)当前没有进行处理的任务可以将处理器时间让给其它任务 (3)占用大量处理时间的任务可以定期将处理器时间让给其它任务 (4) ...

  7. [刘阳Java]_快速搭建MyBatis环境_第2讲

    1.MyBatis的环境配置 导入MyBatis包, mybatis-3.2.8.jar 导入MySQL驱动包, mysql-connector-java-5.1.24-bin.jar 创建表的实体类 ...

  8. [刘阳Java]_什么是MyBatis_第1讲

    1.什么MyBatis,我们先通过百度百科先进行一个简单的了解 MyBatis 本是apache的一个开源项目iBatis, 2010年这个项目由apache software foundation ...

  9. [刘阳Java]_程序员Java编程进阶的5个注意点，别编程两三年还是增删改查

    此文章也是关注网上好几篇技术文章后,今天分享出来.因为,总有在程序学习路上的小伙伴会感到迷茫.而迷茫存在的情况如下 第一种:在大学学习中出现的迷茫,不知道Java到底要学什么.学习Java的标准是什么 ...

随机推荐

  1. VUE3后台管理系统【路由鉴权】

    前言: 在"VUE3后台管理系统[模板构建]"文章中,详细的介绍了我使用vue3.0和vite2.0构建的后台管理系统,虽然只是简单的一个后台管理系统,其中涉及的技术基本都覆盖了, ...

  2. Docker App应用

    Docker App应用 这是一个实验特性. 实验性功能提供了对未来产品功能的早期访问.这些特性仅用于测试和反馈,因为它们可能在没有警告的情况下在不同版本之间更改,或者可以从将来的版本中完全删除.在生 ...

  3. Pipe Utilization管道利用率

    Pipe Utilization管道利用率 概述 CUDA设备的每个流式多处理器(SM)都具有许多专门用于执行特定任务的硬件单元.在芯片级,这些单元提供执行管道,翘曲调度程序将指令发送到这些管道.例如 ...

  4. BlazorCharts 原生图表库的建设历程

    作者:陈超超 Ant Design Blazor 项目贡献者,拥有十多年从业经验,长期基于.Net技术栈进行架构与开发产品的工作,现就职于正泰集团. 邮箱:timchen@live.com 欢迎各位读 ...

  5. 2、java基础语法（上）：变量与运算符

    关键字与保留字 关键字 定义:被Java语言赋予了特殊含义,用做专门用途的字符串(单词) 特点:关键字中所有字母都为小写 官方地址:https://docs.oracle.com/javase/tut ...

  6. [翻译]Go与C#的比较，第二篇：垃圾回收

    Go vs C#, part 2: Garbage Collection | by Alex Yakunin | ServiceTitan - Titan Tech | Medium 目录 译者注 什 ...

  7. bzoj2427 软件安装！ 树dp

    软件安装 内存限制:128 MiB 时间限制:1000 ms 标准输入输出     题目描述 现在我们的手头有N个软件,对于一个软件i,它要占用Wi的磁盘空间,它的价值为Vi.我们希望从中选择一 些软 ...

  8. 小白学k8s(8)-Bazel部署go应用

    Bazel使用了解 Bazel产生的背景 什么是Bazel 快(Fast) 可伸缩(scalable) 跨语言(multi-language) 可扩展(extensible) Bazel中的主要文件 ...

  9. VBS脚本编程（6）——对象的创建与调用

    对象:严格的说,对象是复杂数据和程序结构在内存中的表现,只有在程序运行时才存在.包含有方法和属性. 对象的创建及用法 1. Set 语句 将对象引用赋给一个变量或属性,或者将对象引用与事件关联. Se ...

  10. 学习JDK源码（二）：Integer

    最近没有好好保持学习的好习惯,该打. 天天忙,感觉都不知道在干嘛.真的厌倦了普通的Java代码,还是想学点新技术. 用了这么久的Java,最常用的数据类型肯定是Int了,而他的包装类Integer用的 ...