3 haoyanyu_

尚未进行身份认证

我要认证

暂无相关简介

等级
TA的排名 4w+

React Hook之useState、useReducer的使用和源码分析

React Hook16.8以前一般使用类组件或者函数组件;前者有完整的生命周期API,可以管理组件状态,但是this指向在使用时需要格外注意一;一般通过HOC实现复用;通过shouldComponentUpdate()或者PureComponent组件进行性能优化,防止不必要的更新。后者是函数组件,一般是传入的数据进行展示,没有生命周期,只有props,是无状态组件;16.8以后新增了React Hook特性,它是函数组件,但是通过hook钩子可以管理内部状态,而且可以调用生命周期;通过钩子的

2020-05-25 19:35:01

make命令的简单用法

最近发现公司已有项目中有个Makefile文件,构建项目用的。以前好像在Linux系统里见到过下面就通过项目里makefile文件的配置内容学习记录一下make是怎么用的。make基本规则语法# 定义规则target: prerequisities[tab] commands# 执行make targettarget: 要生成的文件名或伪目标(只要target在当前目录下不存在,就会构建,否则执行命令也不会有任何反应)prerequisite: 前置条件(重新构建的判断依据,只要这两

2020-05-11 18:36:13

给大金额数字添加逗号分隔符

方法一:思路:split()方法截取整数部分,整数部分reverse()后,每隔三位插入一个逗号,最后一个三位不加逗号。方法二:利用正则/** * 格式化金钱格式 * @memberof module:money * @param {number} value 待格式化的金额数字 * @param {boolean} cent 是否是分 * @param {boolean} showComma 是否显示千分位逗号 * @returns {string} 格式化

2020-05-09 09:58:57

typescript学习重难点总结--可索引类型,interface, type, 泛型, keyof,工具泛型等

ts代码编译原理核心原则之一:对值所具有的结构进行类型检查(鸭式辩型)ts数据类型ts的数据类型基础的有string, number, boolean, any, null, undefined, never, 数组类型等等等。ts里还有一些内置类型例如在html中DOM元素的一些类型,实现复制功能时用到过HTMLTextAreaElement, Selection,Range等点击...

2020-04-23 15:13:44

typescript基础——泛型

泛型定义指在定义函数,接口或者类的时候,不预先指定具体的类型,在使用的时候再指定类型的一种特性;使用例如:定义一个函数,创建指定长度和值的数组function createArray(len: number, value: any): Array<any> {}这样写的缺点是,没有准确的定义返回值的类型使用泛型修改一下:function createArray<T...

2020-04-20 17:48:33

css--实现img图片填充,剪裁效果

业务背景实现一个轮播图,轮播区域宽度自适应,高度100px; 图片分辨率由用户上传获得。为了让图片不变形,需要对图片进行居中裁剪。实现使用css的属性 object-fit: cover原理css可替换元素展示效果不是由css决定,是一种外部对象, 它们外观的渲染独立于csscss不会影响到其中内容的展示,只能改变它的位置,和内容在框里的位置或者定位方式。例如object-...

2020-04-20 14:48:34

typescript基础——函数

定义函数函数的输入输出要进行类型的定义,函数的参数一旦定义好以后,输入多或者少都是会编译报错的,返回类型也必须跟定义的一致;// 1function fun(a: string, b: number): number { return parseInt(a + b);}// 2 这种写法只对右侧的匿名函数进行了类型定义,左侧的funs只能通过类型推断得出const funs = ...

2020-04-11 18:11:12

typescript基础——数据类型和类型断言

typescript是一种给javascript添加特性的语言扩展。扩展功能包括:类型批注和编译时类型检查类型推断类型擦除接口枚举Mixin泛型编程名字空间元组Await变量声明let [变量名]: [数据类型] = 值数据类型any 任意类型声明为any的变量可以赋予任意类型的值不明确变量类型时使用;改写现有代码时,在编译时选择性的包含或者移除类型检...

2020-04-07 15:29:01

《css世界》笔记-文档流以及流的破坏与保护

《css世界》笔记何为“流”?“流”是CSS世界中的基本定位和布局机制;CSS世界构建的基石是HTML, html最具代表性的两个基石块级元素<div>, 内联元素<span>。流体布局: 就是利用元素“流”的特性实现的各类布局效果,因为“流”本身具有自适应特性。流体布局是自适应布局(凡是具有自适应特性的布局统称)的一种实现,例如表格布局设置为100%...

2020-04-06 23:00:26

mac上安装nvm管理node版本以及nvm如何设置node默认版本

安装curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.1/install.sh | bash验证输入nvm --version如果提示命令不存在可以重新打开终端试一下可能因为缺少.bash_profile文件运行touch ~/.bash_profile创建一个文件,输入一下内容export NVM...

2020-04-05 16:45:15

git push时,报错 Commit validation failed for commit

开头一堆废话,可直接跳到文末事情是这样发生的:一直用vscode作为代码编辑器,终端也是用vscode自带的。某个阴天的上午,我准备git push我的代码,push之前,我先pull了一下远程代码,不巧的是,有冲突。于是,全神贯注的解决完冲突后,重新commit了一下,commit时,没有自己描述commit信息,而是用的vscode自动生成的Merge branch。。。。那一串描述文...

2020-04-03 16:00:42

关于如何生成sshkey

查看已有sshkeyls -al ~/.ssh如果有sshkey,直接复制内容即可生成新的sshkeyssh-keygen -t rsa -C "my-email@163.com"默认会在相应路径下(/your_home_path)生成id_rsa和id_rsa.pub两个文件复制sshkey内容macpbcopy < ~/.ssh/id_rsa.pubwindows...

2020-04-01 10:23:40

利用canvas影像合成实现刮刮卡效果

文章目录Canvas对象CanvasRenderingContext2D合成刮刮乐效果的实现Canvas对象HTML的canvas元素;它定义了一个在客户端使用脚本绘图的API,可以直接为这个对象定义width和height。也可以用toDataURL()方法从画布中导出图片。不过实际绘图API是由getContent()方法返回的一个独立“上下文”对象 —> CanvasRend...

2020-03-30 16:02:41

字节跳动一面的几道面试题

一面问题比较基础,但是由于平时使用vue+js, 字节跳动该岗位是react+ts,再加上面试表现的太紧脏,一面就凉凉了。。。。下面凭记忆还原一下面试题,都很常见,如有错误欢迎指出实现三列布局,左右宽度固定,中间列自适应我的答案:左右float, 中间用marginflex布局,左右固定宽度,中间flex: 1上下两个div,上面margin-bottom:20px, 下面margi...

2020-03-19 00:32:55

记一道字节跳动的面试题 js操作dom的执行顺序

面了一轮字节跳动,遇到一个面试题记录一下题目如下function demo () { const now = new Date().valueOf() document.body.style.backgroundColor = 'red'; while(new Date().valueOf() - now <= 2000) { continue; } document.bo...

2020-03-18 23:45:31

h5解决滚动穿透

/** * 添加fix定位解决滚动穿透 * @return {Number} 文档滚动高度 */ scrollAddfix() { let theTop = 0; // 文档滑动距离 let bodyEl = document.body theTop = ...

2020-03-11 16:37:02

window.performance对象

通过window.onpageshow的事件对象的persisted属性可以判断页面是否是从缓存读取的。但试了几次,不管刷新还是前进后退persisted都是false。查了一下看到一个新对象window.performance属性如下:其中有个navigation属性,里面的type也是来标记当前页面是刷新还是前进后退打开的memory表示js占用的内存情况;navigation....

2020-03-10 15:58:16

document对象和window的常用事件

documentreadystatechange当document.readyState的值发生变化时就会触发以上事件readyState的值有:1. loadingDOM还在加载中(此时貌似js还没开始执行,js里捕获不到这个状态)2. interactiveDOM已经加载完毕,css,图片,iframe里的页面还没加载完($(document).ready()就是指这个时候即触...

2020-03-10 15:17:45

js里的位运算|&^~>>

几种位运算的含义:| 按位或运算 0010 | 1000 = 1010 & 按位与运算 0010 & 1000 = 0000 ^ 按位异或运算 >> 右移一位,高位原本是1就补1,否则补0 << 左移一位,低位补零,高位移除 ~ 取反, 0变1, 1变0 举例子说明:(位运算前先把数字转为...

2020-03-08 20:49:16

cookie、session、Token、JWT究竟是怎么用的?

实际项目中经常用到cookie,session,token,知道是授权、验证用户身份用的,最近看了一个公众号文章,趁热记录一下它们究竟怎么工作的。凭证:访问应用时对用户进行身份认证和授权的东东。cookie和sessionhttp是无状态的协议,每个请求都是独立的,服务端无法确认当前访问者的身份,无法辨认是不是同一个人,这个时候需要维护一个状态,用来告知服务端发送来的请求是否来自同一浏...

2020-03-01 22:10:10

查看更多

勋章 我的勋章
  • 签到新秀
    签到新秀
    累计签到获取,不积跬步,无以至千里,继续坚持!
  • 持之以恒
    持之以恒
    授予每个自然月内发布4篇或4篇以上原创或翻译IT博文的用户。不积跬步无以至千里,不积小流无以成江海,程序人生的精彩需要坚持不懈地积累!
  • 勤写标兵Lv2
    勤写标兵Lv2
    授予每个自然周发布4篇到6篇原创IT博文的用户。本勋章将于次周周三上午根据用户上周的博文发布情况由系统自动颁发。