今天的这个文章题目名称甚是让人会突发异想。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. 大尺寸卫星图像目标检测:yoloT

    大尺寸卫星图像目标检测:yoloT 1. 前言 YOLT论文全称「You Only Look Twice: Rapid Multi-Scale Object Detection In Satellit ...

  2. 鱼眼摄像头SLAM

    鱼眼摄像头SLAM 在机器人技术.摄影测量学和计算机视觉等领域,鲁棒相机位姿估计是许多视觉应用的核心.近年来,在复杂.大规模的室内外环境中,人们越来越关注相机位姿估计方法的实时性.通用性和可操作性.其 ...

  3. 内核、dns、网卡配置

    升级内核(安装新版软件包) rpm -ivh kernel-3.10.0-123.1.2.el7.x86_64.rpm 二.配置永久IP地址,子网掩码,网关地址   /etc/sysconfig/ne ...

  4. Django基础之auth模块

    内容概要 用户认证模块auth auth模块补充 auth_user表扩展字段 内容详细 auth模块 主要是用来做用户相关的功能 注册 登录 验证 修改密码 注销 ​ 访问admin需要管理员账号 ...

  5. 为什么我严重不建议去培训机构参加SAP培训?

    欢迎关注微信公众号:sap_gui (ERP咨询顾问之家) 关于是否要参加SAP培训的话题已经是老生常谈了,知乎上随便一搜有好多人在问是否要去参加SAP培训,底下已经有很多人在上面给出了正确建议.但也 ...

  6. Jenkins 流水线远程部署 .NET Core/Framework 到 IIS

    目录 Windows 安装 Git WebDeploy Windows 从节点 .NET Core 处理 IIS 处理项目 Jenkinsfile .NET Framework 安装环境 .NET F ...

  7. STL----vector注意事项

    开vector时要注意内存容易炸 最好的办法就是在开vector之后,对他进行一步操作 vector<int> a; a.resize(n); n就是你要开的数组的大小,此时数组里已经插入 ...

  8. mapboxgl绘制3D线

    最近遇到个需求,使用mapboxgl绘制行政区划图层,要求把行政区划拔高做出立体效果,以便突出显示. 拿到这个需求后,感觉很简单呀,只需要用fill-extrusion方式绘制就可以啦,实现出来是这个 ...

  9. kubelet之volume manager源码分析

    kubernetes ceph-csi分析目录导航 基于tag v1.17.4 https://github.com/kubernetes/kubernetes/releases/tag/v1.17. ...

  10. AWS上的EFK环境部署

    1.准备工作及组件 本章使用自建服务以及aws服务来配置使用. 服务 版本 作用 filebeat 6.7.2→ 7.3.1 节点日志收集,只完成少量比如多行合并工作 logstash 6.4.2→7 ...