G294992891的博客

拿来即用的js方法工具

G294992891 — Wed, 12 Jul 2023 12:50:08 +0800

getLastDate(new Date('2023-03-04' )) // Fri Mar 31 2023 00:00:00 GMT+0800(中国标准时间)

React性能优化之路

G294992891 — Fri, 30 Dec 2022 13:48:29 +0800

react性能优化

回顾babel历程，展望babel8

G294992891 — Tue, 11 May 2021 16:07:54 +0800

babel 来自巴别塔的典故：当时人类联合起来兴建希望能通往天堂的高塔，为了阻止人类的计划，上帝让人类说不同的语言，使人类相互之间不能沟通，计划因此失败，人类自此各散东西。此事件，为世上出现不同语言和种族提供解释。这座塔就是巴别塔。这个巴别塔的典故很符合 babel 的转译器的定位 babel 的编译流程 babel 从最初到现在一直的目的都很明确，就是把源码中的新语法和 api 转成目标浏览器支持的。它采用了微内核的架构，整个流程比较精简，所有的转换功能都是通过插件来完成的。 babel

webapck练习和总结

G294992891 — Fri, 05 Mar 2021 14:48:37 +0800

第一 webpack 正确安装方式笔记：首先安装webpack避免全局安装，应该在当前项目安装，否则会导致版本不一样会发生不一样的错误。 npx webpack -v 查看webpack安装的版本号和webpack-cli npm info webpack 查看webpack版本号注意：webpack4.25.1版本配合webpack-cli3.1.2在npx webpack index.js 打包成功 webpack5.24.2版本在npx webpack index.js 不能打包成功会出现意

22个超详细的 JS 数组方法

G294992891 — Sat, 06 Feb 2021 00:44:27 +0800

数组是 js 中最常用到的数据集合，其内置的方法有很多，熟练掌握这些方法，可以有效的提高我们的工作效率，同时对我们的代码质量也是有很大影响。一、创建数组 1.使用数组字面量表示法 var arr4 = []; //创建一个空数组 var arr5 = [20]; // 创建一个包含1项数据为20的数组 var arr6 = ["lily","lucy","Tom"]; // 创建一个包含3个字符串的数组 2.使用 Array 构造函数无参构造 var arr1 = new Arra.

JS小技巧提升代码质量

G294992891 — Mon, 25 Jan 2021 16:23:15 +0800

Javascript 常用代码优化和重构的方法简介提炼函数合并重复的条件片段把条件分支语句提炼成函数合理使用函数提前让函数退出代替嵌套条件分支传递对象参数代替过长的参数列表少用三目运算符合适使用链式调用分解大型类活用位操作符纯函数 1. 提炼函数好处：避免出现超大函数。独立出来的函数有助于代码复用。独立出来的函数更容易被覆写独立出来的函数如果拥有一个良好的命名，它本身就起到了注释的作用。语义化将多段分离的逻辑放在不同的函数中实现，可以使代码逻辑清晰，清楚的看到.

项目中的图片跨域问题解决方式

G294992891 — Mon, 16 Nov 2020 22:27:16 +0800

现象首先，在生产环境中，由于进行编辑图片时，将图片回显到ReactCrop组件中进行可裁剪编辑，然而回显时，需要将图片转化为base64的格式或者blob对象, 此时需要将图片次绘制成canvas进行裁剪，但是，就会出现图片的跨域问题，图片不在一个域下的话，使用 canvas 会污染画布，所以就不行啦！！！！不过这个其实是需要后端在服务端进行配置就好了，但是前端要硬抗的话，那只能含着泪解决吧！图示解决方案一因为在本地进行图片回显的时候就已经跨域了，所以为了保证在同一域的环境进行处理图片显示的

css篇-盒子模型理解

G294992891 — Sun, 08 Nov 2020 21:11:19 +0800

前言在CSS 盒子模型的默认定义里，你对一个元素所设置的width与height只会应用到这个元素的内容区。如果这个元素有任何的border或padding，绘制到屏幕上时的盒子宽度和高度会加上设置的边框和内边距值。这意味着当你调整一个元素的宽度和高度时需要时刻注意到这个元素的边框和内边距。语法： box-sizing属性被指定为下面列表中的关键字。属性值 content-box 默认值，标准盒子模型。width与height只包括内容的宽和高，不包括...

git stash恢复

G294992891 — Sun, 16 Aug 2020 20:49:22 +0800

背景：由于自己在切分支前，将已经改变的代码放到缓存里（git stash）然后切完分支后，忘了再释放出来（git stash pop），然后有觉的分支没有用，又把之前的分支也删除掉（把自己蠢到????），在webStorm也找不到自己改动的历史记录，所以为了弥补自己过的过失，还好有强大的git找到补救的办法！找删除记录，可以查看最近的一些删除的提交 git fsck --lost-found 实例： Dangling blob = 对暂存区域/索引所做的更改，但从未提交。Git的一个令人

关于光标定位引发基础知识缺陷

G294992891 — Mon, 10 Aug 2020 13:26:14 +0800

背景：由于在Safari浏览器浏览器中光标定位引发一列基础知识的缺陷认识。以此，对基础知识整理和练习。在光标定位时，有个方法是获取光标位置和获取的范围，这个方法就是 window.getSelection() selection对象 window.getSelection()，返回一个Selection对象，表示用户选择的文本范围或光标的当前位置。测试核心代码

关于setCapture和releaseCapture的理解和整理

G294992891 — Sun, 09 Aug 2020 01:04:09 +0800

setCapture 一. 什么是setCapture函数？ MDN解释：在处理一个 mousedown 事件过程中调用这个方法来把全部的鼠标事件重新定向到这个元素，直到鼠标按钮被释放或者 document.releaseCapture() 被调用。函数作用：程序中主要是要捕获onmousemove和onmouseup事件语法： element.setCapture(retargetToElement); 如果被设置为 true, 所有事件被直接定向到这个元素; 如果是 false, 事件也可以在这

浅谈css3属性will-change和user-select

G294992891 — Sun, 09 Aug 2020 01:03:32 +0800

1.will-change will-change提高页面动画等渲染性能,也告诉浏览器什么属性、什么元素将会发生变化，可以对这些操作进行可能性的优化，由此提高CSS动画的执行效率。属性值： auto: 实行标准浏览器优化。 scroll-position: 指明元素的滚动位置将会出现动画变化，浏览器应该为滚动视窗内容的不可见部分事先做好准备。 contents: 指明元素的内容将会发生变化，浏览器不要缓存它们的内容。 : 表示开发者希望在不久后改变指定的属性名或者使之产生动画。如果属性名是简写，则

node内存溢出问题

G294992891 — Sun, 09 Aug 2020 01:02:31 +0800

一、现象描述由于项目在运行或者项目打包时突然停止build项目或者崩溃掉，工作台会频繁报出内存溢出报出：FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory 二、为什么Nodejs内存会溢出？要明白node内存溢出的原因，先了解一下node内存机制。下面简单介绍node机制和原理（介绍node原理较浅浅，详细内容请看：Nodejs官网） 1、V8的内存机制内存的分配一切J

同一工程中，如何将两个git项目合并到一块？

G294992891 — Sun, 09 Aug 2020 00:57:36 +0800

合并两个远程项目-西门子为例西门子的代码是通过 git fork 切出去的。在西门项目中合并远程燕千云iam项目代码时，先查看当前西门子项目远程状态 git remote -v 例如： git remote -v origin http://gitlab.cloopm.com/yanqiancloud/siemens/frontend/siemens-op-yqcloud-front-iam.git (fetch) origin http://gitlab.cloopm.com/yanqian