Web前端 Javascript笔记3

1、垃圾回收机制

 内存中的生命周期

        1、内存分配

        2、内存使用(读写)

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

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

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

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

一、引用计数法   

      1、记录引用次数

      2、计数 ++  或者 --

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

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

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

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

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

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

看看这个

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

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

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

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

二、标记清除

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

循环引用不再是问题了

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


2、闭包

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

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

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

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

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

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

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

   let num = 0function test1() {num++console.log(`这是函数调用的第${num}次`)}test1()test1()num = 300test1()

闭包函数 

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

   <script>function outer() {let num = 0function inner() {num++console.log(`这是函数调用的第${num}次`)}return inner}let a = outer()a()a()a()num = 21a()</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>

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【DNS】

文章目录 DNS域名解析系统&#xff08;Domain Name System&#xff09;DNS系统需要解决的问题DNS域名解析系统&#xff08;Domain Name System&#xff09;问题1&#xff1a;DNS名字空间(The DNS Name Space&#xff09;DNS名字空间(The DNS Name Space)DNS名字空间(The DNS Na…

云手机提供私域流量变现方案

当今数字营销领域&#xff0c;私域流量是一座巨大的金矿&#xff0c;然而并非人人能够轻易挖掘。一家营销公司面临着利用社交、社区、自媒体等应用积累私域流量&#xff0c;并通过销售产品、推送广告等方式实现流量变现的挑战与困境。本文将详细介绍这家公司是如何通过云手机&a…

【MATLAB】基于Wi-Fi指纹匹配的室内定位-仿真获取WiFi RSSI数据(附代码)

基于Wi-Fi指纹匹配的室内定位-仿真获取WiFi RSSI数据 WiFi指纹匹配是室内定位最为基础和常见的研究&#xff0c;但是WiFi指纹的采集可以称得上是labor-intensive和time-consuming。现在&#xff0c;给大家分享一下我们课题组之前在做WiFi指纹定位时的基于射线跟踪技术仿真WiFi…

Spring高手之路17——动态代理的艺术与实践

文章目录 1. 背景2. JDK动态代理2.1 定义和演示2.2 不同方法分别代理2.3 熔断限流和日志监控 3. CGLIB动态代理3.1 定义和演示3.2 不同方法分别代理&#xff08;对比JDK动态代理写法&#xff09;3.3 熔断限流和日志监控&#xff08;对比JDK动态代理写法&#xff09; 4. 动态代理…

Spring源码刨析之配置文件的解析和bean的创建以及生命周期

public void test1(){XmlBeanFactory xmlBeanFactory new XmlBeanFactory(new ClassPathResource("applicationContext.xml"));user u xmlBeanFactory.getBean("user",org.xhpcd.user.class);// System.out.println(u.getStu());}先介绍一个类XmlBeanFac…

196算法之谜在 JSP 中使用内置对象 request 获取 form 表单的文本框 text 提交的数据。

(1&#xff09;编写 inputNumber . jsp &#xff0c;该页面提供一个 form 表单&#xff0c;该 form 表单提供一个文本框 text &#xff0c;用于用户输入一个正整数&#xff0c;用户在 form 表单中输入的数字&#xff0c;单击 submit 提交键将正整数提交给 huiwenNumber . jsp 页…

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​]&…

产生死锁的四个必要条件

产生死锁的四个必要条件 互斥使用: 一个资源每次只能被一个线程使用。这意味着如果一个线程已经获取了某个资源&#xff08;比如锁&#xff09;&#xff0c;那么其他线程就必须等待&#xff0c;直到该线程释放资源。 不可抢占: 已经获得资源的线程在释放资源之前&#xff0c;不…

Google Imagen 2对比OpenAI的Dall-E 3 - 同一提示,不同结果

每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗&#xff1f;订阅我们的简报&#xff0c;深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同&#xff0c;从行业内部的深度分析和实用指南中受益。不要错过这个机会&#xff0c;成为AI领…

咸鱼之王_手游_开服搭建架设_内购修复无bug运营版

视频演示 咸鱼之王_手游_开服 游戏管理后台界面 源码获取在文章末尾 源码获取在文章末尾 源码获取在文章末尾 或者直接下面 https://githubs.xyz/y28.html 1.安装宝塔 yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh &…

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

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

centos 7.9 nginx本地化安装,把镜像改成阿里云

1.把centos7.9系统切换到阿里云的镜像源 1.1.先备份 mv /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/CentOS-Base.repo.backup1.2.下载新的CentOS-Base.repo配置文件 wget -O /etc/yum.repos.d/CentOS-Base.repo http://mirrors.aliyun.com/repo/Centos-7.repo特别…

本地web项目启起来后,无法在浏览器(chrome)看到源码,从而无法打断点;Framework Ignore list

问题描述 本地web项目启起来后&#xff0c;无法在浏览器(chrome)看到源码&#xff0c;从而无法打断点 其他浏览器没看&#xff0c;开发环境一致专注于chrome&#xff08;其余浏览器有测试同事提缺陷了&#xff0c;才会去看&#xff09;&#xff0c;其余浏览器有没有这个问题&…

linux 内存寻址

&#xff08;持续更新&#xff09; 相关概念 查看的书籍为 深入linux内核 内存地址 当使用80x86&#xff08;32位&#xff09;微处理器时&#xff0c;一般分为三种不同的地址&#xff1a; 逻辑地址 包含在机器语言指令中用来指定一个操作数或一条指令的地址。每一个逻辑地址…

C#简单工厂模式的实现

using System.Diagnostics.Metrics; using System.Runtime.InteropServices; using static 手写工厂模式.Program;namespace 手写工厂模式 {internal class Program{public interface eats {void eat();}//定义了一个接口public class rice : eats{public void eat() {Console.…

neo4j-01

Neo4j是&#xff1a; 开源的&#xff08;社区版开源免费&#xff09;无模式&#xff08;不用预设数据的格式&#xff0c;数据更加灵活&#xff09;noSQL&#xff08;非关系型数据库&#xff0c;数据更易拓展&#xff09;图数据库&#xff08;使用图这种数据结构作为数据存储方…

Flutter第七弹 网格列表GridView

1) Flutter提供了网格列表&#xff0c;怎么设置列数&#xff1f; 2&#xff09;怎么初始化每个列表项Item&#xff1f; 一、GridView简介 Flutter也存在网格列表组建GridView&#xff0c;用于展示多行多列的列表。 1.1 GridView构建 采用GridView.count() 进行构建 1.2 Gr…

HarmonyOS实战开发-自定义分享

介绍 自定义分享主要是发送方将文本&#xff0c;链接&#xff0c;图片三种类型分享给三方应用,同时能够在三方应用中展示。本示例使用数据请求 实现网络资源的获取&#xff0c;使用屏幕截屏 实现屏幕的截取&#xff0c;使用文件管理 实现对文件&#xff0c;文件目录的管理&…

5.9 mybatis之callSettersOnNulls作用

文章目录 1. 当callSettersOnNullstrue时2. 当callSettersOnNullsfalse时 在mybatis的settings配置参数中有个callSettersOnNulls参数&#xff0c;官方解释为&#xff1a;指定当结果集中值为 null 的时候是否调用映射对象的 setter&#xff08;map 对象时为 put&#xff09;方法…

Collection与数据结构 二叉树(三):二叉树精选OJ例题(下)

1.二叉树的分层遍历 OJ链接 上面这道题是分层式的层序遍历,每一层有哪些结点都很明确,我们先想一想普通的层序遍历怎么做 /*** 层序遍历* param root*/public void levelOrder1(Node root){Queue<Node> queue new LinkedList<>();queue.offer(root);while (!qu…