马农莎的博客

原创 wsl1-＞wsl2配置

wsl->wsl2配置好了，关机重启打不开了？

原创 js执行顺序

console.log(1);setTimeout(function() {console.log(2);}, 0);var promise = new Promise(function (resolve, reject) {resolve();});promise.then(function() {console.log(3);}).then(function() {console.log(4);});console.log(5);console.log(‘golb1’);se

转载 big.js 方法实现源码

在我们常见的JavaScript数字运算中，小数和大数都是会让我们比较头疼的两个数据类型。在大数运算中，由于number类型的数字长度限制，我们经常会遇到超出范围的情况。比如在我们传递Long型数据的情况下，我们就只能把它转换到字符串进行传递和处理。而在小数点数字进行运算的过程中，JavaScript又由于它的数据表示方式，从而导致了小数运算会有不准确的情况。最经典的一个例子就是0.3-0.2，并不等于0.1，而是等于0.09999999999999998。首先，让我们来看下，big.js这个库到底是

转载 运行RN项目报错Error: listen EADDRINUSE: address already in use :::8080

这是端口被占用了 解决办法如下netstat -ano // 在终端也就是命令行中输入 去找到你项目的被占用的端口号1例如我的是8080的端口 然后记住最右边的数字在命令行继续输入tskill 19144 // 这样就杀死了这个端口号的进程1再去重新运行你的项目就好了...

翻译 big.js——一个用于任意精度十进制算术的小型快速 JavaScript 库。

特点简单的API比Java的BigDecimal的JavaScript版本更快、更小、更易于使用仅缩小了6KB复制JavaScript数字的toExponential、toFixed和toPrecision方法以可访问的十进制浮点格式存储值全面的文档和测试集没有依赖关系仅使用ECMAScript 3，因此适用于所有浏览器安装该库是单个 JavaScript 文件big.js或 ES 模块big.mjs。Browsers将 Big 添加到全局范围：< script src =

原创 iphone日期转换显示NaN

var newDate = new Date(“2020-12-28 15:00:00”)这种获取的时间在安卓手机上显示是正常的，在苹果手机上显示NaNvar newDate = new Date(“2020/12/28 15:00:00”)这种获取的时间在安卓和苹果手机上都显示正常转换时间格式 .replace(/-/g, “/”)var newDate = new Date(“2020/12/28 15:00:00”.replace(/-/g, “/”))...

原创 如何将 HTML 转换为 XHTML

添加一个 XHTML <!DOCTYPE> 到你的网页中添加 xmlns 属性添加到每个页面的html元素中。改变所有的元素为小写关闭所有的空元素修改所有的属性名称为小写所有属性值添加引号

原创 csrf、xss攻击总结

CSRF攻击原理及过程如下：用户C打开浏览器，访问受信任网站A，输入用户名和密码请求登录网站A；2.在用户信息通过验证后，网站A产生Cookie信息并返回给浏览器，此时用户登录网站A成功，可以正常发送请求到网站A；用户未退出网站A之前，在同一浏览器中，打开一个TAB页访问网站B；网站B接收到用户请求后，返回一些攻击性代码，并发出一个请求要求访问第三方站点A；浏览器在接收到这些攻击性代码后，根据网站B的请求，在用户不知情的情况下携带Cookie信息，向网站A发出请求。网站A并不知道该

原创 设置disable字体颜色不显示

设置disable之后，字体默认灰色.green {color: rgb(39, 167, 22);opacity: 1;-webkit-text-fill-color: rgb(39, 167, 22);}

转载 关于this.setState( )中的数据延迟问题

原文链接：http://www.javashuo.com/article/p-tktyurtu-gh.html1.全局变量2.回调函数3.componentDidUpdate4.setTimeOutsetState这个过程当中发生了什么：1.浏览器将setState传入的partialState参数存储在当前组件实例的state暂存队列中。2.判断当前React是否处于批量更新状态，若是是，将当前组件加入待更新的组件队列中。3.若是未处于批量更新状态，将批量更新状态标识设置为true，用事务

转载 sort排序

原文链接https://www.jianshu.com/p/6968f71ed5dfvar objs = [{name: ‘B’, num: 9},{name: ‘C’, num: 2},{name: ‘D’, num: 4},{name: ‘B’, num: 5},{name: ‘C’, num: 9},{name: ‘E’, num: 6},{name: ‘F’, num: 4},{name: ‘F’, num: 12}];objs.sort((star,next)=>{/

转载 react动态改变css样式

原文链接： https://blog.youkuaiyun.com/weixin_44638823/article/details/114287219用到的是方式二，首先处理数据，存入state调用方法返回样式效果如下：

原创 console.log(e)报错event.persist().

This synthetic event is reused for performance reasons. If you’re seeing this, you’re accessing the property target on a released/nullified synthetic event. This is set to null. If you must keep the original synthetic event around, use event.persist().解决：

原创 react dangerouslySetInnerHTML

转载 判断自然数

function isNaturalNum(num) {if (typeof num !== ‘number’) return false;if (Number.isNaN( num )) return false;if ( (1 / num) < 0 ) return false;if (num < 0) return false;return true;}————————————————版权声明：本文为优快云博主「忽略我的表情」的原创文章，遵循CC 4.0 BY-SA版权协

原创 计算日期差

let workHours = ''if (!unloadDate) { workHours = ''} else { const duration = moment.duration(moment(unloadDate).diff(moment(onSceneDate))) const hours = duration.get('hours') const mins = duration.get('minutes') if (!hours || !mins) { workH

原创 treeselect

treeDefaultExpandAll默认是否展开treeNodeLabelProp显示选中后的select里面的内容

转载 react报错：Can‘t perform a React state update on an unmounted component

react报错：Can’t perform a React state update on an unmounted componentcomponentDidMount = () => {$.ajax(‘你的请求’,{}).then(res => {this.setState({data: datas,});}).catch(error => { });}componentWillUnmount = () => {this.setState = (stat

原创 react setState

我用了这个解决方案。如果您有这样的嵌套状态：this.state = {formInputs:{friendName:{ value:'', isValid:false, errorMsg:''},friendEmail:{ value:'', isValid:false, errorMsg:''}}}您可以声明handleChange函数，该函数复制当前状态并使用更改后的值重新分配它handleChange(el) {let inputN

原创 TS+antd form核心代码

import { Form } from ‘antd’;import { FormComponentProps } from ‘antd/lib/form’;interface UserFormProps extends FormComponentProps {age: number;name: string;}class UserForm extends React.Component<UserFormProps, any> {// …}const App = Form.cr

原创 运行项目Error

npm install -g cross-env解决： ‘cross-env’ 不是内部或外部命令，也不是可运行的程序Error: Cannot find module ‘react-dev-utils/chalk’解决：npm install -g cnpm -registry=https://registry.npm.taobao.orgnpm install cnpm

原创 Symbol命名

let sy = Symbol(“key1”);// 写法1let syObject = {};syObject[sy] = “kk”;console.log(syObject); // {Symbol(key1): “kk”}// 写法2let syObject = {[sy]: “kk”};console.log(syObject); // {Symbol(key1): “kk”}// 写法3let syObject = {};Object.definePropert

原创 react-router

控制路由跳转:{BrowserRouter,HashRouter} from ‘react-router-dom’import { NavLink ,Switch,Route} from ‘react-router-dom’AboutHome//引入About、Home组件Redirect（重定向）web-vitals是什么web-vitals是Google发起的，旨在提供各种质量信号的统一指南，我们相信这些质量信号对提供出色的网络用户体验至关重要。其可获取三个关键指标（CLS、F

原创 2021-09-30学习资料链接

面试常见问题：https://www.bilibili.com/video/BV1At41137DG?p=15&spm_id_from=pageDriver

原创 2021-09-30笔记

WithRouter的作用和一个简单应用作用：把不是通过路由切换过来的组件中，将react-router 的 history、location、match 三个对象传入props对象上React.lazy来实现React组件的懒加载JavaScript call() 方法call() 方法是预定义的 JavaScript 方法。它可以用来调用所有者对象作为参数的方法。通过 call()，您能够使用属于另一个对象的方法。本例调用 person 的 fullName 方法，并用于 person1：

原创 node、vscode、react安装使用

vscode使用教程：http://i5ting.github.io/vsc/#10703快捷键：https://www.cnblogs.com/bindong/p/6045957.htmlnode、npm安装教程：https://blog.youkuaiyun.com/weixin_36732046/article/details/95884577

转载 时间复杂度、空间复杂度

一、时间复杂度我们想要知道一个算法的「时间复杂度」，很多人首先想到的的方法就是把这个算法程序运行一遍，那么它所消耗的时间就自然而然知道了。这种方式可以吗？当然可以，不过它也有很多弊端。这种方式非常容易受运行环境的影响，在性能高的机器上跑出来的结果与在性能低的机器上跑的结果相差会很大。而且对测试时使用的数据规模也有很大关系。再者，并我们在写算法的时候，还没有办法完整的去运行呢。因此，另一种更为通用的方法就出来了：「 大O符号表示法 」，即 T(n) = O(f(n))我们先来看个例子：for(i=

原创 BAIDU面试

JS事件循环JSP跨域标签点击事件后的操作什么是BFCCSS清除浮动的几种方法

转载 XSS跨站攻击

浏览器的同源策略限制了一些跨域行为，但仍有些特例（img、iframe、script标签）不受跨域限制，这就给XSS攻击创造了机会（这完全不是同源策略的锅，一定是程序员的锅）。在讲下面的内容前，还是要提一下Cookie，Cookie是用来辨别用户身份的重要依据。来做个形象的比喻，有一天，小A去了一家新开的理发店，店里的托尼老师不认识小A，于是小A就办了一张VIP卡，当小A第二次去这家理发店的时候，店里的托尼老师刷了下小A的卡，想起来了你是小A啊，今天搞什么样的造型啊~ Cookie就是那张VIP卡，用于辨

转载 VUE生命周期

$set 的深入理解众所周知，Vue 双向数据绑定的原理是通过遍历data属性，利用Object.definePrototype将其转化成setter/getter,但是由于现代js的限制以及object.observe的限制，vue无法检测到对象属性的添加或删除。具体场景如下<li v-for=’(item,key) in list’ :key=“item.id” @click=“clicks(item)” :class=“item.checked===‘0’?‘red’:‘blue’”&g

转载 VUE响应式原理

1.响应式原理在生成vue实例时，为对传入的data进行遍历，使用Object.defineProperty把这些属性转为getter/setter.Object.defineProperty 是 ES5 中一个无法 shim 的特性，这也就是 Vue 不支持 IE8 以及更低版本浏览器的原因。每个vue实例都有一个watcher实例，它会在实例渲染时记录这些属性，并在setter触发时重新渲染。Vue 无法检测到对象属性的添加或删除Vue 不允许动态添加根级别的响应式属性。但是，可以使用 Vu

原创 先序遍历、中序遍历、后序遍历

typedef struct TreeNode{int data;TreeNode * left;TreeNode * right;TreeNode * parent;}TreeNode;void pre_order(TreeNode * Node)//前序遍历递归算法{if(Node == NULL)return;printf("%d “, Node->data);//显示节点数据，可以更改为其他操作。在前面pre_order(Node->left);pre_orde

转载 字节排列顺序

不同的机器可能会使用不同的字节排序方法来存储数据。”big endian“（高位优先）将最重要的字节放在地址最低的存储器单元。而”little endian“（低位优先）则是将最重要的字节放在地址最高的存储器单元。当存储量大于一个字节时，想int float等，就要考虑字节顺序问题了。ByteBuffer 是以高位优先的形式存储数据的，并且数据在网上传送时也常常使用高位优先的形式。我们可以使用带有参数ByteOrder.BIG_ENDIAN 或ByteOrder.LITTLE_ENDIAN的order()方

原创 浏览器解码

转载 LayUI栅格布局

栅格系统为了丰富网页布局，简化 HTML/CSS 代码的耦合，并提升多终端的适配能力，layui 在 2.0 的版本中引进了自己的一套具备响应式能力的栅格系统。我们将容器进行了 12 等分，预设了 4*12 种 CSS 排列类，它们在移动设备、平板、桌面中/大尺寸四种不同的屏幕下发挥着各自的作用。一、栅格布局规则：采用 layui-row 来定义行，如：采用类似 layui-col-md* 这样的预设类来定义一组列（column），且放在行（row）内。其中：变量md 代表的是不同屏幕下的标记（

原创 JQuery-slideToggle

原创 基本选择器、DOM操作

原创 JQuery筛选选择器

原创 JSON类型转换

Object转字符串：Stringify字符串转Object：parse

转载 setTimeout和setInterval

基本知识setTimeout(fn,t),超时调用，超过时间t，就执行fn。setInterval(fn,t),间歇调用，调用周期t，执行fn。二者调用后，均返回一个数值ID，此ID是计划执行代码的唯一标识符，可以通过它来取消尚未执行的调用。clearTimeout(id)和clearInterval(id)。取消间歇调用的重要性要远远高于取消超时调用，因为在不加干涉的情况下，间歇调用将会一直执行到页面卸载。重点JS是一个单线程的解释器，因此一段时间内只能执行一段代码。为了要控制执行的代码，就有