学习过程
龙马啊
人要有理想,没有理想就不是人啦。
展开
-
叶贝斯定律 -有深入浅数据分析(第六章)
这个得出结论 200/500 = 40% 沉默寡言 农民 10/10 = 100% 沉默寡言 科研工作者。其中 500个农民有 200个农民沉默寡言,10个科研工作者 10个沉默寡言。其中 5个农民有 2个农民沉默寡言,100个科研工作者 60个沉默寡言。只喜欢专注自己手头事情。因为老张认识 500个农民,10个科研工作者。因为老张认识 5个农民,100个科研工作者。200农民 vs 10科研工作者。2农民 vs 60科研工作者。老张判断 这种人 是 A。小李判断 这种人是 B。原创 2024-02-01 22:21:37 · 443 阅读 · 0 评论 -
react WangEditor 编辑器阿里云OSS上传图片
刚开始写的时候,去网上翻阅了很多文章,发现根本没有我想要的,有时候还有需要自己去阅读官方的文章来解决问题。学习上有一点很重要,我们需要的是怎么去官方阅读文档找到解决方案,而不是单纯的去网上搜索别人的代码。从上面的这个文档里面我们找到了一个重要的API函数,我们可以拿到两个参数,这个data对象可以自定义为file对象 ,就是我们之前。找到文档的这个描述,第一次找的时候,没有看到靠。第一步阅读wangEditor的文档。我们接下来看阿里云OSS文档。...原创 2022-08-16 21:24:34 · 955 阅读 · 0 评论 -
docker部署博客项目
docker run -d -p 3306:3306 --name mysql -e MYSQL_ROOT_PASSWORD=abc123 mysql镜像id。docker run -di --name=redis -p 6379:6379 redis || 镜像id 运行镜像。docker run -d -p 3000:3000 --name server 镜像id 运行容器。docker exec -it redis /bin/bash 进入redis这个容器。...原创 2022-08-02 22:29:37 · 646 阅读 · 0 评论 -
react Children 插槽组件 - 项目中遇到的问题
有一个组件,我想放入两个按钮,但是两个按钮的位置是在组件里面的不同位置的。我不想把按钮写入到组件里面去,那样方法调用很麻烦。原创 2022-07-19 22:13:19 · 685 阅读 · 0 评论 -
前端CSS3文字滚动轮播(项目中遇到的问题)
这个东西拖了好久,之前就打算更的,了解一下,自己写出来发现还是很简单的。我还记得第一次接触它,当时react里面引用swiper第三方库,一直有问题。然后一直死磕,最后被提醒可以用css3 样式来实现轮播滚动。简单的写了下面的代码,注意一下这里我遇到了一个数据深拷贝的问题...原创 2022-07-08 21:21:22 · 1123 阅读 · 0 评论 -
react-hooks学习
简直悲哀,我之前学习hooks啥啊有时候在工作中用来用去就那几个API,真的把自己限制死了。useStateuseReducerhooks副作用useEffectuseContextuseRefforwardRefmemouseCallbackuseMemo原创 2022-07-03 23:48:02 · 356 阅读 · 0 评论 -
如何实现视频平台会员多账号登录
我们要实现以下几个功能?我的解决方案是这样的,这个代码也是要后端来设计的。(后续会更新这个)原创 2022-07-03 20:39:26 · 267 阅读 · 0 评论 -
前端设计模式-深入思考?
前面几天,写了一些面试题,应付一下后续的面试。最近打算把自己的缺点优化一下,怎么说呢,其实很喜欢学习,接触自己不懂的东西,我一开始会有一个缺点,就是我会走的很快,这个走的很快是指,学习很东西,没有去把自己学习的东西进行一个深度的学习,之前自己学习的就是皮毛,...............原创 2022-07-02 23:15:43 · 138 阅读 · 0 评论 -
节流的两种写法-最近看到的这种写法
第一种第二种原创 2022-06-28 19:58:55 · 152 阅读 · 0 评论 -
websocket 和HTTP
websocket 连接过程websocket 和HTTP区别原创 2022-06-26 20:37:23 · 600 阅读 · 0 评论 -
前端预防攻击手段
XSSvue 和 react 插值表达式,都是可以预防的但是 vue v-html react dangerouslySetInnerHTML这个是没有预防的预防手段比如csrf 跨站请求伪造预防手段比如点击劫持点击劫持预防DDoSSQL注入原创 2022-06-26 20:20:58 · 671 阅读 · 0 评论 -
x项目部署 全栈项目,部署和安装
1. 今天把项目部署成功了,还是很开心了,某种意义上是我自己第一次部署全栈的项目。2. 部署成功之后觉得这个项目好像没有那么难吧。整个流程需要的东西我简单的讲一下整个项目的流程。我用的是node+koa2+ejs+mysql+redis的项目。我们需要做什么,我会先将服务端的部署。买一个阿里云服务器,远程连接,进入控制台。安装 node 环境我们去下图下载 linux 安装包(),我们在远程连接中 cd /usr/local/node 进入这个目录下,把下载的压缩包放入这个目录下(使用原创 2022-06-19 21:57:25 · 423 阅读 · 0 评论 -
关于使用koa2开发接口,pm2和Nginx代理
把压缩包放入 /usr/local/node 目录下执行下面的命令 对文件进行解压,这是Linux文件解压命令,zip 的解压是 解压完成之后进入解压文件夹 /bin 目录执行下面命令配置环境变量接下来我们 node -v 可以看到版本号了。node 环境也就是安装完成了。接下来执行 npm i 安装我们需要的依赖在执行 node api.js我们再开一个远程服务器 执行下面命令,测试node接口可以使用cd /node_koa安装 pm2 输入软连接命令 启动pm2然后执行原创 2022-06-16 00:54:11 · 408 阅读 · 0 评论 -
Array.map()简写函数
下面两个函数是等价的原创 2022-06-04 15:56:29 · 169 阅读 · 0 评论 -
JWT和session
JWT和session两者都是为了解决: 登录 和存储登录用户的信息。JWTsession原创 2022-06-03 23:02:18 · 200 阅读 · 0 评论 -
关于电脑网络浏览器没有网络,但是QQ和微信可以登录,解决浏览器网络问题
网络修复原创 2022-06-02 22:35:42 · 1241 阅读 · 0 评论 -
TS 泛型类和泛型接口的好处
降低代码管理成本,提供统一属性和方法命名可以从整体上快速通读类的共同方法和属性新增相同功能时,可以快速搭建类的方法原创 2022-05-26 23:11:08 · 285 阅读 · 0 评论 -
TS 泛型的extends属性
T extends object 是泛型约束的一种表现。泛型约束简单点来说就是把泛型的具体化数据类型范围缩小理解 T extends object:extends表示具体的泛型类型只能是 object 类型, 某个变量如果能断言成 object类型[变量 as object ] , 那么这个变量的类型符合 T extends object 。就是说该变量的类型可以是T的具体化类型限制了泛型的类型,我们传了 number 就会报错tip: 我们使用了 T extends objec.原创 2022-05-24 23:20:11 · 4435 阅读 · 0 评论 -
any 为什么不能代替类上的泛型
编译期间any无法进行类型安全检查,而泛型在编译期间可以进行类型安全检查any 类型可以获取任何属性和任意方法而不会出现编译错误导致潜在风险,而泛型却有效的避免了此类问题发生any 类型数据获取属性和方法时无自动提示,泛型有自动提示...原创 2022-05-23 23:04:27 · 135 阅读 · 0 评论 -
TS object为什么不能替代类上的泛型
1. 编译期间 object 无法进行类型安全检查, 而泛型在编译期间可以进行类型安全检查2. object 类型数据无法接收非 object类型的变量,只能接收object类型的变量,泛型能轻松做到。3. object类型数据获取方法和属性时无自动提示...原创 2022-05-23 22:57:36 · 666 阅读 · 0 评论 -
TS初识泛型
泛型的定义定义时不明确,使用时必须明确成某种具体数据类型的数据类型编译期间进行数据类型安全检查的数据类型 [ 泛型的严谨 ]有这样的一个类,我们要求一个对象的数组突然被要求这个数组里面不能传数组,要求传字符串了,如果是下面的这段代码,我们需要改的东西很多了class ArrayList { public element!: Array<object> constructor() { this.element = [] } public i原创 2022-05-23 21:57:21 · 855 阅读 · 0 评论 -
JS继承总结
原型链的继承缺点不能给父类的属性传递参数 function Father(name, age) { this.name = name this.age = age } Father.prototype.say = function () { console.log('我是父亲'); } function Son(like) { this.li原创 2022-05-22 23:49:48 · 124 阅读 · 0 评论 -
TS-深入元组
看下图的代码readonly 和 as const 都是表示固定的,包括数组和元组中的每一项不能改变。tip:和 const参数还是有区别的。有这样的一个场景,我需要拿到数组里面的除了第一个元素以外的值。let arr = [1, 2, 3, 'zs', 'lisi'] as constfunction Test(arr: readonly [any, ...any[]]) { let [first, ...rest] = arr return rest}co..原创 2022-05-22 20:54:36 · 488 阅读 · 0 评论 -
TS可变元组和元组标签
有这样的一个使用场景,一个数组里面,数组里面第一个元素是姓名,第二个元素是年龄,后面可能会添加其他的数据。用TS实现我们第一反应的写法是这样的let [names, age]: [string, number, ] = ['zs', 18]可变元组的写法结合了ES6的 rest 方法let [names, age, ...rest]: [string, number, ...any[]] = ['zs', 18,'ls']元组标签name_ 只是一个标签作用,无其他作用let [n原创 2022-05-22 20:17:19 · 493 阅读 · 0 评论 -
TS自定义守卫
自定义守卫格式 function 函数名(形参: 参数类型[参数类型大多为any]): 形参 is A类型 = boolean + 类型守卫能力 { return true or false }理解: 返回布尔值的条件表达式赋予类型守卫的能力, 只有当函数返回true时, 形参被确定为A 类型自定义守卫的重要意义: 编码展示其具体意义这里解释一下守卫的功能是什么没有类型守卫时:class StringUtil { public static trimSpac原创 2022-05-22 20:13:08 · 761 阅读 · 0 评论 -
new过程中发生了什么-前端JS
学习的过程不在于死记硬背,而在于怎么去理解它观察下面的代码和打印的信息我们可以得出以下结论每一个对象都有 __proto__ 属性obj.__proto__.constructor 指向构造函数, 下图中的是指向 Object 这个祖先函数 function Fater(name, age) { this.name = name this.age = age } Fater.prototype.say = fu原创 2022-05-22 11:14:56 · 186 阅读 · 0 评论 -
TS-类型断言(类型转换)
类型断言的第一个条件两者具有继承关系class Father { public name: string public age:number constructor(name_:string, age_: number) { this.name = name_ this.age = age_ } say() { }}class Son extends Father { public like: stri原创 2022-05-21 23:06:19 · 2776 阅读 · 0 评论 -
懒汉式单例模式(也被称为延时使用)和饿汉式单例模式
懒汉式单例模式第一步: 把构造器设为私有的,不允许外部来创建类的实例[对象]第二步:至少应该提供一个外部访问的方法或属性,外部可以通过这个属性或方法得到一个静态空间,所以应该把这个方法设置为静态方法。第三步:外部调用第二步提供的静态方法来获取一个对象。export default class MyLocalStorage { static localStorage: MyLocalStorage private static num: number = 0 co原创 2022-05-17 20:56:58 · 88 阅读 · 0 评论 -
前端关于class上静态属性(私有属性和公有属性不讲解了)
class上的 静态属性 static不能通过实例之后的对象变量来访问只能通过类名来调用 class Person { static names = 'zs' show() { } } let p = new Person() console.log(Person.names); // zs console.log(p.names); // unde.原创 2022-05-15 22:40:00 · 645 阅读 · 0 评论 -
TS构造函数的重载
直接上代码通过传递两个不同参数类型来求面积实现不理解的话,可以看TS函数重载type areaType = { width: number, height: number}class Squar { public width public height constructor(width_:number, height_:number) constructor(valueObj: areaType) constructor(public o原创 2022-05-15 15:23:18 · 936 阅读 · 0 评论 -
class里面的构造器是方法吗?一个有趣的想法
class里面的构造器是方法吗?如果不是方法为什么是函数呢?最近学习的时候,发现这个问题很有趣,了解了一下。首先我们对于方法的定义是,通过对象调用的函数被称为方法下面的这段代码我们new了一个实例, p.constructor是错误的,不能调用出来这个方法我们的结论就是 构造器 是函数我们不能因为它在对象里面就把它看成一个方法class Person { constructor(public name:string) { this.name = name }原创 2022-05-15 14:54:15 · 202 阅读 · 0 评论 -
TS方法重载
实现Java的ArrayList方法这个重载和函数重载类似,就不做多了说明class ArrayList { constructor(public element:Array<Object>) { this.element = element } get(index:number) { return this.element[index] } show() { this.element.forEac原创 2022-05-15 11:44:44 · 824 阅读 · 0 评论 -
TS学习 unknown、any、 object、Object 的区别使用
最近学习TS的时候,接触了unknown记录一下首先了解什么是 any 和 unknownany表示任意类型, 可以是一个集合, 里面包含了所有的类型unknown表示是是所有类型的父级也就是祖先级别的这里的 unknown 是可以理解成 undefined在某种意思上 undefined 是所有数据的父级在这样的一种情况下 unknown类型是会报错的let k: unknown = 1let z: number = k // 报错解释一下为什么报错我们定义了 k 值是原创 2022-05-14 23:52:34 · 4384 阅读 · 1 评论 -
TS函数重载
有这样的一个场景根据ID或者文件类型查找聊天记录下面是我们的代码type MessageType = 'image' | 'vedio' | stringtype Message = { id: number, type: MessageType, sendMessage: string}let message:Message[] = [ { id: 1, type: 'image', sendMessage:原创 2022-05-14 23:28:51 · 4357 阅读 · 2 评论 -
原型和原型链-JS复习
面试经历记得上一次面试的时候,被问到什么是原型和原型链我的回答是下面这张图,实际上可以回答很不标准。最近又学习一下,总结一篇。之前有一篇文章说过,为什么前端需要原型这个东西,就是节省内存空间。仔细看下面的这段代码实例化的 a 和实例化的 b 有一个共同的数组,和方法但是从打印结果,我们明显的发现他们的地址是不一样的,那就表示他们开辟了不同的堆空间很明显对性能有消耗 function Person(name) { this.name = name原创 2022-05-13 23:30:07 · 101 阅读 · 0 评论 -
策略模式-前端设计模式
策略模式解决代码里面的 if else 的堆叠不同策略,分开处理,而不是混合在一起符合开放封闭原则 class User { constructor(type) { this.type = type } buy() { if (this.type === "ordinaryUser") { console.log('普通原创 2022-05-10 23:05:24 · 137 阅读 · 0 评论 -
原型模式-前端设计模式
原型模式不是很常用,了解一下就可以Object.create()使用现有的对象来创建对象的__proto__最下面代码的实例 x = 下面代码x = { first: 'x', last: 'y', __proto : { getName:function(){}, say: function(){} }} const prototype = { getName: function() { return this.first + '原创 2022-05-09 23:00:44 · 238 阅读 · 0 评论 -
状态模式-前端设计模式
允许一个对象在其内部状态改变时改变它的行为,对象看起来似乎修改了它的类// 状态 class State { constructor(color) { this.color = color } // 改变主体里面的信息 handle(context) { console.log(`turn to ${this.color} l.原创 2022-05-09 22:32:53 · 405 阅读 · 0 评论 -
前端有趣的面试题-关于new的过程,指向
下面代码就是这个面试题,求打印的结果 Test.prototype = { name: "zs" } function Test() { } let a = new Test() Test.prototype = { name: "lisi" } let b = new Test() console.log(a.name); /原创 2022-05-09 20:48:35 · 281 阅读 · 0 评论 -
手写promise源码分析
promise就是构造函数使用是发布订阅模式我们定义三个状态// pendingconst PENDING = "pending"// 成功的回调状态const FULFILLED = "fulfilled"// 失败的回调状态const REJECTED = "rejected"代码里面的注释,可以看下class Promise { constructor(executor) { this.status = PENDING // 成功传递原创 2022-05-08 20:49:19 · 428 阅读 · 2 评论