- 博客(90)
- 收藏
- 关注
RSS订阅原创 js构造函数的prototype赋值总结
这里需要特别注意的一点是__proto__和prototype属性都是作为对象的一个引用,是指针,指向存储中实际存在的一个变量,当变量中的属性和方法有变化的时候__proto__和prototype都会随之改变。如果prototype指针指向新的变量的时候,prototype会有一个新的值,但是__proto__并不会改变哦,因为它的指针没有变换指向哈,还是指向原来的变量,值当然不会改变.我们知道通过构造函数的prototype,可以生成让所有实例对象访问的通用属性和方法,下面通过代码来解释这个过程。
2024-08-09 11:29:31
351
原创 前置运算符与后置运算符计算的小技巧
我们对于++i和i++或者–i和i–是不是有时候会记不住,我就是啊,为了让自己记住,有个记忆的小技巧。i在后,先+1, ++i = i+1,i就在里边。i在前,后+1, i++ = i,i就在外边。同理,–也是一样的道理,记住吧。
2024-08-08 09:24:14
161
原创 函数参数的定义以及参数传值传址的区别
比较简单,函数内,因为没有var a,所以此处的a是全局变量的重新赋值,最终全局变量a被重新赋值为100了。现在,我们给函数一个形参,然后调用的时候将全局变量a以实参传入函数内,我们再次执行函数。我们将对象obj以参数形式传入函数内部,再次执行函数,我们看一下。我们运行函数,然后再回头来看全局变量的值。
2024-08-07 15:46:26
302
原创 typeof的小知识点、函数内给函数名变量重新赋值
typeof abc会返回undefined的原因是，typeof有一个特殊的安全防范机制，可以在对一个未声明的变量进行RHS查询时阻止报错，只返回undefined而不抛出异常。当这个abc()执行的时候就会报错了。
2024-08-07 14:50:05
202
原创 Object.is了解一下
===”: 对于 0 和 NaN 的比较。无论 0 的正负，他们都是相等的，而 NaN 是与任何值都不相等的，包括他本身。Object.is(): 认为NaN 与 NaN 相等，Object.is(+0,-0)的返回结果为false。Object.is()与===都是判断两个数是否严格相等。它们的区别主要在NaN自身和+0与-0的判断。
2024-08-06 17:24:37
103
原创 通过Object.defineProperty给对象的属性添加拦截
类中使用get、set其实和通过Object.defineProperty给构造函数的原型添加get、set是一样的,仅仅是写法上有些区别,类的形式看上去更为简洁方便。在之前的博文中,曾经总结过vue2数据监听的实现原理,本篇和之前其实也差不多,都是给对象添加get、set的存取器属性以达到数据拦截处理的目的.3、通过Object.defineProperty新增的sex读属性,没有写,说明这个sex是只读的,所以this.sex的写不起作用。为什么要给对象添加这种存取器的属性呢?
2024-08-06 16:49:05
772
原创 js中的with了解一下
实际上with中的age = 100,开始的时候会找obj2上面时候有age属性,如果没有,他会往上面找,显然test方法中也没有这个age,那么就会再次往上找,直到全局作用域,还是没有,这时候就会新建一个age属性,然后赋值为100了。通过代码的执行,我们看到包含age属性的对象,通过with中的执行语句修改了对象的age属性,但是不包含age属性的对象,并没有修改。显然上面操作obj2的时候是有问题的,我们并不是要在全局新建一个age的属性,而且函数的数据也被泄漏到全局中了。
2024-08-02 17:24:13
307
原创 实现数组扁平化的几种方式
使用toString方法可以将数组转化为数组内部元素的字符串,然后针对该字符串返回扁平化的数组,只是这种方法如果遇到包含对象的数组就不行了。递归的方法就是一直合并数组中是数组的元素,这里问题不大,这个方法适用于结构相对简单的数据,如果数据量特别的大,使用递归的话,回应性性能。flat传入的参数,指定要提取嵌套数组的结构深度，默认值为 1。假使,我们不知道深度是多少的情况下,可以传入Infinity。所以,利用这个特性,我们还可以用它来删除数组的空槽数据哈!利用数组的flat方法可以实现数组的扁平化。
2024-08-02 16:19:10
432
原创 js实现函数柯里化
所以,我们现在来创建一下柯里化函数吧,这个函数接收一个需要柯里化的普通函数 fn,然后它返回一个新的函数,直到函数接收的参数的数量达到了fn的参数的数量,那么返回fn的运行结果.**柯里化是一种将使用多个参数的函数转换成一系列使用一个参数的函数的技术。**这种技术通常用于创建一个参数接收器，或者用于提前确定某些参数。就是实现 curry(sum)(1)(2)(3) 等于6.记录一下实现函数柯里化的过程。先来了解一下什么是柯里化?这里有一个求和的函数。
2024-08-02 10:43:38
369
原创 记录两个可以匹配中文的正则表达式
数字英文等字符为一个字节,汉字为两个字节,所以,我们需要把字符串中的每个中文替换为两个英文字符即可按照length计算长度了。2、/[^\x00-\xff]/ 匹配双字节字符(包括汉字在内)1、/[^\u0000-\u00ff]/ 可以匹配中文。记录两个可以匹配中文的正则表达式。
2024-08-01 10:12:45
262
原创 js 判断对象上面是否包含某一属性
2、这个属性不是对象自己的属性,但是它是对象原型链上的属性。判断对象上面是否包含某一属性,分两种情况。1、这个属性只是对象自己的属性。
2024-07-31 10:15:44
260
原创 js中引用未定义的变量与对象属性的不同结果
2、定义了变量,但是未赋值,引用时,提示undefined。3、调用对象上没有的属性时,提示undefined。js中引用未定义的变量与对象属性的会有不同结果哦。1、直接引用未定义的变量会报错。
2024-07-30 16:47:26
225
原创 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
679
原创 js遍历数组对空位的处理
这里的array就是初始化的长度为4的数组,但是我们还未给数组的属性赋值,所以它时包含4个空值的数组。实际情况中,有一种情况是定义了数组,但是还未给数组赋值的情况,这种情况就会形成数组位上的空值。在上面的代码运行中,可以看到上述几个数组处理方法会跳过对空值的处理,需要注意的是,由于上述的遍历方法都会跳过空值处理,所以,如果我们要想处理空值,只能使用for循环。如果处理数组的空位呢,比如赋值或者删除。先来了解一下,在数组的遍历过中,
2024-07-29 10:40:10
224
原创 js中二进制与十进制的相互转换
当然,我上面的方法都可以正常实现结果,但是过程可以更加容易。1、parseInt 可以将二进制数据转换成10进制。2、toString可以将10进制数据转换成2进制。太easy了,记住吧!
2024-07-25 15:45:12
243
原创 js中function形参与实参数的获取length与arguments
相比之下，arguments.length 是局限于函数内部的，它提供了实际传递给函数的参数个数。然后我们再看“只包括在第一个具有默认值的参数之前的参数”这句话的理解,说白了就是给函数的参数初始化值。从上述代码可以看出,我们可以通过使用arguments来获取函数调用时实际传入的参数也就是实参.在写代码的实际应用中,我们有时候需要获取函数的行参或者实参,下面就此问题做一下总结.args){},这里的…实际应用中获取实参可以在函数内部使用arguments。下面我们来看一个函数的结构。那么如果获取行参呢?
2024-07-25 10:02:03
478
原创 Reflect使用的一些总结
这种理念很大程度上是受到函数式编程的影响,ES6进一步贯彻了这种理念，它认为，对属性内存的控制、原型链的修改、函数的调用等等，这些都属于底层实现，属于一种魔法，因此，需要将它们提取出来，形成一个正常的API，并高度聚合到某个对象中，于是，就造就了Reflect对象。Reflect 的所有属性和方法都是静态的。所以,Reflect在配合proxy一起使用时,我们在自定义的get、set这样的处理方法中,更为标准的做法是，先去实现自己所需要的监视逻辑，最后再去返回通过Reflect中对应的方法的一个调用结果。
2024-07-18 10:41:25
609
原创 使用proxy来实现数据监听
还记得上一篇中展示过Object.defineProperty对数组进行set操作并不生效,实现不了监听,要想实现数据的监听我们是通过重写数组的操作方法,那么,我们现在来看看用proxy能否实现对数组的监听呢?,这也是proxy相比于Object.defineProperty的一个优势,(defineProperty的方式必须给对象本身的每一个属性添加监听,改变了对象本身)defineProperty(): Object.defineProperty 方法的捕捉器。set(): 属性设置操作的捕捉器。
2024-07-18 09:04:01
574
原创 vue2.0中如何实现数据监听
这样,我们就清楚了vue2.0对象监听的原理了,可以看出,我们需要对对象数据的每一个属性都添加存取器属性,遇到数组类型还要重新给数据方法做重写操作,那么,我们可以想象,如果这个对象在十分复杂的情况下,是不是实现起来非常复杂,而且对性能的消耗也是非常的巨大。我们看到虽然数组也是对象类型,但是,当我们给数组新增数据的时候,并没有进入到setter方法中,所以我们需要针对数组类型特殊处理,这里我们需要给对象的数组处理方法重新定义一下。说明我们同时监听到了对象属性是对象的情况下的值。
2024-07-17 14:21:52
1937
原创 URLSearchParams针对url中参数的处理方法
可以看到打印出的对象,原型是URLSearchParams,并且可以继承get、getAll、has、set、append、delete、entries等方法.以往,我们处理url中参数的办法是分割字符串然后循环遍历等,为了解决这个问题,es6特出了URLSearchParams来帮我们简化操作,下面来了解。通过new URLSearchParams(search),我们可以创建出一个新的对象,那这个对象包含哪些内容呢呢?以上就是对URLSearchParams的一些总结,很有用的方法哦,记住吧!
2024-07-12 14:39:26
294
原创 对象与键值对数组的相互转换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
435
原创 生成指定范围内的随机数
生成随机数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
625
原创 如何判断一个js对象为数组类型
能想到的最常见的intanceof是吗?开始是这么认为,但是不是哈,看下面的解释,也没有太明白,暂且记住吧。综上,判断js对象为数组的两种方式。如何判断一个js对象为数组类型?
2024-07-10 09:21:20
178
原创 symbol数据类型以及应用场景
如果我们想创建一个可供全局使用的symbol,那么我们需要用Symbol.for(),可以传递一个参数作为描述,该方法可以遍历全局注册表中的的Symbol，当搜索到相同描述，那么会调用这个Symbol，如果没有搜索到，就会创建一个新的Symbol。2、使用Symbol.for(‘a’)在全局注册表中寻找描述为a的Symbol，并没有找到，所以在全局注册表中又创建了一个描述为a的新的Symbol。即使是传入相同的参数，生成的 symbol 值也是不相等的，因为 Symbol 本来就是独一无二的意思。
2024-07-09 16:24:03
345
原创 全局变量与局部变量同名优先级
如果全局变量与局部变量同名，则局部变量将优先。这是因为局部变量在函数执行时会被推到作用域的最前端，从而在作用域链中具有更高的优先级。综上,我们可以通过window对象（在浏览器中）来访问全局变量。由上面代码看到如果全局变量与局部变量同名，则局部变量将优先.那么如果要在函数内部怎么拿到全局的val呢?
2024-07-09 14:42:11
417
原创 try/catch/finally语句的使用
注意到函数内有一个return,但是因为try中抛出了一个错误,但是当错误发生时， JavaScript 会停止执行，所以这个return不起作用了.这里我们通过标签化语句,通过break来跳出当前代码块,所以try中return就不会再执行了,紧接着就会执行到外层代码了。这里,我们回忆一下上一篇博文的标签化语句,如果我们想执行外层的代码那要怎么处理呢。我们通过执行可知,在try中执行了return后最外层的代码就不执行了。允许我们定义当 try 代码块发生错误时，所执行的代码块。下面我们再来改造一下。
2024-06-27 11:26:47
317
原创 js中标签化语句的一些总结
今天在控制台打印对象遇到一个奇怪的事情,问题的起源是一个{a:1}的对象,我直接控制台输入{a:1}结果还是{a:1},但是如果我在前面加一个debugger后{a:1}的结果就变成了1.下面我们有一个需求,需要在i为3,j为2的时候退出最外层的循环,我们这里想到了break,但是break仅能退出里层循环,所以我们需要在这里利用return来实现。没有问题,我们实现了需求,但是这里虽然我们实现了,但是套了一个函数,显得代码不够精简,所以我们利用开始提到的标签化语句来实现需求。
2024-06-27 10:47:52
314
原创 数字字面量形式的方法调用会报错?
为啥报错呢,其实这里有个误区,之所以会报错，是因为在这里的 . 发生了歧义。它既可以理解为小数点，也可以理解为对方法的调用，问题就出在这里了。我们想要后一种理解，而实际上，因为这个点紧跟于一个数字之后，按照规范，解释器就把它判断为一个小数点。今天遇到一个奇怪的问题2.toString()运行后有什么结果?本来想着应该会是‘2’,可惜不是,报错了。如何解决这个问题呢?
2024-06-21 16:16:45
231
原创 canvas和svg的一些总结
在 canvas 中，一旦图形被绘制完成，它就不会继续得到浏览器的关注。如果其位置发生变化，那么整个场景也需要重新绘制，包括任何或许已被图形覆盖的对象。SVG 基于 XML，这意味着 SVG DOM 中的每个元素都是可用的。在 SVG 中，每个被绘制的图形均被视为对象。如果 SVG 对象的属性发生变化，那么浏览器能够自动重现图形。Canvas 和 SVG都可在浏览器中创建图形,但是它们的创建形式有些区别。SVG 是一种使用 XML 描述 2D 图形的语言。canvas和svg的区别。
2024-05-22 15:54:01
354
原创 关于盒子模型的样式问题
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
323
原创 字符串和数组的length
当你将 array.length 设置为小于当前数组长度的值时，数组将被截断，其中的元素将被删除。如果你将其设置为大于当前数组长度的值，数组将被扩展，新增的元素将被填充为 undefined。在JavaScript中， 属性用于获取数组的长度。但是，如果你尝试通过修改 array.length 的值来“改变数组”，你可能会遇到一些意外的行为。利用str.length 并不会改变字符串本身，它是一个。，返回字符串的长度。如果你尝试去修改它，请使用字符串截取。
2024-05-21 17:05:11
132
原创 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
312
原创 如何中断循环
试想有一个数组,我们循环的过程当符合某个条件的时候中断当前的循环,我们要如何实现呢。看到了,forEach中使用break不能终止循环,会报错,那么试试return吧。写循环的时候我们有时候也会用到数组循环的遍历方法,我们找一个forEach来举例。,其实这里有个误区,想一想js中return要用在哪里呢?能实现循环的方法有很多种,我们找几个有代表性的来试试。不报错,但是也终止不了循环哈,那要如何做呢,来看下面。想到了return和break,那么来试试吧。那我们来给上面套一个函数在试试。
2024-05-16 17:17:49
263
原创 html5的一些新特性
HTML5新特性包括新增了部分标签、表单元素增强、支持视频和音频、支持canvas绘图、提供web存储、提供地理定位功能、提供web workers机制、提供web socket协议、提供CSS3支持。（6）透明度和合成：可以使用 globalAlpha 和 globalCompositeOperation 属性设置透明度和合成操作，例如：叠加、覆盖、透明等。（1）HTMLMediaElement接口：定义了音频和视频元素的属性和方法，如播放、暂停、音量、进度、媒体时长等。
2024-05-13 16:48:33
518
原创 操作系统中的进程和线程
*进程是操作系统中的一个执行实例，有独立的内存空间、虚拟地址空间、全局变量、堆栈等资源。不同的进程之间通常是相互独立的，每个进程可以运行在自己的地址空间中。**不同的线程之间共享相同的地址空间和其他资源，但是每个线程也有自己的堆栈和寄存器状态。操作系统本质上是一个软件, 发挥的是管理作用, 可以管理软件和硬件, 让其有条不紊的运行和使用.一个进程可以看作是一个程序的执行实例，其中包含了程序代码、数据、堆栈、打开的文件等资源。劣势：进程之间的通信和协作较为困难，进程切换开销较大，需要消耗更多的系统资源。
2024-05-13 15:17:50
176
原创 js中变量提升的那点事
这里需要注意的是:let和const声明的变量不会像var声明的变量那样存在变量提升,因为let和const声明的变量有暂时性死区（TDZ），即在声明之前使用这些变量会抛出ReferenceError。提升到作用域起始处的过程，即变量声明 var 和函数声明 function fun() {…} 在会发生变量提升过程。其实这里很好理解,有变量声明的函数表达式,会像变量声明一样,在未赋值前变量值为undefined。先来说变量声明var,看代码。再来看看函数的声明,看代码。
2024-05-13 10:53:04
217
原创 必须要知道的HTTP的那点事
Socket是长连接：由于通常情况下Socket连接就是TCP连接，因此Socket连接一旦建立，通信双方即可开始相互发送数据内容，直到双方连接断开，这称为长连接(socket会自动向服务端发送心跳包吧，这样可一直保持连接)。HTTP是短连接：HTTP连接使用的是“请求—响应”的方式，不仅在请求时需要先建立连接，而且需要客户端向服务器发出请求后，服务器端才能回复数据。http协议是无状态的，同一个客户端的这次请求和上次请求是没有对应关系，对http服务器来说，它并不知道这两个请求来自同一个客户端。
2024-05-11 16:52:39
685
原创 逻辑位运算符&、|、^、~(接上篇二进制十进制)
^”运算符（位异或）用于对两个二进制操作数逐位进行比较，并根据如表格所示的换算表返回结果。“|”运算符（位或）用于对两个二进制操作数逐位进行比较，并根据如表格所示的换算表返回结果。用于对两个二进制操作数逐位进行比较，并根据下表所示的换算表返回结果。所以,12 和 5 进行位异或运算，则返回值为 9。位与（&）、位或（|）、位异或（^）、非位（~）12 和 5 进行位或运算，则返回值为 13。12 和 5 进行位与运算，则返回值为 4。分别将其转换为二进制数值,再逐位进行计算。例如:计算 12 | 5。
2024-05-11 14:53:09
393
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人