![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端JS
WeRaceAsOne
这个作者很懒,什么都没留下…
展开
-
ReactDOM.createPortal
ReactDOM.createPortal。原创 2022-11-30 11:10:56 · 789 阅读 · 0 评论 -
new urlSearchParams
URLSearchParams构造函数 通过new实例化,并传入查询的字符串。URLSearchParams上的方法。原创 2022-11-29 12:13:55 · 3326 阅读 · 3 评论 -
JS LRU算法实现
JS LRU算法实现。原创 2022-11-24 12:42:58 · 120 阅读 · 0 评论 -
平铺数据转化成树
平铺数据转化成树原创 2022-11-16 17:55:31 · 212 阅读 · 0 评论 -
偏移量获取方式兼容
微信环境下 document.documentElement.scrollTop获取不到值兼容大多数浏览器设置scrollTop的方法:设置scrollTop的值,兼容大多数浏览器原创 2022-07-18 17:54:12 · 178 阅读 · 0 评论 -
React报错:Minified React error #152
Minified React error #152; visit https://reactjs.org/docs/error-decoder.html?invariant=152&args[]=xe for the full message or use the non-minified dev environment for full errors and additional helpful warnings. 报错react 官方文档给出的解释:render里什么也没有返回 ,注意检查一下原创 2021-06-01 19:02:23 · 2515 阅读 · 0 评论 -
redux和mobx对比
1.为什么需要使用 redux或者mobx? (react 单向数据流)2.redux或者mobx解决了什么痛点?(跨组件通信)3.redux 原理(函数式编程,严格的工程化思想)4.mobx原理(面向对象,观察者模式)原创 2021-05-16 14:59:09 · 6248 阅读 · 0 评论 -
滚动加载问题
问题描述下拉选带滚动加载功能的组件,在分辨率低的屏幕上,无法加载下一页数据问题原因知识点介绍:scrollHeight,offsetHeight, scrollTop 概念更多属性可参考:https://blog.csdn.net/lhjuejiang/article/details/79492290scrollHeight:内容高度 + 内边距,这个内容包括肉眼看不见、溢出、被窗口遮挡的部分offsetHeight: 元素内容+内边距+边框。不包括外边距和滚动条部分,返回值是一个整数,单原创 2021-03-27 21:47:37 · 102 阅读 · 0 评论 -
React class里setTimeOut里setState不会批量更新
先看下这段代码:import React from 'react'export default class HK extends React.Component{ constructor(props){ super(props) this.state = { val: 0 } } componentDidMount(){ this.setState({val:this.state.val原创 2021-02-23 13:43:46 · 1297 阅读 · 0 评论 -
如何理解react中的super(),super(props)
转载:https://www.cnblogs.com/itgezhu/p/11199313.html1.constructor( )-----super( )的基本含义constructor( )——构造方法 这是ES6对类的默认方法,通过 new 命令生成对象实例时自动调用该方法。并且,该方法是类中必须有的,如果没有显示定义,则会默认添加空的constructor( )方法。super( ) ——继承 在class方法中,继承是使用 extends 关键字来实现的。子类 必须 在 con转载 2021-02-19 19:02:26 · 1479 阅读 · 0 评论 -
实现flat
const arr = [1,2,3,[4,5,6,[7,8,9]] 平铺成一层结构[1,2,3,4,5,6,7,8,9]const newArr = []function flatten(arr){ arr.forEach(item => { if(Array.isArray(item)){ flatten(item) return } newArr.push(item) }) return newArr}原创 2021-01-26 16:51:24 · 163 阅读 · 0 评论 -
JS 数组求和几种方法
求和数组为 const arr = [1,2,3,4,5]递归方法function sum(arr){ if(arr.length === 0){ return 0; }else if(arr.length === 1){ return arr[0]; }else{ return arr[0]+sum(arr.slice(1)); }}使用reduceconst sum = arr.reduce((total, curValue) => total + curV原创 2021-01-19 21:00:32 · 371 阅读 · 0 评论 -
阮一峰ES6学习笔记
1. let和const1.let 和 const不存在变量提升问题;2.let 负责定义变量、const 负责定义常量;3.二者在同一作用域内(即{}内) 不允许重复声明同一变量名;4.const 声明后需立即赋值,不然会报错;5.使用lett定义变量时,该变量不允许使用,此区间称为 暂存性死区// 暂存性死区 if (true) { // TDZ开始 tmp = 'abc'; // ReferenceError console.log(tmp); // ReferenceErr原创 2021-01-14 21:53:40 · 5436 阅读 · 0 评论 -
数组的反转
和我们用到的Array.reverse()效果一样 function reverse(arr){ for(let i=0;i<arr.length/2;i++){ let temp = arr[i] arr[i] = arr[arr.length-1-i] arr[arr.length-1-i] = temp } return arr } const demo = [1,2,3,4,5,6] reverse(原创 2020-09-15 22:18:11 · 270 阅读 · 0 评论 -
转驼峰命名
get-element-by-id转成GetElementById const str = 'get-element-by-id' function upperCase(str,method){ let temp = str.split(`${method}`) for(let i = 0;i < temp.length; i++){ temp[i] = temp[i].charAt(0).toUpperCase()+temp[i].substr(1原创 2020-09-15 20:36:52 · 130 阅读 · 0 评论 -
函数节流与防抖
函数防抖原理:采用定时器,触发方法后,在n秒以内,多次触发该方法时,该方法只会执行一次,并且每次触发时都会重新计时。例如,公交司机关车门,在乘客上车后,司机会等待几秒看看是否有下一秒乘客上车,如果有,在下一名乘客上车后,还会等待几秒,看看是否有下下一名乘客要上车,直到等待几秒后,没有乘客继续上车,才会关闭车门。用途:浏览器窗口大小改变,重新渲染页面;输入框检验手机号、邮箱地址格式是否正确;代码:以页面滚动加载为例(从头到底)function debounce (callback, delay){原创 2020-08-11 10:05:15 · 111 阅读 · 0 评论 -
js事件轮询机制
Q:js为什么是单线程?A:如果前一秒对dom元素进行了删除操作,下一秒又对该元素进行了赋值,如果是多线程的话,浏览器在解析的时候不知道该怎么处理,单线程就不会出现这种歧异。(以上观点是个人理解哈,可能底层的设计有其他的考虑),既然是单线程就会出现另一个问题,每次只能执行一个任务,如果某个任务卡住了,剩下的都无法继续执行了,所以呢,异步任务就是用来解决这种情况的。举个例子:js的单线程——>每条车道只允许同时通过一辆汽车(JS主线程每次只能同时执行一个任务),假如3号车突然坏掉了,又只有这一条车原创 2020-09-03 11:37:36 · 690 阅读 · 0 评论 -
实现一个深拷贝
总结:深拷贝和浅拷贝 考察的实际上是对内存的理解 基本类型数据存在栈内存中,而对象,数组实际的存储位置是在堆内存中,但是它们的指针存在栈内存中,所以直接拷贝基本类型数据相当于在栈内存中新建一块内存进行存储,而拷贝对象、数组实际上是对其指针的指向进行了改变,相当于在栈内存中新建一块内存存放指针,而拷贝过来的数据和原数据都指向同一块堆内存的地址,所以会出现数据互相影响的问题。第一种 可以使用简单的方法JSONconst person = { name:'jack', age:'11'}const c原创 2020-08-27 10:48:13 · 369 阅读 · 0 评论 -
webpack中hash、chunkHash、contextHash区别
三者可以处理缓存hash :打包后生成的文件名后都会增加相同的一串hash码chunkHash:打包后生成的文件会根据是否存在依赖关系(即是否import其他模块,如果引入了其他模块则,打包后形成同一chunk块)若存在则打包后的文件会增加相同的hash码eg:index.js中 引入了index。...原创 2020-08-24 09:05:54 · 238 阅读 · 0 评论 -
console.log()和console.dir()区别
console.log() 会在浏览器控制台打印出信息console.log()可以显示一个对象的所有属性和方法log可以用于我们判断某个值或者确定某个对象里的内容dir可以用于我们判断某个函数是否拥有某个属性或方法...原创 2020-08-13 10:22:35 · 323 阅读 · 0 评论 -
多层数组平铺展开
flat(x) x为变量 当为空时 默认展开一层,x规则为 要展开数组长度减1 ,结果不影响原数组,如果原数组有空位,flat()方法会跳过空位。var arr = [1,2,3,[11,22,33,[111,222,333]]]arr.flat() // [1, 2, 3, 11, 22, 33, Array(3)] x为空arr.flat(2) // [1, 2, 3, 11, 22, 33, 111, 222, 333] x为2 arr数组长度减1如果原数组有空位,flat()方法原创 2020-08-17 10:04:33 · 1049 阅读 · 0 评论 -
react 中使用防抖函数获取值时 控制台提示use event.persist()
想异步访问事件属性,需要在事件上调用event.persist(),此方法会从池中移除合成事件,允许用户代码保留对事件的引用。同时需要注意此时this的指向问题。react文档:event.persist()原创 2020-08-14 14:40:31 · 550 阅读 · 0 评论 -
数组对象去重
数组对象去重有多种方法,本方法为冒泡方法去重根据对象id去重var arrs = [{id:1,name:‘che’},{id:2,name:‘wang’},{id:3,name:‘li’},{id:1,name:‘lin’},]function Dupremove(arr){for(var i = 0;i<arr.length;i++){for(var j = i+1;j<arr.length;j++){if(arr[i].id===arr[j].id){arr.spl原创 2020-08-06 10:18:23 · 146 阅读 · 0 评论 -
js 实战小技巧
ES6 过滤数组唯一值通过扩展运算符…和 ES6 新增的 Set 生成一个新的数组,该数组只存在唯一元素var arr = [1,1,2,3,3,3,4,5,5]var arrs = [...Set(arr)]console.log(arrs)JS 对象数组(Json)根据某个共同的字段进行分组处理元数据格式[ {"id":"001","name":"Jack","Value":"111"}, {"id":"001","name":"Jack","Value":"111"},原创 2020-08-04 14:21:56 · 371 阅读 · 0 评论