Web前端 Javascript笔记3

1、垃圾回收机制

 内存中的生命周期

        1、内存分配

        2、内存使用(读写)

        3、内存回收,使用完毕之后,垃圾回收器完成

        内存泄漏:该回收的,由于某些未知因素,未释放,叫做内存泄漏

栈:数据存在其中会自动释放

堆:对象,根据程序员的操作来决定释放

一、引用计数法   

      1、记录引用次数

      2、计数 ++  或者 --

      3、引用次数为0时,释放内存

原理:跟踪记录每个值被引用的次数。

当垃圾收集器下一次运行时,它就会释放引用次数是0的值所占的内存。

如果一个对象已经没有指向他的引用了,那么就认为不在需要,

循环引用的内存,无法被释放 

let obj1={
            uname:"lisi"
        }
        let a=obj1//存的是内存地址,引用计数为2
        a=null//--,引用计数为1
        //缺点:占内存消耗; 循环引用问题,内存无法被释放

看看这个

两个对象被创建,并互相引用,形成了一个循环。

无法计数无法为0,他们的计数均为1,无法释放,

计数算法考虑到它们互相都有至少一次引用,所以它们不会被回收。

let obj2={
        a:obj3
        }
let obj3={
        b:obj2
        }
obj2 = null

二、标记清除

    垃圾回收器将定期从根开始,找所有从根开始引用的对象,然后找这些对象引用的对象……从根开始,垃圾回收器将找到所有可以获得的对象和收集所有不能获得的对象。

循环引用不再是问题了

在上面的示例中,函数调用返回之后,两个对象从全局对象出发无法获取。因此,他们将会被垃圾回收器回收。


2、闭包

在 JavaScript 中,闭包会随着函数的创建而被同时创建。

内层函数+外层函数的变量 与函数,内层函数使用了外层函数的变量

   function outer() {
            let i = 10
            function inner() {
                console.log(i)
            }
            return inner//外部函数调用内部函数实现功能

        }
        let a = outer()
        a()
        a()    //输出两次10

 外部可以访问函数内部的变量

闭包会在父函数外部,改变父函数内部变量的值。

下面这个函数,他不是改变了全局变量,而是函数可以访问全局变量并且利用表达式与打印,进行函数内部的输出表达,当出了这块函数,全局变量num还是0.

JavasSript 语言的特别之处就在于:函数内部可以直接读取全局变量,但是在函数外部无法读取函数内部的局部变量。

   let num = 0
        function test1() {

            num++
            console.log(`这是函数调用的第${num}次`)
        }

        test1()
        test1()
        num = 300
        test1()

闭包函数 

一个函数的返回值是一个内部函数,并且这个内部函数调用了父级函数的变量。

   <script>
        function outer() {
            let num = 0
            function inner() {
                num++
                console.log(`这是函数调用的第${num}次`)

            }
            return inner
        }

        let a = outer()
        a()
        a()
        a()
        num = 21
        a()
  </script>


3、Math对象

是一个内置对象,它拥有一些数学常数属性和数学函数方法。

来看看常用的数学成员,更多的成员可以上网查。

成员作用
E欧拉常数,也是自然对数的底数,约等于 2.718
PI获取圆周率,结果为3.141592653589793。
abs(x)返回一个数的绝对值。
sqrt(x)获取x的平方根
cbrt(x)返回一个数的立方根。
max(x)返回零到多个数值中最大值。
min(x)返回零到多个数值中最小值。
pow(x,y)返回一个数的 y 次幂。
ceil(x)向上取整。
floor(x)向下取整。
round(x)

返回四舍五入后的整数。

random返回一个 0 到 1 之间的伪随机数。随机数[0,1)
log(x)返回一个数的自然对数(㏒e,即 ㏑)。
log2(x)/log(x)返回一个数以 2或者10 为底数的对数。
sign(x)返回一个数的符号,得知一个数是正数、负数还是 0

获取n~m的随机数

console.log(Math.floor(Math.random()*((n-m)+1))+m)


4、Date对象

创建Date对象,将返回一个字符串,以下是四种创建方法

let d1 = new Date();     //获取当前时间
let d2= new Date(milliseconds); // 参数为毫秒
let d3 = new Date(dateString);
let d4 = new Date(year, month, day, hours, minutes, seconds, milliseconds);

  • milliseconds 参数是一个 Unix 时间戳,它是一个整数值,表示自 1970 年 1 月 1 日 00:00:00 UTC(the Unix epoch)以来的毫秒数。

  • dateString 参数表示日期的字符串值。

  • year, month, day, hours, minutes, seconds, milliseconds 分别表示年、月、日、时、分、秒、毫秒。

 <script>
    let today=new Date()
    console.log('today='+today)
    let d1 = new Date("October 13, 1975 11:13:00")
    console.log('d1='+d1)
    let d2=new Date("2022-2-17 23:03:46")
    console.log('d2='+d2)
    let d3=new Date(100000000000)
    console.log('d3='+d3)
    let d4=new Date(2018,8,19,6,26,21)
    console.log('d4='+d4)
    </script>

方法描述
getDate()从 Date 对象返回一个月中的某一天 (1 ~ 31)。
getDay()从 Date 对象返回一周中的某一天 (0 ~ 6)。
getFullYear()从 Date 对象以四位数字返回年份。
getHours()返回 Date 对象的小时 (0 ~ 23)。
getMinutes()返回 Date 对象的分钟 (0 ~ 59)。
getMouth()从 Date 对象返回月份 (0 ~ 11)。
getSeconds()返回 Date 对象的秒数 (0 ~ 59)。

getMilliseconds()

返回 Date 对象的毫秒数 (0 ~ 59)。
getTime()返回 1970 年 1 月 1 日至今的毫秒数(0~999。
parse()返回1970年1月1日午夜到指定日期(字符串)的毫秒数。
setDate()设置 Date 对象中月的某一天 (1 ~ 31)。
setFullYear()设置 Date 对象中的年份(四位数字)。
setHours()设置 Date 对象中的小时 (0 ~ 23)。
setMinutes()设置 Date 对象中的分钟 (0 ~ 59)。
setMouth()设置 Date 对象中月份 (0 ~ 11)。
setSeconds()设置 Date 对象中的秒钟 (0 ~ 59)。
setTime()setTime() 方法以毫秒设置 Date 对象。
setYear()已废弃。请使用 setFullYear() 方法代替。
toDateString()把 Date 对象的日期部分转换为字符串。
toString()把 Date 对象转换为字符串。
toTimeString()把 Date 对象的时间部分转换为字符串。
UTC()根据世界时返回 1970 年 1 月 1 日 到指定日期的毫秒数。

举个例子 

    <script>
    let date=new Date()
    console.log(date+'')

    let y=date.getFullYear()
    console.log(y+'年')

    let m=date.getMonth()
    console.log(m+'月')

    let day = date.getDate()
    console.log(day+'号')

    // 时分秒
    let hh = date.getHours()
    let mm = date.getMinutes()
    let ss = date.getSeconds()
    console.log(hh+'时')
    console.log(mm+'分')
    console.log(ss+'秒')

    let w = date.getDay()
    console.log('星期'+w)
    console.log(date.toString()+' toString()')
    console.log(date.toTimeString()+' toTimeString()')
    console.log(date.toDateString()+' toDateString()')
    </script>


  

5、展开运算符

关于数组内全部元素的输出,除了遍历,还有没有不遍历的方法??

假如有一个数组,你要如何将其中的元素不遍历也可以输出?

let a=[3,2,11]

我想大家一般直接这样:

 let c=a[0]

 let c1=a[1]

 let c2=a[2]

那么问题来了,要是,数组里的元素有上万个呢,虽然有点夸张,但是,它不能被忽视对吧

哈哈,不装了,介绍一下一个运算符,它是三个英文的句号

展开运算符...

不仅是数组,还有字符串也可用

 <script>
        let a=[3,2,11]
        //...展开运算符,可以把数组与对象展开
        document.write(...a+'<br>')//将列表拆开
        document.write(Math.max(...a))//不可以接数组与对象,可以是一串数字
    </script>


6、获取元素对象

在 HTML DOM 中, 元素对象代表着一个 HTML 元素。

方法

document.getElementById()

document.getElementsByClassName()

返回文档中所有指定类名的元素集合

document.getElementsByName()

document.getElementsByTagName()

返回指定标签名的所有子元素集合。

 Document.querySelector("选择器")

拿到满足第一个。

querySelectorAll(" ")

拿到伪数组。

<body>
    <p>段落111</p>
    <p>段落222</p>
    <p>段落333</p>
    <p>段落444</p>
    <div>你是一个盒子111</div>
    <div>你是一个盒子222</div>
    <div>你是一个盒子333</div>
    <ul>
        <li>11111111小li</li>
        <li name="k2">2222222小li</li>
        <li class="f3">333333小li</li>
        <li id="d4">4444444小li</li>
    </ul>
    <script>
    let k2=document.getElementsByName("k2")
    console.log(k2)
    let f3=document.getElementsByClassName("f3")
    console.log(f3)
    let d4=document.getElementById("d4")
    console.log(d4)
    let d=document.getElementsByTagName("div")

    let p1=document.querySelector("p")
    console.log(p1)
    let p2=document.querySelectorAll("p")
    console.log(p2)
    for (let i in p2) {
            console.log(p2[i])
        }
    </script>
</body>

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

PostgreSQL入门到实战-第二十九弹

PostgreSQL入门到实战 PostgreSQL中数据分组操作(四)官网地址PostgreSQL概述PostgreSQL中CUBE命令理论PostgreSQL中CUBE命令实战更新计划 PostgreSQL中数据分组操作(四) 如何使用PostgreSQL CUBE生成多个分组集 官网地址 声明: 由于操作系统, 版本更新等原因, 文章所列内容不…

Linux配置程序后台运行(前后台来回切换)

Linux配置程序后台运行 在日常开发过程中&#xff0c;会遇到我们在前台运行程序&#xff0c;此时我们临时有事&#xff0c;但不能关闭终端&#xff0c;否则程序就会在电脑熄屏&#xff08;终端session断开后&#xff09;停止运行。 那么作为一个合格的开发&#xff0c;就必须要…

Matlab 2024安装教程(附免费安装包资源)

鼠标右击软件压缩包&#xff0c;选择“解压到MatlabR2024a“。 2.打开解压后的文件夹&#xff0c;鼠标右击“MATHWORKS_R2024A“选择装载。 鼠标右击“setup“选择”以管理员身份运行“。点击“是“&#xff0c;然后点击”下一步“。复制一下密钥粘贴至输入栏&#xff0c;然后…

数据结构——双向链表的实现

文章目录 一、双向链表的结构二、实现双向链表创建双向链表的项目双向链表的结构List.h申请结点初始化打印尾插头插尾删头删查找在pos位置之后插入数据删除pos结点销毁 三、所有源代码List.hList.ctest.c 一、双向链表的结构 带头双向循环链表 注意&#xff1a;这⾥的“带头…

数据交换格式

一、什么是数据交换格式 在计算机的不同程序之间&#xff0c;或者不同的编程语言之间进行交换数据&#xff0c;也需要一种大家都能听得懂得‘语言’&#xff0c;这就是数据交换格式&#xff0c;它通过文本以特定的形式来进行描述数据。 二、常用的几种数据交换格式 客户端常…

图像处理ASIC设计方法 笔记17 连通域的图像标记算法

目录 (一)主要环节图像初步标记 -等价表初始化与等价关系记录 -整理等价表 -图像标记代换 -(二)详细算法步骤:1 等价表的操作:2 整理等价表:3 图像标记代换:连通域的图像标记算法有若干步骤,除了图像初步标记,还有等价表初始化、等价关系记录、整理等价表、图像标记代…

【C++】深度解析---赋值运算符重载(小白一看就懂!!)

目录 一、前言 二、 运算符重载 &#x1f34e;运算符重载 ① 概念引入 ② 语法明细 ③ 练习巩固 ④ 代码展示 &#x1f347;赋值运算符重载 ① 语法说明及注意事项 ② 默认的赋值运算符重载 ③ 值运算符不能重载成全局函数&#xff01; 三、总结 四、共勉 一、前言…

前端console用法分享

console对于前端人员来讲肯定都不陌生&#xff0c;相信大部分开发者都会使用console来进行调试&#xff0c;但它能做的绝不仅限于调试。 最常见的控制台方法 作为开发者&#xff0c;最常用的 console 方法如下&#xff1a; 控制台打印结果&#xff1a; 今天我分享的是一些 co…

Qt快速入门(MV架构之TableView + QStandardItemModel + 自定义代理小案例)

Qt快速入门&#xff08;MV架构之TableView QStandardItemModel 自定义代理小案例&#xff09; 关于MV架构的简单介绍 在Qt框架中&#xff0c;代理&#xff08;Delegate&#xff09;、模型&#xff08;Model&#xff09;和视图&#xff08;View&#xff09;之间的关系构成了…

jvisualVM分析jvm内存使用快照dump

服务发生内存溢出&#xff0c;就需要查看服务器上Java服务的jvm堆内存使用情况&#xff0c;可以使用dump命令生成dump文件&#xff0c;然后下载到本地&#xff0c;然后使用jvisualVM工具打开&#xff0c;即可实现可视化分析。 生成dump文件常用的两种方式&#xff1a; 第一种…

linux fixmap分析

本文基于Linux-4.19.125&#xff0c; ARM V7&#xff0c;dual core, MMU采用2级页表&#xff08;未开启LPAE&#xff09;。 1 为什么需要fixmap Linux内核启动过程中&#xff0c;经过汇编阶段后&#xff0c;mmu功能已经开启&#xff0c;后续只能通过虚拟地址来访问DDR&#x…

RAG应用开发实战02-相似性检索的关键 - Embedding

1 文本Embedding 将整个文本转化为实数向量的技术。 Embedding优点是可将离散的词语或句子转化为连续的向量&#xff0c;就可用数学方法来处理词语或句子&#xff0c;捕捉到文本的语义信息&#xff0c;文本和文本的关系信息。 ◉ 优质的Embedding通常会让语义相似的文本在空…

Linux 添加启动服务--Service

1&#xff0c;服务配置service文件 Service 服务的实际作用是开启后自动启动服务&#xff0c;运行一些不须要登录的程序&#xff0c;任务。 实例1、上电自动连接WIFI热点 1.1 新建.service文件 /etc/systemd/system/wificonnect.service [Unit] DescriptionService [wifico…

记录linux从0部署java项目(宝塔)

目录 一、安装宝塔可视化界面 二、部署前端 三、部署后端 1、配置并连接Mysql数据库 2、配置并连接redis 3、安装jdk 这里先记录一个安装后遇到的问题 安装openJDK 四、检查 一、安装宝塔可视化界面 宝塔面板下载&#xff0c;免费全能的服务器运维软件 运行安装脚本 安…

MySQL 社区版 安装总结

很早就安装过MySQL&#xff0c;没有遇到过什么问题&#xff0c;直接next就行了&#xff0c;这次在新电脑上安装却遇到了一些问题&#xff0c;记录一下。 安装的是MySQL社区版&#xff0c;下载地址是www.mysql.com&#xff0c;进入后选择DOWNLOAD页面&#xff0c;选择MySQL Com…

基本的数据类型在16位、32位和64位机上所占的字节大小

1、目前常用的机器都是32位和64位的&#xff0c;但是有时候会考虑16位机。总结一下在三种位数下常用的数据类型所占的字节大小。 数据类型16位(byte)32位(byte)64位(byte)取值范围char111-128 ~ 127unsigned char1110 ~ 255short int / short222-32768~32767unsigned short222…

HarmonyOS实战开发-自定义通知角标、如何设定应用的桌面图标角标的功能。

介绍 本示例主要展示了设定应用的桌面图标角标的功能&#xff0c;使用ohos.notificationManager 接口&#xff0c;进行桌面角标的设置&#xff0c;通知的发送&#xff0c;获取等。 效果预览 使用说明 在使用本应用时&#xff0c;需安装并启动仿桌面应用&#xff1b;在主界面…

LeetCode 57—— 插入区间

阅读目录 1. 题目2. 解题思路3. 代码实现 1. 题目 2. 解题思路 第一步&#xff0c;我们先寻找新区间和原始区间列表的重叠部分。 假设新区间为 [ x 1 , x 2 ] [x_1, x_2] [x1​,x2​]&#xff0c;原始区间列表中的其中一个区间为 [ y 1 , y 2 ] [y_1, y_2] [y1​,y2​]&…

PostgreSQL入门到实战-第三十弹

PostgreSQL入门到实战 PostgreSQL教程网站官网地址PostgreSQL概述更新计划 PostgreSQL教程网站 https://www.postgresqltutorial.com/ 官网地址 声明: 由于操作系统, 版本更新等原因, 文章所列内容不一定100%复现, 还要以官方信息为准 https://www.postgresql.org/PostgreS…

【数据工具】ArcGIS批量出图工具箱

工具下载链接&#xff1a;数据下载链接 我们在使用Arcgis制图的过程中&#xff0c;经常会遇到需要大量出图的情况&#xff0c;如何将做好的图批量导出jpg是一件令人头疼的问题。 今天小编就给大家分享俩个ArcGIS批量出图的工具箱&#xff0c;一个可以批量导出图层为jpg&#…