自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(32)
  • 问答 (1)
  • 收藏
  • 关注

原创 数组去重以及性功能分析

最简单。

2023-04-09 20:37:40 111 1

原创 数据代理、数据劫持;vue响应式与双向绑定

主要分为三步:第一步:创建一个对象,将数组的原型赋值给该对象。

2023-03-30 11:05:40 306

原创 垃圾回收机制——把我回收了吧

将内存空间划分为两块,一块为存活对象的From空间,另一块为空闲的To空间,当From空间快满时,就会触发一次垃圾回收操作,将From空间中的存活对象复制到To空间中。当某个值的引用计数为0时,说明该值已不再被使用,可以被垃圾回收机制回收。在此基础上,将存活对象向一端移动,并清除掉其它空间的对象,以减少内存碎片。JS 中的垃圾回收机制是为了预防内存泄漏,即当某个对象不再被使用时,垃圾回收机制会自动回收它占用的内存空间,以避免浪费计算机资源的情况。之后,垃圾回收器将扫描内存中未标记的对象,并将其清除。

2023-03-29 22:23:25 377 1

原创 前端安全(自留)

攻击者通过在网站注入恶意脚本,使之在用户的浏览器上运行,从而盗取用户的信息如 cookie 等。当目标站点在渲染html的过程中,遇到陌生的脚本指令执行。cookie 设置为http-only。拦截器检查reffer 但是可以伪造。黑名单过滤 白名单过滤(用户名密码)这样js脚本就不能读取到cookie。

2023-03-10 22:17:37 1800

原创 函数柯里化

可以一次传很多参数给curry函数,也可以分多次传递,curry函数每次都会返回一个函数去处理剩下的参数,一直到返回最后的结果。用闭包的原理,将每次传递进来的参数存起来,当参数不符合预期时,返回一个新的函数接收剩余参数,继续调用,不符合则再递归。

2023-03-02 14:41:10 63

原创 力扣每日打卡(自用)

给定一个字符串 s ,请你找出其中不含有重复字符的 最长子串 的长度滑动窗口 set的使用。

2023-02-22 21:07:12 193 2

原创 从浏览器内核到-moz、-ms、-webkit、-o

在我们查看网页代码时可以看到很多css属性前加了这些浏览器私有前缀名,也借此温习一下关于主流浏览器与其内核的知识点。html {

2023-01-10 23:14:05 465

原创 Commonjs与Esmodule模块化规范

早期开发常使用script标签进行引入,但是这样容易存在全局污染与依赖混乱的问题。如果不同文件里都存在同一变量,那么就全局污染混乱了(当然也是可以使用匿名函数自执行的方式,形成独立的块级作用域)。依赖管理也是一个难以处理的问题。正常情况下,执行 js 的先后顺序就是 script 标签排列的前后顺序。那么如果三个 js 之间有依赖关系,处理就成了问题。综上,我们引出模块化。前端模块化的两个重要方案:Commonjs 和 Es Module我们首先要知道:如上每一个变量代表什么意思呢:正式开始使用:中

2022-12-02 21:31:25 604

原创 Vue事件绑定原理

vue的事件绑定分为两种,一种是直接绑定在dom元素上的原生事件,另一种是绑定在组件上的事件,其中组件事件加了.native修饰符的则等价于原生事件的处理。前者的的原理是通过addEventListener绑定给真是元素,后者则是通过vue自带的$on实现,需要子元素 $emit触发。过程展开说就是前者的过程在于:vue在创建dom时会调用createEle,默认调用invokeCreateHooks,针对事件会调用updateDOMListeners,其中就有add方法,核心使用addEventL

2022-11-12 17:25:31 880

原创 手撕vue2响应式

本篇主要剖析监听原理,没有详细的收集依赖逻辑,这个有待后续补充。对于普通属性来说正常对于对象里面增添属性:可见并不是响应式移除也是一样的:delete会把其getter与setter都删掉可以看出对于增添的属性不具备响应式对于嵌套对象与数组:对其的修改setter根本没法捕获,都只触发外层的get注意,defineProperty本身可以监听数组的变化,只不过由于性能问题,没采用罢了其实只用在定义响应式函数defineReactive中增添一个递归嵌套可以看到这样就能解决嵌套对象

2022-11-09 20:27:20 707

原创 async await复习(包含Generator

async是ES7新出的特性,是 Generator 函数的语法糖,表明当前函数是异步函数,不会阻塞线程导致后续代码停止运行。任何async函数都会默认返回promise,并且这个promise解析的值都将会是这个函数的返回值,而async函数必须等到内部所有的 await 命令的 Promise 对象执行完,才会发生状态改变。await意思是async wait(异步等待),这个关键字只能在使用async定义的函数里面使用。他们存在的意义就是用同步的方式执行异步操作比如。

2022-10-31 22:00:49 187

原创 前端数据存储系列(Cookie、Session、localStorage、sessionStorage、Token)

Cookie是客户端保存用户信息的一种机制,用来记录用户的一些信息,实际上Cookie是服务器在本地机器上存储的一小段文本,并随着每次请求发送到服务器。Cookie会根据响应报文里的一个叫做Set-Cookie的首部字段信息,通知客户端保存Cookie。当下客户端再向服务端发起请求时,客户端会自动在请求报文中加入Cookie值之后发送出去保存时间:默认情况下,当浏览器关闭后,Cookie数据被销毁持久化存储:正数:将Cookie数据写到硬盘的文件中。持久化存储。

2022-10-28 11:43:59 3160

原创 手撕深浅拷贝与优化

如果属性是内存地址(引用类型),拷贝的就是内存地址 ,因此如果其中一个对象改变了这个地址,就会影响到另一个对象。(新旧对象共享同一块内存),所以如果其中一个对象改变了这个地址,就会影响到另一个对象(只是拷贝了指针,使得两个指针指向同一个地址,这样在对象块结束,调用函数析构的时,会造成同一份资源析构2次,即delete同一块内存2次,造成程序崩溃);也就是两个对象指向的是同一个存储空间,无论哪个对象发生改变,其实都是改变的存储空间的内容,因此,两个对象是。如果属性是基本类型,拷贝的就是基本类型的值。

2022-10-27 21:31:11 319

原创 手撕防抖节流(含原理与应用场景,以及为什么加apply)

由于setTimeout函数的时间参数存在误差(或者说执行函数本身所需要的时间),所以打印的结果后三位不一定是我们期望的数值。节流函数除了利用定时器的方式,也可以利用时间戳的方式。如单位时间内多次触发函数,也只有第一次生效,相比防抖缺少了clearTimeout这一步骤,而是通过if语句判断。不改变的话出大问题,不改变的话指向undefined(严格模式下没有调用者时,this的值为undefined),加上apply后才指向实例。事件被触发后延迟n秒再执行回调,如果在这n秒内又被触发,则重新计时。

2022-10-27 17:19:55 938 3

原创 js 判断数据类型的几种方法

如果表达式 obj instanceof Foo 返回 true,则并不意味着该表达式会永远返回 true,因为 Foo.prototype 属性的值有可能会改变,改变之后的值很有可能不存在于 obj 的原型链上,这时原表达式的值就会成为 false。另外一种情况下,原表达式的值也会改变,就是改变对象 obj 的原型链的情况,虽然在目前的ES规范中,我们只能读取对象的原型而不能改变它,但借助于非标准的 __ proto __ 伪属性,是可以实现的。3、如果更改了对象的原型,那么得到结果也是不准确的。

2022-10-26 20:32:50 157

原创 h5的data-*属性以及响应式图片替换

data-*全局属性是一类被称为自定义数据属性的属性,它赋予我们在所有 HTML 元素上嵌入自定义数据属性的能力。

2022-10-22 22:29:57 235

原创 margin auto不对行内/行内块有效的原因

除此之外,绝对定位元素如果在对立方向设置了相同数值,也会产生流体特性。inline-block:没有流体性,因为元素会改为收缩性(shrink),收缩到他可以收缩的最小宽度。流体特性:元素可以自适应它所处包含块的尺寸。比如常见的块级元素,默认是占满整个包含块的水平宽度。margin:auto只对有流体特性的元素生效。

2022-10-18 22:02:10 388

原创 盒模型相关汇总(分类、获取宽高、边距重叠、BFC)

标准模型和ie模型的区别是计算宽width高height的不同。标准模型width不计算padding和border;ie模型width计算padding 和border;==设置==的宽高是对实际内容==content==的宽高进行设置,内容周围的border和padding另外设置;即元素==实际==的宽高为:width【height】= 设置的content的宽【高】 + padding + border设置的宽高是对==实际内

2022-10-18 22:00:58 422

原创 EventLoop事件循环及浏览器首次渲染

Event Loop即事件循环,是指浏览器或Node的一种解决javaScript单线程运行时不会阻塞的一种机制,也就是我们经常使用异步的原理。

2022-10-15 21:54:36 573

原创 从浏览器地址栏输入 url 到请求返回发生了什么(7步)

DNS 解析:将域名解析成 IP 地址TCP 连接:TCP 三次握手发送 HTTP 请求服务器处理请求并返回 HTTP 报文浏览器解析渲染页面断开连接:TCP 四次挥手。

2022-09-28 21:43:36 521

原创 script 的defer与async(包含动态脚本)

defer 和async 属性 提供给开发者一个方式来告诉浏览器哪些脚本是需要异步加载的。直接上图。

2022-09-22 23:34:41 438

原创 TS学习笔记(完结)

外部类型声明通常是我们使用一些库(比如第三方库)时,需要的一些类型声明。这些库通常有两种类型声明方式:方式一:在自己库中进行类型声明(编写.d.ts文件),比如axios(node_modules里有.d.ts文件)方式二:通过社区的一个公有库DefinitelyTyped存放类型声明文件该库的GitHub地址:https://github.com/DefinitelyTyped/DefinitelyTyped/

2022-09-15 22:26:52 488

原创 TS学习笔记(三)

我们使用extends关键字来实现继承,子类中使用super来访问父类。Student类继承自Person:Student类可以有自己的属性和方法,并且会继承Person的属性和方法;在构造函数中,我们可以通过super来调用父类的构造方法,对父类中的属性进行初始化;只要在子类中我们使用了constructor,那么我们就要在子类中写 super,哪怕父类没写构造器子类如果有和父类相同的方法则会重写多态看上去是相同的类型,实际表现出来是不一样的。

2022-09-14 22:43:16 428

原创 TS学习笔记(一)

JavaScript所拥有的特性,TypeScript全部都是支持的,并且它紧随ECMAScript的标准,所以ES6、ES7、ES8等新语法标准,它都是支持的;所以,我们可以把TypeScript理解成更加强大的JavaScript,不仅让JavaScript更加安全,而目给它带来了诸多好用的好用特性。在语言层面上,不仅仅增加了类型约束,而且包括一些语法的扩展,比如枚举类型(Eum)、元组类型(Tuple)等;第一篇主要讲了对ts的认识,需要关注与js的区别,还有环境的搭建。第二篇开始记录ts相关语法。

2022-09-09 13:01:31 778

原创 TS学习笔记(二)

完整的声明格式如下:声明了类型后TypeScript就会进行类型检测,声明的类型可以称之为;=赋值;(ps:在tslint中并不推荐使用var来声明变量,主要原因和ES6升级后let和var的区别是一样的,var没块级作用域会引起很多的问题)数据类型是。

2022-09-09 00:40:23 1536

原创 uniapp解决自定义uni-nav-bar下方默认黑线、更改默认配置问题

最近刚接触做一个微信小程序的项目,时间比较紧张一来就开干,属于是稀里糊涂就上手了,也不免遇到一些比较基础的问题,这里统一记录一下。

2022-07-28 16:53:47 2328 6

原创 重温JavaScript——对八种数据类型的细节探究(含类型转换)

数据类型对学前端的小伙伴来说是基础概念,但在遇到一些面试题时(常见比如“为什么JavaScript里0.1+0.2不等于0.3”、“ES6新加入Symbol是个啥?”)不免还是会有一些犹豫,今天就来探究关于js类型的细节问题。PS有些内容也是自己初学前端时未曾深究过的,同时写这篇博客的过程中也顺带温顾了一些装箱的知识,“沿路”遇到写的蛮好利于辅助阅读的文章也随文贴出~遇到好的文章就应该要分享呀!......

2022-07-21 17:28:36 313 1

原创 局部安装webpack 查看版本报错 .\node_modules\.bin\webpack : 无法加载文件问题

前言最近想来复习一下webpack,没想到从安装开始就出了问题。以前大都是全局安装的,直接执行webpack指令就行。但是官方都不推荐全局,而且这会让webpack锁定到指定版本,要是和别人搭伙做项目需要使用不同的webpack版本也容易出问题,就重头局部安装了webpack。因为局部安装,要进入依赖包执行webpack的命令才有效,否则会被认为命令无效,所以执行.\node_modules\.bin\webpack -v 查看版本信息,然后报错:解决查到解决办法,在终端执行:get-Execu

2022-04-29 20:01:17 1541

原创 Pug转HTML、Sass转css网站推荐

今天看到一个很好的页面效果,可惜用的pug和sass实现的,如果用这两个的话项目里不太好维护,于是就去找能转成html和css的网站pug转html:pug转htmlsass转css:sass转css分享一下,解决不时之需~...

2022-03-24 20:17:35 789 1

原创 结合表单验证谈el-form中model、prop、rules属性

目录前言modelproprules验证总结前言最近写vue项目需要用element ui中的表单组件显示一些信息呈现在页面上,但在使用提供的一些属性时有些困惑——这三者之间有什么关系,必须要同时存在吗?于是在这里做一些记录。model官方说是表单中的数据对象,于是有<el-form ref="form" :model="form" :rules="rules" label-width="100px"><el-form-item label="用户名" prop="name"

2022-03-24 14:02:47 16904 9

原创 RedHat红帽安装gcc全过程问题记录以及解决建议

前言由于需要在RHEL7上使用gcc的一些命令,于是查询了一下安装yum和gcc的一些博客这个大佬写的很详细:RHEL7关于yum安装和gcc安装但是虽然照着教程一步步来但还是出现了许多问题,好在自己瞎摸索着最后终于装上了:所以在这里记录一下这个过程中遇到的问题和解决方式解析主机失败在wget时我一直报这个提示,同样看到上述教程的评论区里也有人出现同样的问题。后来ping百度才发现…自己根本没联网。可能出现这个问题的原因有很多,但是可以先看看自己有没有最基本的错误,检查一下联网吧。rpm

2022-03-15 21:55:34 4426

原创 前端JS实现八大排序(含原理及改进)

冒泡排序原理两相邻的数依次比较若从小到大排列两两比较时前一个数比后一个数大互换位置相互比较完一轮最大的数就会到最后面,并且不再参与比较循环比较 直到比较完成一张网图实现...

2022-01-20 13:30:39 1371

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除