当前位置: 首页 > article >正文

javascript-es6 (一)

作用域(scope)

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

局部作用域

函数作用域:
在函数内部声明的变量只能在函数内部被访问,外部无法直接访问
function getSum(){
//函数内部是函数作用域 属于局部变量
const num = 10
}
console.log(num) //此处报错 函数外部不能使用局部作用域变量
总结:
1. 函数内部声明的变量,在函数外部无法被访问
2. 函数的参数也是函数内部的局部变量
3. 不同函数内部声明的变量无法互相访问
4. 函数执行完毕后,函数内部的变量实际被清空了
块作用域:
在 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 文件 的【最外层】就是所谓的全局作用域,在此声明的变量在函数内部也可以被访问。
全局作用域中声明的变量,任何其它作用域都可以被访问
<script>
//全局作用域
const num = 10
function fn(){
//函数内部可以使用全局作用域的变量
consoLe.log(num)  //10
}
</script>
注意:
1. 为 window 对象动态添加的属性默认也是全局的,不推荐!
2. 函数中未使用任何关键字声明的变量为全局变量,不推荐!
3. 尽可能少的声明全局变量,防止全局变量被污染

作用域链

<script>//全局作用域let a = 1let b = 2//局部作用域function f() {let a = 1// 局部作用域function g() {a = 2console.log(a)}g()}f()</script>
作用域链本质上是底层的 变量查找机制
在函数被执行时,会 优先查找当前 函数作用域中查找变量
如果当前作用域查找不到则会依次 逐级查找父级作用域 直到全局作用域
总结:
1. 嵌套关系的作用域串联起来形成了作用域链
2. 相同作用域链中按着从小到大的规则查找变量
3. 子作用域能够访问父作用域,父级作用域无法访问子级作用域

JS垃圾回收制(GC)

JS中内存的分配和回收都是自动完成的,内存在不使用的时候会被垃圾回收器自动回收
内存泄漏: 不再用到的内存,没有及时释放
内存的生命周期
1. 内存分配:当我们声明变量、函数、对象的时候,系统会自动为他们分配内存
2. 内存使用:即读写内存,也就是使用变量、函数等
3. 内存回收:使用完毕,由垃圾回收自动回收不再使用的内存
4. 说明:
全局变量一般不会回收(关闭页面回收);
一般情况下局部变量的值, 不用了, 会被自动回收掉
//为变量分配内存
const age = 18
//为对象分配内存
const obj = { age:19
}
//为函数分配内存
function fn() {const age = 18console.log(age)
}

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

闭包

概念:一个函数对周围状态的引用捆绑在一起,内层函数中访问到其外层函数的作用域
简单理解: 闭包 =  内层函数 + 外层函数的变量
function outer() {
//外层函数的变量const a = 1//内层函数
function f() {console.log(a)
}
f()
}
outer()

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

闭包作用: 封闭数据,提供操作,外部也可以访问函数内部的变量
闭包的基本格式:
//简约写法
function outer() {let i = 1return function() {console.log(i)}
}
const fun = outer()
fun()
//外层函数使用内层函数的变量
闭包应用: 实现数据的私有
比如,我们要做个统计函数调用次数,函数调用一次,就++
function fn() {let count = 1function 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.  然后依次执行代码

相关文章:

javascript-es6 (一)

作用域&#xff08;scope&#xff09; 规定了变量能够被访问的“范围”&#xff0c;离开了这个“范围”变量便不能被访问 局部作用域 函数作用域&#xff1a; 在函数内部声明的变量只能在函数内部被访问&#xff0c;外部无法直接访问 function getSum(){ //函数内部是函数作用…...

Babylon.js 中的 setHardwareScalingLevel和getHardwareScalingLevel:作用与配合修改内容

在 Babylon.js 中&#xff0c;Engine类提供了setHardwareScalingLevel和getHardwareScalingLevel方法&#xff0c;用于管理和调整渲染分辨率与屏幕分辨率的比例。这些方法在优化性能和提升画质方面非常有用。尤其是在某些平台不支持硬件反锯齿时&#xff0c;可以考虑使用setHar…...

二十三种设计模式-桥接模式

桥接模式&#xff08;Bridge Pattern&#xff09;是一种结构型设计模式&#xff0c;其核心思想是将抽象与实现解耦&#xff0c;让它们可以独立变化。桥接模式主要用于解决类的继承问题&#xff0c;避免由于继承而带来的类层次结构过于复杂和难以维护的问题。 1. 核心概念 桥接…...

jenkins-k8s pod方式动态生成slave节点

一. 简述&#xff1a; 使用 Jenkins 和 Kubernetes (k8s) 动态生成 Slave 节点是一种高效且灵活的方式来管理 CI/CD 流水线。通过这种方式&#xff0c;Jenkins 可以根据需要在 Kubernetes 集群中创建和销毁 Pod 来执行任务&#xff0c;从而充分利用集群资源并实现更好的隔离性…...

代码工艺:实践 Spring Boot TDD 测试驱动开发

TDD 的核心理念是 “先写测试&#xff0c;再写功能”&#xff0c;其过程遵循一个严格的循环&#xff0c;即 Red-Green-Refactor&#xff1a; TDD 的流程 1. Red&#xff08;编写失败的测试&#xff09; 根据需求&#xff0c;先编写一个测试用例&#xff0c;描述期望的行为。…...

【云安全】云原生-K8S-简介

K8S简介 Kubernetes&#xff08;简称K8S&#xff09;是一种开源的容器编排平台&#xff0c;用于管理容器化应用的部署、扩展和运维。它由Google于2014年开源并交给CNCF&#xff08;Cloud Native Computing Foundation&#xff09;维护。K8S通过提供自动化、灵活的功能&#xf…...

aws(学习笔记第二十六课) 使用AWS Elastic Beanstalk

aws(学习笔记第二十六课) 使用aws Elastic Beanstalk 学习内容&#xff1a; AWS Elastic Beanstalk整体架构AWS Elastic Beanstalk的hands onAWS Elastic Beanstalk部署node.js程序包练习使用AWS Elastic Beanstalk的ebcli 1. AWS Elastic Beanstalk整体架构 官方的guide AWS…...

反向代理模块。。

1 概念 1.1 反向代理概念 反向代理是指以代理服务器来接收客户端的请求&#xff0c;然后将请求转发给内部网络上的服务器&#xff0c;将从服务器上得到的结果返回给客户端&#xff0c;此时代理服务器对外表现为一个反向代理服务器。 对于客户端来说&#xff0c;反向代理就相当于…...

C语言的灵魂——指针(1)

指针是C语言的灵魂&#xff0c;有了指针C语言才能完成一些复杂的程序&#xff1b;没了指针就相当于C语言最精髓的部分被去掉了&#xff0c;可见指针是多么重要。废话不多讲我们直接开始。 指针 一&#xff0c;内存和地址二&#xff0c;编址三&#xff0c;指针变量和地址1&#…...

14-6-2C++STL的list

(一&#xff09;list对象的带参数构造 1.list&#xff08;elem);//构造函数将n个elem拷贝给本身 #include <iostream> #include <list> using namespace std; int main() { list<int> lst(3,7); list<int>::iterator it; for(itlst.begi…...

Linux 基础1

gcc的编译过程 预处理——编译——汇编——链接 Linux文件类型 普通文件&#xff0c;目录文件&#xff0c;管道文件&#xff0c;链接文件&#xff0c;块设备文件&#xff0c;字符设备文件&#xff0c;套接字文件 Linux系统下的软链接和硬链接有什么异同 linux中软链接和硬…...

Ubuntu Server 安装 XFCE4桌面

Ubuntu Server没有桌面环境&#xff0c;一些软件有桌面环境使用起来才更加方便&#xff0c;所以我尝试安装桌面环境。常用的桌面环境有&#xff1a;GNOME、KDE Plasma、XFCE4等。这里我选择安装XFCE4桌面环境&#xff0c;主要因为它是一个极轻量级的桌面环境&#xff0c;适合内…...

xarray转换nc文件经度范围:0-360更改为-180-180

原文见https://blog.csdn.net/weixin_44237337/article/details/119707332&#xff0c;因为觉得很实用就转载一下。 lon_name longitude #你的nc文件中经度的命名 ds[longitude_adjusted] xr.where(ds[lon_name] > 180,ds[lon_name] - 360,ds[lon_name]) ds (ds.swap_d…...

MySQL 基础学习(1):数据类型与操作数据库和数据表

MySQL 基础学习&#xff1a;数据类型与操作数据库和数据表 在这篇博客中&#xff0c;我们将深入学习 MySQL 的基础操作&#xff0c;重点关注数据库和数据表的操作&#xff0c;以及 MySQL 中常见的数据类型。希望本文能帮助你更好地理解和掌握 MySQL 的基本用法。 一、操作数据…...

一个简单的自适应html5导航模板

一个简单的 HTML 导航模板示例&#xff0c;它包含基本的导航栏结构&#xff0c;同时使用了 CSS 进行样式美化&#xff0c;让导航栏看起来更美观。另外&#xff0c;还添加了一些 JavaScript 代码&#xff0c;用于在移动端实现导航菜单的展开和收起功能。 PHP <!DOCTYPE htm…...

深入解析“Wholesome”的含义及用法

深入解析“Wholesome”的含义及用法 一、引言 在阅读英文材料时&#xff0c;我们经常会遇到一些词汇&#xff0c;它们的含义既有直接的字面意思&#xff0c;又带有丰富的情感色彩。“Wholesome”就是这样一个词。它表面上看似简单&#xff0c;但在不同语境中却有多重内涵。在…...

供水企业满意度调查报告

民安智库作为一家独立的第三方评估机构&#xff0c;致力于为供水企业提供全面的客户满意度调查服务。本报告将详细介绍民安智库的调查方法、结果和建议&#xff0c;以帮助供水企业更好地理解其服务质量和客户需求。 一、调查方法 民安智库首先对客户进行了分类&#xff0c;包括…...

实现B-树

一、概述 1.历史 B树&#xff08;B-Tree&#xff09;结构是一种高效存储和查询数据的方法&#xff0c;它的历史可以追溯到1970年代早期。B树的发明人Rudolf Bayer和Edward M. McCreight分别发表了一篇论文介绍了B树。这篇论文是1972年发表于《ACM Transactions on Database S…...

无人机微波图像传输数据链技术详解

无人机微波图像传输数据链技术是无人机通信系统中的关键组成部分&#xff0c;它确保了无人机与地面站之间高效、可靠的图像数据传输。以下是对该技术的详细解析&#xff1a; 一、技术原理 无人机微波图像传输数据链主要基于微波通信技术实现。在数据链路中&#xff0c;图像数…...

【Leetcode 热题 100】300. 最长递增子序列

问题背景 给你一个整数数组 n u m s nums nums&#xff0c;找到其中最长严格递增子序列的长度。 子序列 是由数组派生而来的序列&#xff0c;删除&#xff08;或不删除&#xff09;数组中的元素而不改变其余元素的顺序。例如&#xff0c; [ 3 , 6 , 2 , 7 ] [3,6,2,7] [3,6,2…...

macos的图标过大,这是因为有自己的设计规范

苹果官方链接&#xff1a;App 图标 | Apple Developer Documentation 这个在官方文档里有说明&#xff0c;并且提供了sketch 和 ps 的模板。 figma还提供了模板&#xff1a; Figma...

信号处理以及队列

下面是一个使用C和POSIX信号处理以及队列的简单示例。这个示例展示了如何使用信号处理程序将信号放入队列中&#xff0c;并在主循环中处理这些信号。 #include <iostream> #include <csignal> #include <queue> #include <mutex> #include <thread…...

微信阅读网站小程序的设计与实现(LW+源码+讲解)

专注于大学生项目实战开发,讲解,毕业答疑辅导&#xff0c;欢迎高校老师/同行前辈交流合作✌。 技术范围&#xff1a;SpringBoot、Vue、SSM、HLMT、小程序、Jsp、PHP、Nodejs、Python、爬虫、数据可视化、安卓app、大数据、物联网、机器学习等设计与开发。 主要内容&#xff1a;…...

美国公司有意收购TikTok(抖音)

众所周知&#xff0c;2016年TikTok由字节跳动集团推出&#xff0c;最初以“抖音”为名在中国市场推广&#xff0c;随后于2017年下半年出海&#xff0c;面向国际市场更名为“TikTok”。 新华社1月19日快讯&#xff1a;“TikTok公司当地时间18日晚通知美国用户&#xff0c;由于美…...

《Java程序设计》课程考核试卷

一、单项选择题&#xff08;本大题共10个小题&#xff0c;每小题2分&#xff0c;共20分&#xff09; 1.下列用来编译Java源文件为字节码文件的工具是&#xff08; &#xff09;。 A.java B.javadoc C.jar D.javac 2…...

ThinkPHP 8 操作JSON数据

【图书介绍】《ThinkPHP 8高效构建Web应用》-CSDN博客 《2025新书 ThinkPHP 8高效构建Web应用 编程与应用开发丛书 夏磊 清华大学出版社教材书籍 9787302678236 ThinkPHP 8高效构建Web应用》【摘要 书评 试读】- 京东图书 使用VS Code开发ThinkPHP项目-CSDN博客 编程与应用开…...

《AI赋能光追:开启图形渲染新时代》

光线追踪技术是图形渲染领域的重大突破&#xff0c;能够通过模拟光的传播路径&#xff0c;精准渲染反射、折射、阴影和间接光照等效果&#xff0c;实现高度逼真的场景呈现。而人工智能的加入&#xff0c;更是为光线追踪技术带来了前所未有的变革&#xff0c;主要体现在以下几个…...

LeetCode | 最小路径和的两种解决办法

第一种&#xff1a;动态规划 思路 在过去&#xff0c;有这样一个词&#xff0c;那就是遇难则反&#xff0c;从起点推导出最小路径和是困难的&#xff0c;那我们就从终点去推导。 解题过程 我们都知道一个方块&#xff0c;只能向右或向下。在初始化dp之后&#xff0c;我们会…...

Windows 环境下 Docker Desktop + Kubernetes 部署项目指南

Windows 环境下 Docker Desktop Kubernetes 部署项目指南 一、环境准备二、安装与配置 Kubernetes安装 windows 版的 docker启动 kubernetes安装 windows 版的 kubectl 工具下载 k8s-for-docker-desktop启动 Kubernetes Dashboard 二、在 Kubernetes 上部署项目创建一个 demo …...

WebSocket 详解:全双工通信的实现与应用

目录 一、什么是 WebSocket&#xff1f;&#xff08;简介&#xff09; 二、为什么需要 WebSocket&#xff1f; 三、HTTP 与 WebSocket 的区别 WebSocket 的劣势 WebSocket 的常见应用场景 WebSocket 握手过程 WebSocket 事件处理和生命周期 一、什么是 WebSocket&#xf…...