- 博客(76)
- 收藏
- 关注
RSS订阅原创 js中parseInt与isNaN知识点整理
parseInt(string, radix) 解析一个字符串并返回指定基数的十进制整数，radix 是 2-36 之间的整数，表示被解析字符串的基数。3、parseInt(3, 2) // 进制2,但是3不在0-1范围内(3应该改为11),所以不符合2进制要求返回NaN。5、parseInt(5, 4) //进制4,5不在0-3范围内,所以返回NaN。4、parseInt(2, 3) //进制3,2在0-2范围内,所以返回2。2、parseInt(2, 1) //进制输入1<2,所以结果为NaN。
2024-07-29 16:47:20
162
原创 js遍历数组对空位的处理
这里的array就是初始化的长度为4的数组,但是我们还未给数组的属性赋值,所以它时包含4个空值的数组。实际情况中,有一种情况是定义了数组,但是还未给数组赋值的情况,这种情况就会形成数组位上的空值。在上面的代码运行中,可以看到上述几个数组处理方法会跳过对空值的处理,需要注意的是,由于上述的遍历方法都会跳过空值处理,所以,如果我们要想处理空值,只能使用for循环。如果处理数组的空位呢,比如赋值或者删除。先来了解一下,在数组的遍历过中,
2024-07-29 10:40:10
26
原创 js中二进制与十进制的相互转换
当然,我上面的方法都可以正常实现结果,但是过程可以更加容易。1、parseInt 可以将二进制数据转换成10进制。2、toString可以将10进制数据转换成2进制。太easy了,记住吧!
2024-07-25 15:45:12
135
原创 js中function形参与实参数的获取length与arguments
相比之下，arguments.length 是局限于函数内部的，它提供了实际传递给函数的参数个数。然后我们再看“只包括在第一个具有默认值的参数之前的参数”这句话的理解,说白了就是给函数的参数初始化值。从上述代码可以看出,我们可以通过使用arguments来获取函数调用时实际传入的参数也就是实参.在写代码的实际应用中,我们有时候需要获取函数的行参或者实参,下面就此问题做一下总结.args){},这里的…实际应用中获取实参可以在函数内部使用arguments。下面我们来看一个函数的结构。那么如果获取行参呢?
2024-07-25 10:02:03
353
原创 Reflect使用的一些总结
这种理念很大程度上是受到函数式编程的影响,ES6进一步贯彻了这种理念，它认为，对属性内存的控制、原型链的修改、函数的调用等等，这些都属于底层实现，属于一种魔法，因此，需要将它们提取出来，形成一个正常的API，并高度聚合到某个对象中，于是，就造就了Reflect对象。Reflect 的所有属性和方法都是静态的。所以,Reflect在配合proxy一起使用时,我们在自定义的get、set这样的处理方法中,更为标准的做法是，先去实现自己所需要的监视逻辑，最后再去返回通过Reflect中对应的方法的一个调用结果。
2024-07-18 10:41:25
539
原创 使用proxy来实现数据监听
还记得上一篇中展示过Object.defineProperty对数组进行set操作并不生效,实现不了监听,要想实现数据的监听我们是通过重写数组的操作方法,那么,我们现在来看看用proxy能否实现对数组的监听呢?,这也是proxy相比于Object.defineProperty的一个优势,(defineProperty的方式必须给对象本身的每一个属性添加监听,改变了对象本身)defineProperty(): Object.defineProperty 方法的捕捉器。set(): 属性设置操作的捕捉器。
2024-07-18 09:04:01
350
原创 vue2.0中如何实现数据监听
这样,我们就清楚了vue2.0对象监听的原理了,可以看出,我们需要对对象数据的每一个属性都添加存取器属性,遇到数组类型还要重新给数据方法做重写操作,那么,我们可以想象,如果这个对象在十分复杂的情况下,是不是实现起来非常复杂,而且对性能的消耗也是非常的巨大。我们看到虽然数组也是对象类型,但是,当我们给数组新增数据的时候,并没有进入到setter方法中,所以我们需要针对数组类型特殊处理,这里我们需要给对象的数组处理方法重新定义一下。说明我们同时监听到了对象属性是对象的情况下的值。
2024-07-17 14:21:52
980
原创 URLSearchParams针对url中参数的处理方法
可以看到打印出的对象,原型是URLSearchParams,并且可以继承get、getAll、has、set、append、delete、entries等方法.以往,我们处理url中参数的办法是分割字符串然后循环遍历等,为了解决这个问题,es6特出了URLSearchParams来帮我们简化操作,下面来了解。通过new URLSearchParams(search),我们可以创建出一个新的对象,那这个对象包含哪些内容呢呢?以上就是对URLSearchParams的一些总结,很有用的方法哦,记住吧!
2024-07-12 14:39:26
207
原创 对象与键值对数组的相互转换Object.entries与Object.fromEntries
从上面的代码中我们看到Object.fromEntries,它是Object.entries的逆向操作,可以把键值对列表转换为一个对象。Object.entries是JavaScript中的一个内置方法，它可以将一个对象的属性和值转换为一个包含键值对的数组。2、对象属性的遍历和操作,下面是一个过滤分数不及格的例子。2、url的search参数转换。1、Map 转 Object。1、动态更新对象属性。
2024-07-12 11:15:21
285
原创 生成指定范围内的随机数
生成随机数Math.random() // 0.900457498789438利用random函数可以返回 0 ~ 1 之间的随机数，包含 0 不包含 1。然后再来了解一下获取整数的方法let num = Math.random()let a = parseInt(num, 10)let b = Math.ceil(num)let c = Math.floor(num)num // 0.18738231591245902a // 0b // 1c // 0parseInt: 向
2024-07-11 15:29:31
238
原创 如何判断一个js对象为数组类型
能想到的最常见的intanceof是吗?开始是这么认为,但是不是哈,看下面的解释,也没有太明白,暂且记住吧。综上,判断js对象为数组的两种方式。如何判断一个js对象为数组类型?
2024-07-10 09:21:20
152
原创 symbol数据类型以及应用场景
如果我们想创建一个可供全局使用的symbol,那么我们需要用Symbol.for(),可以传递一个参数作为描述,该方法可以遍历全局注册表中的的Symbol，当搜索到相同描述，那么会调用这个Symbol，如果没有搜索到，就会创建一个新的Symbol。2、使用Symbol.for(‘a’)在全局注册表中寻找描述为a的Symbol，并没有找到，所以在全局注册表中又创建了一个描述为a的新的Symbol。即使是传入相同的参数，生成的 symbol 值也是不相等的，因为 Symbol 本来就是独一无二的意思。
2024-07-09 16:24:03
287
原创 全局变量与局部变量同名优先级
如果全局变量与局部变量同名，则局部变量将优先。这是因为局部变量在函数执行时会被推到作用域的最前端，从而在作用域链中具有更高的优先级。综上,我们可以通过window对象（在浏览器中）来访问全局变量。由上面代码看到如果全局变量与局部变量同名，则局部变量将优先.那么如果要在函数内部怎么拿到全局的val呢?
2024-07-09 14:42:11
251
原创 try/catch/finally语句的使用
注意到函数内有一个return,但是因为try中抛出了一个错误,但是当错误发生时， JavaScript 会停止执行，所以这个return不起作用了.这里我们通过标签化语句,通过break来跳出当前代码块,所以try中return就不会再执行了,紧接着就会执行到外层代码了。这里,我们回忆一下上一篇博文的标签化语句,如果我们想执行外层的代码那要怎么处理呢。我们通过执行可知,在try中执行了return后最外层的代码就不执行了。允许我们定义当 try 代码块发生错误时，所执行的代码块。下面我们再来改造一下。
2024-06-27 11:26:47
226
原创 js中标签化语句的一些总结
今天在控制台打印对象遇到一个奇怪的事情,问题的起源是一个{a:1}的对象,我直接控制台输入{a:1}结果还是{a:1},但是如果我在前面加一个debugger后{a:1}的结果就变成了1.下面我们有一个需求,需要在i为3,j为2的时候退出最外层的循环,我们这里想到了break,但是break仅能退出里层循环,所以我们需要在这里利用return来实现。没有问题,我们实现了需求,但是这里虽然我们实现了,但是套了一个函数,显得代码不够精简,所以我们利用开始提到的标签化语句来实现需求。
2024-06-27 10:47:52
192
原创 数字字面量形式的方法调用会报错?
为啥报错呢,其实这里有个误区,之所以会报错，是因为在这里的 . 发生了歧义。它既可以理解为小数点，也可以理解为对方法的调用，问题就出在这里了。我们想要后一种理解，而实际上，因为这个点紧跟于一个数字之后，按照规范，解释器就把它判断为一个小数点。今天遇到一个奇怪的问题2.toString()运行后有什么结果?本来想着应该会是‘2’,可惜不是,报错了。如何解决这个问题呢?
2024-06-21 16:16:45
212
原创 canvas和svg的一些总结
在 canvas 中，一旦图形被绘制完成，它就不会继续得到浏览器的关注。如果其位置发生变化，那么整个场景也需要重新绘制，包括任何或许已被图形覆盖的对象。SVG 基于 XML，这意味着 SVG DOM 中的每个元素都是可用的。在 SVG 中，每个被绘制的图形均被视为对象。如果 SVG 对象的属性发生变化，那么浏览器能够自动重现图形。Canvas 和 SVG都可在浏览器中创建图形,但是它们的创建形式有些区别。SVG 是一种使用 XML 描述 2D 图形的语言。canvas和svg的区别。
2024-05-22 15:54:01
322
原创 关于盒子模型的样式问题
HTML文档中的每个盒子都可以看成是由从内到外的四个部分构成，即内容区（content）、填充(padding)、边框(border)和空白边(margin)。2、border-box:此值让元素维持IE传统的Box Model（IE6以下版本），也就是说元素的宽度/高度等于元素内容的宽度/高度。总高度(外盒尺寸高)= margin + border + padding + height。总宽度(外盒尺寸宽)= margin + border + padding + width。
2024-05-22 15:20:02
305
原创 字符串和数组的length
当你将 array.length 设置为小于当前数组长度的值时，数组将被截断，其中的元素将被删除。如果你将其设置为大于当前数组长度的值，数组将被扩展，新增的元素将被填充为 undefined。在JavaScript中， 属性用于获取数组的长度。但是，如果你尝试通过修改 array.length 的值来“改变数组”，你可能会遇到一些意外的行为。利用str.length 并不会改变字符串本身，它是一个。，返回字符串的长度。如果你尝试去修改它，请使用字符串截取。
2024-05-21 17:05:11
80
原创 js中Number与Math方法
例如，parseInt() 无法识别小数点，parseFloat() 无法识别 0x 前缀。Number.parseFloat() 和 Number.parseInt() 与 Number()和全局函数 parseInt() 相同。Math.ceil() 静态方法总是向上舍入，并返回大于等于给定数字的最小整数。Math.floor() 函数总是返回小于等于一个给定数字的最大整数。和全局函数 parseFloat() 相同。Math.round() 函数返回一个数字四舍五入后最接近的整数。
2024-05-17 11:20:35
286
原创 如何中断循环
试想有一个数组,我们循环的过程当符合某个条件的时候中断当前的循环,我们要如何实现呢。看到了,forEach中使用break不能终止循环,会报错,那么试试return吧。写循环的时候我们有时候也会用到数组循环的遍历方法,我们找一个forEach来举例。,其实这里有个误区,想一想js中return要用在哪里呢?能实现循环的方法有很多种,我们找几个有代表性的来试试。不报错,但是也终止不了循环哈,那要如何做呢,来看下面。想到了return和break,那么来试试吧。那我们来给上面套一个函数在试试。
2024-05-16 17:17:49
193
原创 html5的一些新特性
HTML5新特性包括新增了部分标签、表单元素增强、支持视频和音频、支持canvas绘图、提供web存储、提供地理定位功能、提供web workers机制、提供web socket协议、提供CSS3支持。（6）透明度和合成：可以使用 globalAlpha 和 globalCompositeOperation 属性设置透明度和合成操作，例如：叠加、覆盖、透明等。（1）HTMLMediaElement接口：定义了音频和视频元素的属性和方法，如播放、暂停、音量、进度、媒体时长等。
2024-05-13 16:48:33
499
原创 操作系统中的进程和线程
*进程是操作系统中的一个执行实例，有独立的内存空间、虚拟地址空间、全局变量、堆栈等资源。不同的进程之间通常是相互独立的，每个进程可以运行在自己的地址空间中。**不同的线程之间共享相同的地址空间和其他资源，但是每个线程也有自己的堆栈和寄存器状态。操作系统本质上是一个软件, 发挥的是管理作用, 可以管理软件和硬件, 让其有条不紊的运行和使用.一个进程可以看作是一个程序的执行实例，其中包含了程序代码、数据、堆栈、打开的文件等资源。劣势：进程之间的通信和协作较为困难，进程切换开销较大，需要消耗更多的系统资源。
2024-05-13 15:17:50
159
原创 js中变量提升的那点事
这里需要注意的是:let和const声明的变量不会像var声明的变量那样存在变量提升,因为let和const声明的变量有暂时性死区（TDZ），即在声明之前使用这些变量会抛出ReferenceError。提升到作用域起始处的过程，即变量声明 var 和函数声明 function fun() {…} 在会发生变量提升过程。其实这里很好理解,有变量声明的函数表达式,会像变量声明一样,在未赋值前变量值为undefined。先来说变量声明var,看代码。再来看看函数的声明,看代码。
2024-05-13 10:53:04
171
原创 必须要知道的HTTP的那点事
Socket是长连接：由于通常情况下Socket连接就是TCP连接，因此Socket连接一旦建立，通信双方即可开始相互发送数据内容，直到双方连接断开，这称为长连接(socket会自动向服务端发送心跳包吧，这样可一直保持连接)。HTTP是短连接：HTTP连接使用的是“请求—响应”的方式，不仅在请求时需要先建立连接，而且需要客户端向服务器发出请求后，服务器端才能回复数据。http协议是无状态的，同一个客户端的这次请求和上次请求是没有对应关系，对http服务器来说，它并不知道这两个请求来自同一个客户端。
2024-05-11 16:52:39
669
原创 逻辑位运算符&、|、^、~(接上篇二进制十进制)
^”运算符（位异或）用于对两个二进制操作数逐位进行比较，并根据如表格所示的换算表返回结果。“|”运算符（位或）用于对两个二进制操作数逐位进行比较，并根据如表格所示的换算表返回结果。用于对两个二进制操作数逐位进行比较，并根据下表所示的换算表返回结果。所以,12 和 5 进行位异或运算，则返回值为 9。位与（&）、位或（|）、位异或（^）、非位（~）12 和 5 进行位或运算，则返回值为 13。12 和 5 进行位与运算，则返回值为 4。分别将其转换为二进制数值,再逐位进行计算。例如:计算 12 | 5。
2024-05-11 14:53:09
306
原创 二进制与十进制的转换
*即用十进制的小数乘以 2 并取走结果的整数(必是 0 或 1)，然后再用剩下的小数重复刚才的步骤，**直到剩余的小数为 0 时停止，**最后将每次得到的整数部分按先后顺序从左到右排列即得到所对应二进制小数。**整数部分采用 "除2取余，逆序排列"法。再用2去除商，又会得到一个商和余数，如此进行，**直到商为小于1时为止，**然后把先得到的余数作为二进制数的低位有效位，后得到的余数作为二进制数的高位有效位，依次排列起来。有四种情况: 0+0=0，0+1=1，1+0=1，1+1=10(0 进位为1)
2024-05-11 09:39:55
156
原创 js中日期Date的使用
日常搬砖过程中,凡事使用到Date总是一知半解,每次都要查阅资料,今天有时间把这里整理一下,希望今天储备的知识,够以后使用就不用查阅资料了哈,现在开始吧。例如: new Date(2020, 5, 19, 25, 65) 将返回 2020 年 6 月 20 日凌晨 2:05。以上都可生成一个日期对象,但有时我们也会遇到只有一个Date(),这种形式,我们分别打印一下返回值,发现。日期字符串 new Date(“December 17, 1995 03:24:00”);日期和时间组件的单独值,
2024-05-08 15:56:59
400
原创 js中super关键字的使用
将super调用置于this之前,可以正常运行,上看是再有constructor方法的时候,那么,如果没有constructor那有如何呢?上面的super对方法的调用时普通方法,那如果super调用的是静态方法呢?super.name指向的是原型对象上的name,但是绑定的this还是当前的son对象,所以上面的代码,要先调用super,然后在对this进行操作.我们修改一下代码。只要在对象的方法上通过super调用原型的方法,this指向当前的子类实例。我们再来改造一下上面的对象。
2024-05-07 11:00:50
240
原创 js中重复绑定事件
那么,我们是否能实现每次绑定的事件都能执行呢?答案是可以的,我们来修改代码。在同一元素上绑定多个事件,那么这些事件要如何执行呢?我们来点击结点元素,运行后发现,控制台之打印出了3。再次点击结点元素,发现分别打印出了1,2,3。
2024-05-06 17:01:10
282
原创 数组操作push、pop、shift、unshift操作
push、pop都是从数组尾部操作(你看p开头的,就记住屁股就行了),分别是插入和弹出。shift和unshift都是从数组头部操作,分别是删除和插入。这四个都是用来操作数组的,用于插入和删除元素。
2024-05-06 15:46:25
213
原创 构造函数中return的几种情况
能不能在构造函数中使用return呢?答案是可以的,但是return在使用过程中要知道一些规则。我们在上面定义了5个构造函数,让他们分别返回不同的基本类型和引用类型的数据。是不是清楚了,利用new实例的对象和函数执行时return的情况不一样哈。这里请注意构造函数实例化对象要区别于函数的执行。下面我们来实例化这些构造函数,看看结果。我们通过代码的形式,来了解了解。
2024-04-30 17:16:51
280
原创 箭头函数的一些总结
我们在上面定义了一个对象obj,然后在里面我们给它添加了两个属性getName和getAge,可以看到两种形式,一种是箭头函数外面套了一个普通函数,另外一个箭头函数直接添加到obj上面。我们在上面打印箭头函数的结构是看到,箭头函数也拥有call、apply、bind的属性,那能不能利用它们改变this的指向呢,来试试。还是回头去看打印的箭头函数的结构,我们发现箭头函数也有arguments,现在我们来改造一下obj,打印arguments。先来定义一个普通函数,一个箭头函数,分别看一下它们的结构。
2024-04-30 15:04:59
287
原创 call、apply、bind能用来干点啥(接上文)
在上一篇文章,提到过函数中的this和它执行的作用域有关,和它定义的的作用域没有关系,我们在日常使用中,其实有时候会想让函数执行的作用域就固定在定义它的地方,那我们要如何操作呢。报错了,说明list上面没有slice的方法,我们用不了,那是不是我们只能通过for循环才能找到呢,其实也不用,我们来使用call吧。上文我们了解了call、apply、bind的使用规则,学以致用,我们要在平时的搬砖中怎么使用呢?其实好些人平时也用不到这三货,但是在框架底层,这三货可是经常被用到的啊,现在我们来了解了解吧。
2024-04-30 13:47:13
147
原创 js中call、apply、bind使用上的一些总结
我们可以通过以上运行结果指导,this的指向与函数执行的作用域有关,它在什么作用域下执行,this就指向谁.所以,我们在personObj下调用introduce,它里面的this自然就指向personObj。我们看到,在使用上apply和call都可以达到一样的效果,更改执行函数的this指向,并且通过传递数组参数来改变执行对象中的属性,他两唯一的区别就是传递参数的类型上面,apply是一个数组。而且在指向bind方法的时候参数可以在创建新的函数时候提供,也可以在指向新函数的时候在提供。
2024-04-29 17:17:29
939
原创 原型链prototype、__proto、constructor的那些问题整理
从上面结构我们能看的出来,函数有两种原型,一种是作为函数特有的原型:prototype,另一种是作为对象的__proto__类型(就是上图那个[[Prototype]],__proto__是浏览器自己填充的,新浏览器都能看到,我的浏览器版本低,还看不到哈,先这么写)没有问题,和预期一样,这么看,我们现在就可以把上面写法精简一下,因为对象上的属性和方法,自己上面没有,就会去它的原型链上面去找,也就是对象会有原型的继承。我们再来看函数的另外一个原型__proto__,我们展开它。
2024-04-26 16:51:22
1545
原创 字符串、数组的反转
反转数组中的元素，并返回同一数组的引用。数组的第一个元素会变成最后一个，数组的最后一个元素变成第一个。换句话说，数组中的元素顺序将被翻转，变为与之前相反的方向。字符串的反转咋弄,我们这里可以借用一下数组的reverse方法,先把字符串转成一个数组,然后反转,再拼接。我的糊涂点,以为都能用呢,但是不是自己想的那样,哎妈呀,东西虽简单但是容易混啊。上面的方法,所以所有数组的实例都能用**[].reverse**这种使用它。看上面的关键词“就地”,记住啊,使用了它,会改变数组本身的。reverse() 方法。
2024-04-25 16:58:19
161
原创 容易记混的方法slice、splice、split
如果省略了 deleteCount，或者其值大于或等于由 start 指定的位置到数组末尾的元素数量，那么从 start 到数组末尾的所有元素将被删除。如果 start >= array.length，则不会删除任何元素，但是该方法会表现为添加元素的函数，添加所提供的那些元素。如果索引是负数，则从数组末尾开始计算——如果 start < 0，则使用 start + array.length。看到了没,就地的那个关键词,也就是说它执行后会改变原来的数组哈,这个方法的返回是一个包含了删除的元素的数组。
2024-04-25 16:36:18
797
原创 sessionStorage、localStorage、cookie的缓存
app端通过原生方法更换webView实现跳转，这种方式不能共享sessionStorage，原窗口跳转的页面传递sessionStorage，改变存储值会相互影响，新开窗口跳转方式传递sessionStorage，改变存储值互不影响。仅在当前浏览器会话期间有效,关闭窗口或标签页时会消失.同时,每个标签页、窗口、框架都有自己的sessionStorage存储空间,他们之间是相互独立的.本质上来说,sessionStorage的存储是临时缓存,不能长久保存.2、localStorage: 永久存储。
2024-04-24 11:03:27
567
转载 客户端HTTP缓存的使用-明明白白
因此，同一个客户端对同一个页面的多次请求，很可能被分配到不同的服务器来响应，而根据ETag的计算原理，不同的服务器，有可能在资源内容没有变化的情况下，计算出不一样的Etag，而使得缓存失效。因为Expires 是有问题的，它最大的问题在于对“本地时间”的依赖，如果服务端和客户端的时间设置可能不同，或者我直接手动去把客户端的时间改掉，那么expires将无法到达我们的预期，因此出现Cache-Control来弥补缺陷。也就是说，在 365 天内再次请求该资源时，都会直接使用资源池中的资源。
2024-04-24 09:49:09
51
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人