ES6知识

news2024/11/19 1:22:37

作用域

局部作用域

局部作用域分为函数作用域和块作用域

  • 函数作用域
    • 在函数内部声明的变量只能在函数内部被访问,外部无法直接访问。
    • 函数的参数也是函数内部的局部变量。
    • 不同函数内部声明的变量无法互相访问。
    • 函数执行完毕后,函数内部的变量实际被清空了。
  • 块作用域:在js中使用 {} 包裹的代码称为代码块,代码块内部声明的变量外部将【有可能】无法被访问(var声明的可以)
  • let 声明的变量会产生块作用域,var 不会产生块作用域。
  • const 声明的常量也会产生块作用域。
  • 不同代码块之间的变量无法互相访问。
  • 推荐使用let 或 const。

全局作用域

写在script 标签 和 js 文件的最外层的 叫全局作用域。

作用域链

作用域链的本质上是底层的变量查找机制。

  • 在函数被执行时,会优先查找当前函数作用域中查找变量。
  • 如果当前作用域查找不到则会依次逐级查找父级作用域直到全局作用域。

总结:

  • 嵌套关系的作用域串联起来形成了作用域链。
  • 相同作用域链中按着从小到大的规则查找变量【子 ->父】
  • 子作用域能访问父作用域,父作用域无法访问子级作用域。

垃圾回收机制

内存的生命周期

JS环境中分配的内存,一般有如下的生命周期:

  • 内存分配:当我们声明变量、函数、对象的时候,系统会自动为他们分配内存。
  • 内存使用:即读写内存,也就是使用变量、函数等。
  • 内存回收:使用完毕,由垃圾回收器自动回收不再使用的内存。

说明

  • 全局变量一般不会回收【关闭页面回收】
  • 一般情况下局部变量的值,不用了,会被自动回收掉

内存泄漏

  • 程序中分配的内存 由于某种原因程序未释放或无法释放 叫做内存泄漏。

堆栈空间分配区别

  • 栈:由操作系统自动分配释放函数的参数值、局部变量等,基本数据类型放到栈里面
  • 堆:一般由程序员分配释放,若程序员不释放,由垃圾回收机制回收,复杂数据类型放到堆里面

垃圾回收算法

  • 引用计数法:【内存不再使用就回收,跟踪记录被引用的次数】
  • 标记清除法:【找不到就清除,从全局对象出发定期扫描内存中的对象,找得到就留着,找不到就回收】

闭包

闭包 = 内层函数 + 外层函数的变量【就是  里层函数+外层函数的变量】

  • 作用:外部也可以使用函数内部的变量。
  • 应用:实现数据的私有化。

变量和函数提升

变量提升

执行过程:在代码执行之前,他会把当前作用域下,所有var声明的,提升到当前作用域之前。【只提升声明,不提升赋值】

函数提升

  • 会把所有函数声明提升到当前作用域的最前面。【只提升函数声明,不提升函数调用 】
  • 函数表达式【 var fun = function(){} 】必须先声明和赋值,后调用,否则会报错。

arguments【动态参数】

arguments是函数内部内置的维数组变量,它包含了调用函数时传入的所有实参。【当不确定传递多少个实参的时候,就用它】

  • arguments是一个伪数组【不可以用数组的方法】只存在于函数中
  • arguments 的作用是动态获取函数的参数
  • 可以通过for 循环依次得到传递过来的实参

剩余参数

  • ...是语法符号,用于获取多余的实参
  • 借助 ... 获取的剩余参数,是个真数组
  • 使用的时候不需要...
  • 只存在于函数里面

展开运算符

  • 展开运算符(...),将一个数组、对象进行展开。
  • 他不会修改原数组。
  • 使用场景:求数组最大值、合并数组等【 Math.max(...arr) 、console.log(...arr1,...arr2)   】

箭头函数

  • 只有一个参数的时候可以省略()
  • 只有一行代码的时候可以省略  {} 和 return
  • const fn = () =>{}
  • 可以直接返回一个对象,但是必须加():const fn = uname =>({name:uname})
  • 箭头函数属于表达式函数,因此不存在函数提升。

参数

  • 普通函数有 arguments 动态参数
  • 箭头函数没有arguments 动态参数,只有剩余参数(...arr)

this

  • 箭头函数的this  是上一层作用域的this 指向
  • 对象方法中的箭头函数,this指向上一层作用域()

解构赋值

数组解构

数组解构就是将 数组的单元值快速批量赋值一系列变量的简介语法。

赋值运算符 = 左侧的 [] 用于批量声明变量,右侧数组的单元值将被赋值给左侧的变量。

案例:交换变量

  • 注意:第二行必须有 ;
  • js 前面必须加分号的两种情况:
    • 立即执行函数:(function t(){})();  或者   ;(function t(){})()
    • 数组解构:;[b,a] = [a,b]【以数组开头的】

总结:

  • 变量多,单元值少:最后一个变量undefined
  • 变量少,单元值多:const[a,b] = [1,2,3],a和b的值为 1,2【可以利用剩余参数解决,但只能置于最末位】
  • 防止 undefined 传递:const[a=0,b=0] = []
  • 按需导入,忽略某些值:const[a,b,,d] = [1,2,3,4]【d是4,位置空下来了,要留位置】
  • 多维数组解构:const [a,b,[c,d]] = [1,2,[3,4]]

对象解构

  • const {uanme,age} = {uname:'j',age:1}【这种方式前后属性名必须一致】

  • const {uanme:name,age} = {uname:'j',age:1}【旧变量名:新变量名】
  • 数组对象解构:
    • const [{name,age}] = [{name:'q',age:9}]

    • 多级对象解构:

        const pp = {
                  nam:'佩奇',
                  family:{
                      mother:'mama',
                      father:'baba',
                      sister:'乔治'
                  },
                  ag:6
              }
       const {nam,family:{mother,father,sister},ag} = pp

forEach

  • forEach() 方法用于遍历数组对象的每个元素,并将元素传递给回调函数
  • 语法:
    const aa = [1,2,3,4,5]
    aa.forEach(function(item,index){
        console.log(item)
    })

创建对象

  • const p = {name:'k'}【利用字面量】

  • const p =  new Object({name:'k'})【利用new object】

  • 利用(自定义)构造函数来创建对象

    • 实例化过程:

      • 创建空对象

      • 构造函数this 指向新对象

      • 执行构造函数代码

      • 返回新对象(构造函数里面不需要写return)

Object

  • object.key()   获得所有属性名
  • object.value()   获得所有属性值
  • object.assign(拷贝给谁,要拷贝谁)   常用于对象拷贝

Array常见方法

  • forEach  : 不返回数组,经常用于查找遍历数组元素。
  • filter    :返回新数组,返回的是筛选满足条件的数组元素。
  • map   :返回新数组,返回的是出路之后的数组元素。
  • reduce  :返回累计处理的结果,经常用于求和
    • 语法:arr.reduce(function(上一次的值,当前值){},初始值)。
    • 如果有初始值,则把初始值累加到里面 。
  • join  :数组元素拼接为字符串,返回字符串。
  • find  :查找元素,返回复测的第一个数组元素值,如果没有符合的就返回undefined。
    •  const arr = [
                  {
                      name:'小米',
                      price:100
                  },
                  {
                      name:'苹果',
                      price:1000
                  }
              ]
              // 找小米并且返回这个对象
             const a = arr.find(item =>item.name === "小米")
             console.log(a);
  • every:检测数组所有元素都符合(必须每一个都是)指定条件,如果所有元素都通过检测,返回true,否则false 。          
  • some:检测数组中的元素是否满足指定条件,如果数组中有元素满足条件返回true,否则false。(只要有一个满足
  • concat:合并两个数组,返回生成新数组。
  • sort:对原数组单元值排序。
  • splice:删除或替换原数组单元。
  • reverse:翻转数组。
  • findIndex:查找元素的索引值。
  • Array.from():把伪数组转换为真数组。

字符串常见方法

  • length:获取字符串长度。
  • split('分隔符'):用来将字符串拆分成数组。(通过分割符,来分割)
     // 把字符串转换为数组
         let a = 'red,pick,kil,kkk'
         console.log(a.split(','))
  • substring():字符串的截取。(开始,结束),左包右不包、结束可以省
       let b = 'redpickikkk'
         console.log(b.substring(0,4))  //redp
  • startsWith():检测是否以某字符串开头
        let b = 'redpickikkk'
        
         console.log(b.startsWith('a'))  //false
         console.log(b.startsWith('r'))  //true
  • includes():判断一个字符串是否包含在另一个字符串中
    let b = 'redpickikkk'
    console.log(b.includes('dpick'));  //true
    console.log(b.includes('dik'));  //false
  • toUpperCase:将字母转换成大写。
  • toLowerCase:转换成小写。
  • indexOf:检测是否包含某字符。
  • endsWith:检测是否以某字符串结尾。
  • replace:用于替换字符串。(支持正则)
  • match  :用于查找字符串(支持正则)。

原型

  • 原型是什么?:一个对象,我们也称为prototype 为原型对象
  • 作用:共享方法。可以把那些不变的方法,直接定义在prototype对象上。
  • 构造函数和原型里面的this ,指向实例化对象。 

constructor

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1276116.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【代码】考虑差异性充电模式的电动汽车充放电优化调度matlab-yalmip-cplex/gurobi

程序名称:考虑差异性充电模式的电动汽车充放电优化调度 实现平台:matlab-yalmip-cplex/gurobi 代码简介:提出了一种微电网中电动汽车的协调充电调度方法,以将负荷需求从高峰期转移到低谷期。在所提出的方法中,基于充…

(一)Tiki-taka算法(TTA)求解无人机三维路径规划研究(MATLAB)

一、无人机模型简介: 单个无人机三维路径规划问题及其建模_IT猿手的博客-CSDN博客 参考文献: [1]胡观凯,钟建华,李永正,黎万洪.基于IPSO-GA算法的无人机三维路径规划[J].现代电子技术,2023,46(07):115-120 二、Tiki-taka算法(TTA&#xf…

AutoDL 使用记录

AutoDL 使用记录 1.租用新实例 创建实例需要依次选择:计费方式 → \to → 地区 → \to → GPU型号与数量 → \to → 主机 注意事项: 主机 ID:一个吉利的机号有助于炼丹成功价格:哪个便宜选哪个最高 CUDA 版本:影响…

操作系统-输入输出管理

I/O设备的基本概念和分类 I/O就是输入/输出 I/O设备就是可以将数据输入到计算机,或者可以接收计算机输出数据的外部设备,属于计算机中的硬件部件。 I/O设备按使用特性分类 人机交互类外部设备存储设备网络通信设备 I/O设备按传输速率分类 低速设备中…

小米智能摄像头mp4多碎片手工恢复案例

小米智能摄像头mp4多碎片手工恢复案例 智能摄像头目前在市场上极为常见,仅需要一张存储卡即可实现视频、音频的采集,同时可以通过手机APP进行远程控制,相比传统安防品牌成本更低、更容易部署。在智能摄像头品牌中小米算是绝对的大厂&#xf…

HTTP协议、Java前后端交互、Servlet

文章目录 抓包工具 FiddlerHTTP 请求和响应结构URL 唯一资源定位符HTTP 协议中的方法请求报头(header)HTTP响应构造 HTTP 请求基于 form 标签基于 ajax使用 Postman HTTPS和 HTTP 的区别对称密钥和非对称密钥数字证书 TomcatServlet创建 Maven 项目引入依…

SSM框架(四):SSM整合 案例 + 异常处理器 +拦截器

文章目录 一、整合流程图1.1 Spring整合Mybatis1.2 Spring整合SpringMVC 二、表现层数据封装2.1 问题引出2.2 统一返回结果数据格式 代码设计 三、异常处理器3.1 概述3.2 异常处理方案 四、前端五、拦截器5.1 概念5.2 入门案例5.3 拦截器参数5.4 拦截器链 一、整合流程图 1.1 S…

2.qml 3D-View3D类学习

本章我们来学习View3D类。 View3D是用来渲染3D场景并显示在2D平面的类,并且该类可以放在QML2D下继承于Item子类的任何场景中,比如将View3D放在Rectangle中: Rectangle {width: 200 height: 200color: "red"View3D { anchors.fill: parent…

STM32CubeIDE(CUBE-MX hal库)----蓝牙模块HC-05(详细配置)

系列文章目录 STM32CubeIDE(CUBE-MX hal库)----初尝点亮小灯 STM32CubeIDE(CUBE-MX hal库)----按键控制 STM32CubeIDE(CUBE-MX hal库)----串口通信 STM32CubeIDE(CUBE-MX hal库)----定时器 文章目录 系列文章目录前言一、蓝牙配置二、CUBE-MX可视化配置三、蓝牙APP调试助手四、…

mysql在linux环境下安装(rpm)以及初始化后的登录配置

注:该安装步骤转载于CSDN,下方配置为原创 按照图片安装并初始化完成MySQL等操作后进行; 安装对于rpm包集合 1-查看安装情况(有4个路径) whereis mysql 2-查看服务状态 systemctl status mysql 3-初始化数据库 mysqld --initial…

6.5 Windows驱动开发:内核枚举PspCidTable句柄表

在 Windows 操作系统内核中,PspCidTable 通常是与进程(Process)管理相关的数据结构之一。它与进程的标识和管理有关,每个进程都有一个唯一的标识符,称为进程 ID(PID)。与之相关的是客户端 ID&am…

【蓝桥杯选拔赛真题71】Scratch绘制彩虹 少儿编程scratch图形化编程 蓝桥杯创意编程选拔赛真题解析

目录 scratch绘制彩虹 一、题目要求 编程实现 二、案例分析 1、角色分析

Python+Requests对图片验证码的处理

Requests对图片验证码的处理 在web端的登录接口经常会有图片验证码的输入,而且每次登录时图片验证码都是随机的;当通过request做接口登录的时候要对图片验证码进行识别出图片中的字段,然后再登录接口中使用; 通过request对图片验…

ChatGPT成为“帮凶”:生成虚假数据集支持未知科学假设

ChatGPT 自发布以来,就成为了大家的好帮手,学生党和打工人更是每天都离不开。 然而这次好帮手 ChatGPT 却帮过头了,莫名奇妙的成为了“帮凶”,一位研究人员利用 ChatGPT 创建了虚假的数据集,用来支持未知的科学假设。…

Windows环境 dockertopdesk 部署gitlab

1.在dockertopdesk里搜索 gitlab镜像 (pull)拉取镜像 2.运行镜像到容器 mkdir gitlab gitlab/etc gitlab/log gitlab/opt docker run -id -p 3000:80 -p 9922:22 -v /root/gitlab/etc:/etc/gitlab -v /root/gitlab/log:/var/log/gitlab -v /root/gitlab/opt:/var/opt/gitla…

Linux系统之centos7编译安装Python 3.8

前言 CentOS (Community Enterprise Operating System) 是一种基于 Red Hat Enterprise Linux (RHEL) 进行源代码再编译并免费提供给用户的 Linux 操作系统。 CentOS 7 采用了最新的技术和软件包,并提供了强大的功能和稳定性。它适用于各种服务器和工作站应用场景&a…

8.整数转换为浮点数【2023.11.30】

1.问题描述 整数转换为浮点数。 2.解决思路 使用input函数读取输入的整数 input_int int(input()) #将整数转换为浮点数类型 output_float float(input_int) 3.代码实现 numint(input("请输入一个整数")) num1float(num) print(num1)4.运行结果

掌握HarmonyOS框架的ArkTs如何管理和共享状态数据

ARKTS(Ark TypeScript)是HarmonyOS应用框架的一部分,提供了一种灵活而强大的状态管理机制。在ARKTS中,AppStorage和LocalStorage是两个关键的概念,它们分别用于应用级和页面级的状态共享。通过深入了解这两个特性&…

【Python】OpenCV库中常用函数详解和示例

在Python中,OpenCV(Open Source Computer Vision Library)是一个广泛使用的图像和视频处理库。它包含许多用于图像处理和计算机视觉任务的函数。本文对一些常用的OpenCV函数及其详细解释和示例,以帮助大家理解和使用。 目录 cv2.…

跨模态图像翻译:使用具有感知监督的多生成网络合成MR脑图像的CT图像

Cross-modality image translation: CT image synthesis of MR brain images using multi generative network with perceptual supervision 跨模态图像翻译:使用具有感知监督的多生成网络合成MR脑图像的CT图像背景贡献实验方法损失函数Thinking 跨模态图像翻译&…