zheshihuahua-CSDN博客

原创什么是 XSS 攻击？

DOM 型 XSS 跟前两种 XSS 的区别：DOM 型 XSS 攻击中，取出和执⾏恶意代码由浏览器端完成，属于前端JavaScript ⾃身的安全漏洞，⽽其他两种 XSS 都属于服务端的安全漏洞。XSS 攻击指的是跨站脚本攻击，是一种代码注入攻击。XSS 的本质是因为网站没有对恶意代码进行过滤，与正常的代码混合在一起了，浏览器没有办法分辨哪些脚本是可信的，从而导致了恶意代码的执行。恶意代码窃取⽤户数据并发送到攻击者的⽹站，或者冒充⽤户的⾏为，调⽤⽬标⽹站接⼝执⾏攻击者指定的操作。

2023-01-19 11:00:13 4853 1

原创大于号小于号等的转义符

小于号（）&le；小于等于号（≤ ）&ge；大于等于号（≥）引号（"）&ldquo；左双引号（“）&rdquo；右双引号（” ）&lsquo；做单引号（‘）&rsquo；右单引号（’ ）

2024-08-14 14:34:24 494

原创 order by 排序的时候按拼音排序的顺序

中，我们经常会对一个字段进行排序查询，但进行中文排序和查找的时候，对汉字的排序和查找结果往往都是错误的。将无法实际处理中文。出现这个问题的原因是因为MySQL在查询字符串时是大小写不敏感的，在编绎。字符集作为默认的字符集，因此在比较过程中中文编码字符大小写转换造成了这种现象。, 它不是按照中文来的。如果这个问题不解决，那么。的很多版本中都存在。

2024-07-31 14:16:41 244

原创乐观锁和悲观锁详解

乐观锁总是假设最好的情况，认为共享资源每次被访问的时候不会出现问题，线程可以不停地执行，无需加锁也无需等待，只是在提交修改的时候去验证对应的资源（也就是数据）是否被其它线程修改了（具体方法可以使用版本号机制或 CAS 算法）。高并发的场景下，激烈的锁竞争会造成线程阻塞，大量阻塞线程会导致系统的上下文切换，增加系统的性能开销。当多个线程同时使用 CAS 操作一个变量时，只有一个会胜出，并成功更新，其余均会失败，但失败的线程并不会被挂起，仅是被告知失败，并且允许再次尝试，当然也允许失败的线程放弃操作。

2024-07-24 10:53:08 576

原创 element ui 怎么调整table的行高

在Element UI中，调整Table的行高可以通过CSS覆盖默认的样式来实现。你可以为Table添加一个自定义类名，然后在CSS中指定。确保这段CSS被加载，行高就会按照你指定的值来显示。如果你使用了scoped样式，你可能需要使用深度选择器。element ui 怎么调整table的行高。来确保你的样式能够穿透组件边界。添加一个自定义的类名，比如。在你的CSS文件中，指定。在你的Vue组件中，给。

2024-07-15 15:15:49 1838

原创后端过长的Long类型数据返回给前端、前端补0的解决办法

后端Long类型，数据过长，返回到前端就会出现数据精度丢失，补0：解决办法：在该实体类的字段上加注解：注解1：注解2：若是还不能解决可以直接在后端把他变成字符串，返回给前端：

2024-07-04 16:21:34 263

原创 layui的 input正则校验必填和必须为正整数

【代码】layui的 input正则校验必填和必须为正整数。

2024-06-24 10:22:04 434

原创 Ant design Vue 表格中显示不同的状态（多条件显示）

这种方式不仅可以使后端返回的 0 1 2 等转换为相应的中文字段，也可以对后端返回的一些怪异的时间格式进行处理！

2024-06-21 10:05:16 302

原创祖传代码，请勿乱动打印

" ----------------------- 祖传代码 ----- 请勿乱动 ------------------------------ ")

2024-06-19 10:42:44 594

原创 Vuex相关的

首先vuex的出现是为了解决web组件化开发的过程中，各组件之间传值的复杂和混乱的问题将我们在多个组件中需要共享的数据放到start中，要获取或格式化数据需要使用getters，改变start中的数据，可以使用mutation，但是只能包含同步的操作，在具体组件里面调用的方式Action也是改变store中的数据，不过是提交的mutation，并且可以包含异步操作，在组件中的调用方式；在actions里面使用的commit('调用mutation')

2024-06-07 11:37:59 832

原创解决跨域问题

跨域的手段有很多, 主要了解3种解决方案JSONPCORS服务器代理( webpack代理, Nginx反向代理 )JSONP经典跨域解决方案, 利用标签不受同源策略限制的特性, 网页可以得到从其他来源动态产生的 JSON 数据, 实现跨域效果, JSONP请求一定需要对方的服务器做支持才可以。优点实现简单兼容性好, 可用于解决主流浏览器的跨域数据访问的问题。缺点只支持 GET 请求 ( 因为标签只能发送 GET 请求 )

2024-06-07 11:33:00 814

原创数组去重的方法（原生JS）for in 和 for of 的区别

3. for嵌套for，然后splice去重（ES5中最常用）2. ES6 Set去重（ES6中最常用）

2024-06-06 10:17:38 256

原创 ES6中的class类及递归

6.3 如果子类想要继承父类的方法，同时在自己内部扩展自己的方法，利用 super 调用父类的构造函数，super 必须在子类 this 之前调用。3. constructor 函数，只要 new 生成实例时，就会自动调用这个函数，如果我们不写这个函数，类也会自动生成这个函数。6.2 继承中，如果子类没有，就去查找父类有没有这个方法，如果有，就执行父类的这个方法（就近原则）6.1 继承中，如果实例化子类输出一个方法，先看子类有没有这个方法，如果有就先执行子类的。4. 多个函数方法之间不需要添加逗号分隔。

2024-06-06 10:14:47 399

原创常见的布局方法及优缺点

页面布局常用的方法有浮动、定位、flex、grid网格布局栅格系统布局浮动：优点：兼容性好。缺点：浮动会脱离标准文档流，因此要清除浮动。我们解决好这个问题即可。绝对定位优点：快捷。缺点：导致子元素也脱离了标准文档流，可实用性差。flex 布局（CSS3中出现的）优点：解决上面两个方法的不足，flex布局比较完美。移动端基本用 flex布局。网格布局（grid）CSS3中引入的布局，很好用。代码量简化了很多。利用网格布局实现的一个左右300px中间自适应的布局栅格系统布局。

2024-06-05 09:33:49 1122

原创浮动带来的影响及如何清除浮动

浮动会使元素脱离标准流,使元素浮在标准流之上,不占位置,使父元素的高度无法撑开,从而影响布局.(3)额外标签法: 在父元素的最后面添加一个块级标签,并使用 clear:both;浮动的出现是为了让块级元素在一行显示且无缝隙.(1)给父元素设置高度。

2024-06-05 09:30:39 212

原创 redux的工作流程

首先，我们看下几个核心概念：Store：保存数据的地方，你可以把它看成一个容器，整个应用只能有一个Store。State：Store对象包含所有数据，如果想得到某个时点的数据，就要对Store生成快照，这种时点的数据集合，就叫做State。Action：State的变化，会导致View的变化。但是，用户接触不到State，只能接触到View。所以，State的变化必须是View导致的。Action就是View发出的通知，表示State应该要发生变化了。

2024-06-04 15:13:54 181

原创浏览器是如何解析CSS选择器的

从右向左的匹配规则, 只有第一次会遍历所有元素找节点, 而剩下的就是在看父辈祖辈是否满足选择器的条件, 匹配效率大大提升!在生成渲染树的过程中，渲染引擎会根据选择器提供的信息来遍历 DOM 树，找到对应的 DOM 节点后将样式规则附加到上面。渲染引擎是怎么根据以上样式选择器去遍历这个 DOM 树的呢？是按照从左往右的选择器顺序去匹配，还是从右往左呢？遍历所有的后代元素后, 知道了, 整个子孙后代只有一个 h3。遍历所有的元素, 找有 .mod-nav 类的节点。的所有子孙节点, 去找。

2024-06-04 15:12:21 368

原创原型链、闭包、手写一个闭包函数、闭包有哪些优缺点、原型链继承

原型链是一种查找规则为对象成员查找机制提供一个方向因为构造函数的 prototype 和其实例的 __ proto __ 都是指向原型对象的所以可以通过__proto__查找当前的原型对象有没有该属性,没有就找原型的原型, 依次类推一直找到Object( null ) 为止这种链式查找过程称之为原型链闭包（closure）指有权访问另一个函数作用域中变量的函数。简单理解就是，一个作用域可以访问另外一个函数内部的局部变量。return fun;f();

2024-06-03 10:56:09 350

原创 js常用的数组方法 && js常用的字符串方法

带参调用时，需要提供一个比较函数，该函数比较两个值，返回一个用于说明这两个值的相对顺序的数字。通过删除或替换现有元素或者原地添加新的元素来修改数组，并以数组形式返回被修改的内容，此方法会改变原数组，由于被删除的元素组成了一个数组，如果只删除了一个元素，则返回只包含一个元素的数组。将一个数组或一个类数组对象的所有元素连接成一个字符串，并返回这个字符串。判断一个数组是否包含一个指定的值，根据情况，如果包含返回 true ，不包含返回 false。此方法不会改变现有的数组，而是返回一个新数组。

2024-06-03 10:52:00 511

原创回流和重绘如何避免？

每个页面都至少有一次回流，就是在页面第一次加载的时候，这时候是一定会发生回流的，因为要构建 render 树，在回流的时候，浏览器会使渲染树中受到影响的部分失效，并重新构造这部分渲染树，完成回流后，浏览器会重新绘制受影响的部分到屏幕中，该过程成为重绘；2.尽量避免用 table 布局（ table 元素一旦触发回流就会导致 table 里面所有的其他元素回流）重绘不一定需要回流（比如颜色的改变），但回流必然会触发重绘（比如改变 div 的位置）3.元素的尺寸、位置发生改变（边距、宽高）

2024-05-31 16:03:01 329

原创浏览器/html页面渲染过程

1.给 script 标签添加 defer 属性，适用于 js 中涉及到 dom 的操作，或者与其他的 js 有相互引用的关系，添加 defer 属性会将 javascript 脚本延迟执行，但是 html 解析过程中遇到 script 标签仍然会进行下载。2. defer 脚本会在 dom 解析完成后， DOMContentloaded 事件调用前执行，而且 defer 属性的 js 脚本会按照顺序执行，即在 dom 解析完成后会依次执行 script 标签。1. dom 树和 css 树的先后顺序。

2024-05-31 15:46:07 494

原创 js 的执行机制 / 事件循环机制 / event loop

不进入主线程而进入“任务队列”（task queue）的任务，只有“任务队列”通知主线程，某个异步任务可以执行了，该任务才会进入主线程执行。js 是一个单线程的，如果有一些高耗时操作就会带来进程组塞的问题，为了解决这问题， js 有两种任务执行模式：同步模式和异步模式。ES6规范中宏任务（macro - task ）是由宿主浏览器或node发起的，而微任务（ jobs ）是由 js 自身发起的。在主线程上排队执行的任务，只有前一个任务执行完毕，才嫩执行后一个任务。同步模式下创建的同步任务是立即执行的。

2024-05-30 10:48:04 345

原创 promise

3.在这个函数的原型上用 prototype . then ，上面挂一个函数，指定 promise 成功 / 失败的回调函数，函数的返回值是一个新的 promise 对象。1. then 方法本身会返回一个新的 promise 对象，返回一个新的 promise 以后他就有自己的 then 方法，这样就能实现无限的链式。4.如果返回的是另一个新的 promise ,此 promise 的结果就会成为新 promise 的结果。

2024-05-30 10:35:32 1677

原创组件中的data为什么要定义成一个函数, 返回值是一个对象？动态给vue的data添加一个新的属性时会发生什么？怎样解决？

对象为引用类型，当复用组件时，由于数据对象都指向同一个data对象，当在一个组件中修改data时其他重用的组件中的data会同时被修改，而使用返回对象的函数，由于每次返回的都是一个新对象（Object的实例），引用地址不同，则不会出现这个问题。

2024-05-29 14:44:38 387 1

原创 vue中计算属性computed和watch的区别是什么？

它们之间最重要的区别就是：计算属性不能执行异步任务，计算属性必须同步执行（定义的函数接收 return 的结果，return 属于同步执行的，是没办法拿到异步请求结果的）也就是说计算属性不能像服务器请求或执行异步任务。watch主要用于监控vue实例的变化，它监控的变量必须在data里面声明，它可以监控一个变量或者对象，一般用于监控路由、input输入框的值特殊处理等，它比较适合的场景是一个数据影响多个数据，它不具有缓存性。deep ：代表深度监控，不仅监控对象的变化，也监控对象中属性变化。

2024-05-29 14:20:58 251

原创解构赋值！

定义函数参数默认值：function Func ( { x = 1 , y = 2 } = { } ) { }对象解构： function Func （ { x = 0 ，y = 1 } = { } ）{ }改名： const { x , y : z } = { x:1 , y : 2 }形式： const { x , y } = { x:1 , y: 2 }默认：const { x , y = 2 } = { x:1 }形式：const [ x , y ] = [ 1 , 2 ]

2024-05-27 10:22:48 397

原创什么是插件 /Vue.use()

7.一个库，提供自己的API ，同时提供上面提到的一个或多个功能。如 vue-router。6.添加 vue 实例方法，通过把他们添加到 Vue.prototype 上实现。Vue.use（）的参数类型必须是 object 或 Function。如 vue-custom-element。2.添加全局资源：指令/过滤器/过度等。如 vue-touch。如 vue-router。3.添加全局公共组件 Vue.component( ）4.添加全局公共指令 Vue.directive( )

2024-05-24 10:44:22 290

原创 Vue组件通信 - 组件传值 / 什么是组件

2.调试方便，由于整个系统是通过组件组合起来的，在出现问题的时候，可以用排除法直接移除组件，或者根据报错的组件快速定位问题，之所以能够快速定位，是因为每个组件之间的低耦合，职责单一，所以逻辑会比分析整个系统要简单。每个组件之间都有独立的作用域，组件间的数据是无法共享的，但在实际开发中我们常常需要让组件之间共享数据，组件通讯可以让它们之间能进行通讯，这样才能构成完整的系统。数据提升：A修改B，把B中的数据提升到公共的父组件里面，A通过子传父修改父亲的数据，父亲通过父传子传递把数据传递到B。

2024-05-24 10:31:54 476

原创前端路由原理及hash模式和history模式和Abstract模式

路由模块的本质就是建立起url和页面之间的映射关系，“更新视图但不重新请求页面”是前端路由原理的核心之一，目前在浏览器环境中这一功能的实现主要有两种方式：利用 url 中的hash('#') 和利用History在 Html5中新增的方法。在history模式中url就像正常的url,不过这种模式需要后台配置的支持，因为我们的应用是个单页客户端应用，如果后台没有正确的配置，当用户在浏览器中直接访问的时候就会返回404；前端路由的核心在于改变视图的同时不会向后端发出请求，而是去加载路由对应的组件；

2024-05-23 11:54:23 1163