JS 作用域知识点与案例

<template>

</template>

<script>
	export default {
		data() {
			return {

			}
		},

		onLoad() {
			// 作用域导读
			// 1. js 作用域  就是代码名字（变量）在某个范围内起到作用与效果
			// 目的 就是为了提高程序的可靠性更重要的是减少命名冲突
			// 2. js作用域（es6）之前 全局作用域 局部作用域
			// 3. 全局作用域 ： 整个script 标签 或者是一个单独的js 文件
			var num = 10;
			console.log(num)
			// 10
			// 4.局部作用域（函数作用域） 在函数内部就是局部作用域 这个代词的名字只有在函数内部起到效果与作用
			function fn() {
				// 局部作用域
				var num = 20;
				console.log(num)
				// 20
			}
			fn();
			// 变量的作用域
			// 变量作用域的分类
			// js 中 根据作用域的不同 变量可以分为两种
			// 全局变量   在全局作用域下的变量 在全局下都可以使用
			// 注意 如果在函数内部 没有声明直接赋值的变量也是属于全局变量
			// 局部变量
			// 1.全局变量 
			var num = 30;
			console.log(num)
			// 30

			function fu() {
				console.log(num)
			}
			fu();
			// 30


			// 2 局部变量 在局部作用域下的变量 后者在函数内部的变量就是局部变量
			// 注意 函数的形参也可以看做是局部变量
			// function fus() {
			// 	// var num3 = 50;
			// 	num4 = 100;
			// }
			// fus();
			// console.log(num3); 结果报错
			// console.log(num4); 结果找不到
			// 3 从执行效率来看全局变量和局部变量
			// (1)全局变量只有游览器关闭的时候才会销毁 比较占内存资源
			// (2)局部变量 当我们程序执行完毕就会销毁 比较节约内存资源

			// 作用域链 内部函数访问外部函数的变量 采取的是链式查找的方式来决定取那个值 这种结构称之为作用域链
			// 就近原则
			var num6 = 10;

			function fues() {
				var num6 = 50;

				function fuse() {
					console.log(num6)
				}
				fuse();
			}
			fues();

			// 作用链案例
			// 案列1 结果是几？
			function f1() {
				var num8 = 123;

				function f2() {
					console.log(num);
				}
				f2();

			}
			var num9 = 456;
			f1();

			// console.log(num); 123
		}

	}
	methods: {

	}
</script>

<style>

</style>