javascript-es6 (一)

作用域(scope)

规定了变量能够被访问的"范围",离开了这个"范围"变量便不能被访问

局部作用域

函数作用域:
在函数内部声明的变量只能在函数内部被访问,外部无法直接访问

javascript 复制代码
function getSum(){
//函数内部是函数作用域 属于局部变量
const num = 10
}
console.log(num) //此处报错 函数外部不能使用局部作用域变量

总结:

  1. 函数内部声明的变量,在函数外部无法被访问
  2. 函数的参数也是函数内部的局部变量
  3. 不同函数内部声明的变量无法互相访问
  4. 函数执行完毕后,函数内部的变量实际被清空了
    块作用域:
    在 JavaScript 中 使用 { } 包裹的 代码称为代码块,代码块内部声明的变量外部将【 有可能 】无法被访问
javascript 复制代码
for(let i = 1; i <= 6; i++){
    //i 只能在代码块中被访问
    console.log(i)  //正常
}
//超出了i 的作用域
console.log(i)  //报错

总结:

  1. let const 声明的变量会产生块作用域,var 不会产生块作用域
  2. 不同代码块之间的变量无法互相访问
  3. 推荐使用 let 或 const

全局作用域

<script> 标签 和 .js 文件 的【最外层】就是所谓的全局作用域,在此声明的变量在函数内部也可以被访问。
全局作用域中声明的变量,任何其它作用域都可以被访问

javascript 复制代码
<script>
//全局作用域
const num = 10
function fn(){
//函数内部可以使用全局作用域的变量
consoLe.log(num)  //10
}
</script>

注意:

  1. 为 window 对象动态添加的属性默认也是全局的,不推荐!
  2. 函数中未使用任何关键字声明的变量为全局变量,不推荐!
  3. 尽可能少的声明全局变量,防止全局变量被污染

作用域链

javascript 复制代码
<script>
    //全局作用域
    let a = 1
    let b = 2
    //局部作用域
    function f() {
      let a = 1
      // 局部作用域
      function g() {
        a = 2
        console.log(a)
      }
      g()
    }
    f()
  </script>

作用域链本质上是底层的 变量查找机制 。
在函数被执行时,会 优先查找当前 函数作用域中查找变量
如果当前作用域查找不到则会依次 逐级查找父级作用域 直到全局作用域
总结:

  1. 嵌套关系的作用域串联起来形成了作用域链
  2. 相同作用域链中按着从小到大的规则查找变量
  3. 子作用域能够访问父作用域,父级作用域无法访问子级作用域

JS垃圾回收制(GC)

JS中内存的分配和回收都是自动完成的,内存在不使用的时候会被垃圾回收器自动回收
内存泄漏: 不再用到的内存,没有及时释放
内存的生命周期

  1. 内存分配:当我们声明变量、函数、对象的时候,系统会自动为他们分配内存
  2. 内存使用:即读写内存,也就是使用变量、函数等
  3. 内存回收:使用完毕,由垃圾回收自动回收不再使用的内存
  4. 说明:
    全局变量一般不会回收(关闭页面回收);
    一般情况下局部变量的值, 不用了, 会被自动回收掉
javascript 复制代码
//为变量分配内存
const age = 18
//为对象分配内存
const obj = { 
    age:19
}
//为函数分配内存
function fn() {
    const age = 18
    console.log(age)
}

堆栈空间分配区别:

  1. 栈(操作系统): 由 操作系统自动分配释放 函数的参数值、局部变量等,基本数据类型放到栈里面
  2. 堆(操作系统): 一般由程序员分配释放,若程序员不释放,由 垃圾回收机制 回收。 复杂数据类型 放到堆里面
    引用计数(不再使用)
    IE采用的引用计数算法, 定义" 内存不再使用 ",就是看一个 对象 是否有指向它的引用,没有引用了就回收对象
    算法:
  3. 跟踪记录被 引用的次数
  4. 如果被引用了一次,那么就记录次数1,多次引用会 累加 ++
  5. 如果减少一个引用就 减1 --
  6. 如果引用次数是 0 ,则释放内存
    嵌套引用 (循环引用)
    如果两个对象 相互引用 ,尽管他们已不再使用,垃圾回收器不会进行回收,导致内存泄露
    标记清除法
    现代的浏览器已经不再使用引用计数算法了
    现代浏览器通用的大多是基于 标记清除算法 的某些改进算法,总体思想都是一致的
    核心:
  7. 标记清除算法将"不再使用的对象"定义为" 无法达到的对象 "。
  8. 就是从 根部 (在JS中就是全局对象)出发定时扫描内存中的对象。 凡是能从 根部到达 的对象,都是还 需要使用 的。
  9. 那些 无法 由根部出发触及到的 对象被标记 为不再使用,稍后进行 回收

闭包

概念:一个函数对周围状态的引用捆绑在一起,内层函数中访问到其外层函数的作用域
简单理解: 闭包 = 内层函数 + 外层函数的变量

javascript 复制代码
function outer() {
//外层函数的变量
    const a = 1

//内层函数
function f() {
    console.log(a)
}
f()
}
outer()

可以通过控制台打断点,查看是否存在闭包

闭包作用: 封闭数据,提供操作,外部也可以访问函数内部的变量
闭包的基本格式:

javascript 复制代码
//简约写法
function outer() {
    let i = 1
    return function() {
    console.log(i)
 }
}
const fun = outer()
fun()
//外层函数使用内层函数的变量

闭包应用: 实现数据的私有
比如,我们要做个统计函数调用次数,函数调用一次,就++

javascript 复制代码
function fn() {
    let count = 1
    function fun() {
    count++
    console.log(`函数被调用${count}次`)
}
return fun
}
const result = fn()
result() //2
result() //3

闭包很有用,因为它允许将函数与其所操作的某些数据(环境)关联起来,但
闭包可能引起 内存泄漏 等问题

变量提升

变量提升是 JavaScript 中比较"奇怪"的现象,它允许在变量声明之前即被访问(仅存在于var声明变量
注意:

  1. 变量在未声明即被访问时会报语法错误
  2. 变量在var声明之前即被访问,变量的值为 undefined
  3. let/const 声明的变量不存在变量提升
  4. 变量提升出现在相同作用域当中
  5. 实际开发中推荐先声明再访问变量

变量提升是什么流程?

  1. 先把var 变量提升到当前作用域于最前面
  2. 只提升变量声明, 不提升变量赋值
  3. 然后依次执行代码
相关推荐
中工钱袋20 分钟前
Vue 中地址栏参数与 HTTP 请求参数的同步问题
前端·vue.js·http
蜡笔小新..20 分钟前
R语言和RStudio安装
开发语言·r语言
ALPH_21 分钟前
R语言的基础命令及实例操作
开发语言·数据分析·r语言·perl·r语言-4.2.1
一只月月鸟呀22 分钟前
Vue 过滤器 filter(s) 的使用
javascript·vue.js·ecmascript
zzlyx9924 分钟前
设备管理系统功能与.NET+VUE(IVIEW)技术实现
前端·vue.js·view design
咩咩觉主24 分钟前
C# &Unity 唐老狮 No.6 模拟面试题
开发语言·unity·面试·c#·游戏引擎·唐老师
秋月华星2 小时前
【flutter】TextField输入框工具栏文本为英文解决(不用安装插件版本
前端·javascript·flutter
蓑衣客VS索尼克2 小时前
单片机中的基础外设GPIO的知识和应用—(6)
笔记·stm32·单片机·嵌入式硬件
*.✧屠苏隐遥(ノ◕ヮ◕)ノ*.✧3 小时前
C语言_数据结构总结8:链式队列
c语言·开发语言·数据结构·链表·visualstudio·visual studio
—Qeyser3 小时前
用Deepseek写一个 HTML 和 JavaScript 实现一个简单的飞机游戏
javascript·游戏·html