- 博客(59)
- 资源 (7)
- 收藏
- 关注
RSS订阅原创 关于页面状态更新获取上次状态值
问题由来？抛出问题？在页面中可能会遇到这样的诉求，第一个问题是可能要在项目中判断是首次渲染还是后续的渲染，然后要在useEffect里面检查这个标识状态。我们或许可以把它封装成一个自定义hook：子组件：const useUpdateFirst = () => {const ref = useRef(true);useEffect(() => {ref.current = false;})return [ref.current];}父组件：const Example =
2021-10-22 17:17:02
485
2
原创 前端应该掌握的Mysql
在现在的项目上，很容易发现有几个影响开发效率的点，我这边主要发现了两个，第一个是由于有些项目可能后端接口文档给的不够及时导致的项目发版延迟或者开发效率过慢；另一个就是说有些业务模块需要依赖于对数据库表的理解，导致前端开发人员因为不熟悉数据流向不容易协助后端定位问题，以及思考方式容易出现偏颇的问题，这里做一下前端的Mysql入门操作介绍这里主要从工具以及常用语句进行普及1.Mysql工具一般来说，我们是使用navicat的，当然如果有基础的可以直接cmd，去做mysqld操作，也可以使用SQLyog可视
2021-10-22 17:16:16
1462
原创 DOM操作介绍整理（整合资料）
由于项目中，react使用较多，对基本DOM操作会有所疏忽，所以这里总结一下DOM的一些方法，整理在此，有需要者可自行查找学习。本文章是做内容整理，引入部分例子与官方说法。DOM概述本文主要是总结整理一些DOM的api，对一些函数例子做一些编写和整理，以供开发者进行学习讨论。DOM介绍DOM译为文档对象模型（document object model），DOM是HTML和XML文档的编程接口，提供了文档的结构化表述，定义了一种方式可以让他从程序中对该结构进行访问，从而改变文档的结构，样式和内容。DO
2021-10-22 17:13:39
959
原创 初入项目，JS可能遇到的问题优化以及处理方法
ES6篇1.Array.from()为什么先提到Array.from()，在开发中发现数组才是最常见的一种格式，不仅是在渲染列表，表格，还是在数据请求上，都有着重要的意义。首先，先看看Array.from()定义，它可以将一个类数组或可遍历对象转成一个真实的数组。所谓类数组，就是我们在非箭头函数中所属的arguments类型等等；可遍历对象，便如Map类型等等。使用规则为Array.from(arrayLike, mapFn, thisArg)/*arrayLike: 必选，1、类
2021-05-31 09:23:38
17642
原创 快速上手配置YApi
一.安装nodejs进入官网https://nodejs.org/en/download/一路傻瓜式安装，就ok了，可以通过cmd进行node查看二.进行mongodb安装可进入官网安装，速度可能有点慢，建议找百度云https://www.mongodb.com/安装成功如果没有环境变量，可以自行添加，最后可通过cmd查看。可以通过27017进行查看3.安装YApinpm install -g yapi-cli --registry https://registry.npm.
2020-07-14 15:00:30
18022
原创 nginx入门笔记
1.conflocation / { deny all; allow 127.0.0.1;}他会从上到下依次检验，如果deny全部拦截，allow就都不允许。1.精确匹配localtion =/ img { allow all;}设置访问权限目录2.正则表达式文件localtion ~\.php$ { deny all;}3.根据端口号设置主机`新建server文件``sever{ listen 8001; server_name localhost; r
2020-06-05 18:38:14
102128
原创 搭建egg.js服务器
步骤两步1.安装cnpm i egg-init -g2.初始化egg-init --type=simple3.依赖cnpm i4.运行yarn dev
2020-06-01 10:46:24
115693
原创 前端axios+解决跨域proxyTable
使用proxyTable的理由很简单就是为了解决跨域在平时项目的开发环境中，经常会遇到跨域的问题，尤其是使用vue-cli这种脚手架工具开发时，由于项目本身启动本地服务是需要占用一个端口的，所以必然会产生跨域的问题。当然跨域有多种解决方式，比如jsonp等等，在使用webpack做构建工具的项目中使用proxyTable代理实现跨域是一种比较方便的选择。如何使用proxyTable我采用的是vue init webpack xxx创建的项目在根目录下config文件夹下的index.js文件。由于我
2020-05-15 11:31:07
17775
原创 vuex初次尝试
vuex作为状态管理工具，对于父子组件通信有很多优势，初尝试代码：index.js// The Vue build version to load with the `import` command// (runtime-only or standalone) has been set in webpack.base.conf with an alias.import Vue from 'vue'import App from './App'import router from './route
2020-05-15 11:21:48
102126
原创 ES6个人笔记记录——Reflect2
1.Reflect.get()Reflact.get 方法查找并返回target对象的name属性，如果没有该属性，则返回undefinedconst { get , set , defineProperty , deleteProperty , construct , getPrototypeOf ,} = Reflect;let myObject1 = { foo : 1, bar : 2, get baz(){ return this.foo + this.
2020-05-08 17:41:38
102244
原创 ES6个人笔记记录——Reflect1
概述Reflect对象和Proxy对象一样，也是ES6为了操作对象而提供的APIReflect对象的设计目的有以下几个：1.将Object对象的一些明显属于语言内部的方法 (比如：Object.defineProperty)放到Reflect对象上。现阶段，某些方法同时在Object和Reflect对象上部署，未来的新方法将只在Reflect对象上部署，也就是说：从Reflect对象上可以...
2020-05-08 16:14:53
102338
原创 ES6个人笔记记录——Proxy5
this问题虽然Proxy可以代理针对目标对象的访问，但他不是目标对象的透明代理，即不做任何拦截的情况下也无法保证与目标对象的行为一致。主要原因就是在Proxy代理的情况下，目标对象内部的this关键字会指向Proxy代理const target = { m : function(){ console.log(this === proxy); }};const handler =...
2020-05-08 14:29:15
88592
原创 ES6个人笔记记录——Proxy4
constructconstruct用于拦截new命令两个参数，target：目标对象，args：构造函数的参数对象let handler = { construct(target,args,newTargets){ return new target(...arguments); }}// eg1let p = new Proxy(function(){},{ const...
2020-05-08 14:26:37
89710
原创 ES6个人笔记记录——Proxy3
1.apply()apply方法拦截函数的调用、call和apply方法三个参数，目标对象，目标对象的上下文对象，目标对象的参数数组let handler = { apply(target,ctx,args){ return Reflect.apply(...arguments); }};// eg1let target1 = function(){ return 'I am...
2020-05-08 14:18:55
88387
原创 ES6个人笔记记录——Proxy2
Proxy实例的方法1.getlet person = { name: "wjy"};let proxy1 = new Proxy(person, { get: function(target, property) { if (property in target) { return target[property]; } else { // throw new ...
2020-05-08 14:14:43
88501
原创 ES6个人笔记记录——Proxy1
Proxy用于修改某些操作的默认行为，等同于在语言层面作做出修改，所以属于一种元编程，即对编程语言进行编程Proxy可以理解成在目标对象前架设一个"拦截"层，外界对该对象的访问都必须先通过这层拦截，因此提供了一种机制可以对外界的访问进行过滤和改写。Proxy这个词原意是代理，在这里表示"代理"某些操作，可以译为"代理器"const { get , set } = Reflect;...
2020-05-08 14:10:48
88507
原创 ES6个人笔记记录——WeakMap
与Map两点不同1.WeakMap只接受对象作为键名(null除外)，不接受其他类型的值作为键名2.WeakMap设计的目的在于，有时我们想在某个对象上面存放一些数据，但是这会形成对这个对象的引用const wm1 = new WeakMap();// 使用setconst key = {foo : 1};wm1.set(key , 2);console.log(wm1.get(ke...
2020-05-08 14:00:19
88423
原创 ES6个人笔记记录——Map数据结构
Object结构提供了"字符串——值"Map结构提供了"值——值"的对应，是一种更完善的Hash结构实现const m = new Map();const o = { p : 'Hello World'};m.set(o, 'content');console.log(m.get(o), "has=>",m.has(o), "delete=>",m.delete(o)...
2020-05-08 13:55:13
88283
原创 ES6个人笔记记录——WeakSet数据结构
与Set类似，有两点不同1.WeakSet的成员只能是对象，而不能是其它类型的值2.WeakSet中的对象都是弱引用， 垃圾回收机制不考虑WeakSet对该对象的引用 就是说：如果其他对象都不再引用该对象， 那么垃圾回收机制会自动回收该对象所占用的内存， 不考虑该对象是否还存在于WeakSet之中// 1.const ws = new WeakSet();// ws.a...
2020-05-08 13:40:57
88304
原创 ES6个人笔记记录——Set数据结构
类似于数组，但是成员的值都是唯一的，没有重复const s = new Set();[2,3,1,2,5,6,7].forEach(x => s.add(x));console.log(s);for(let sv of s){ console.info(sv);}console.log([...s],s.size);去除数组中的重复元素因为向Setj加入值不会发生类型转换...
2020-05-08 13:39:15
88229
原创 ES6个人笔记记录——Symbol
ES5 的对象属性名都是字符串，这容易造成属性名的冲突比如，我们使用了一个他人提供的对象，但又想为这个对象添加新的方法Cmixin 模式〉，新方法的名字就有可能与现有方法产生冲突。 ES6引入了一种新的原始数据类型Symbol，表示独一无二的值是第七种数据类型1.Number2.String3.Undefined4.Null5.Boolean6.ObjectSymbol...
2020-05-08 13:30:59
88389
原创 ES6个人笔记记录——对象扩展
1.取值函数，存值函数const obj = { get foo(){}, set foo(x){}}// console.log(obj.foo.name);const descriptor = Object.getOwnPropertyDescriptor(obj,'foo');console.log(descriptor.get.name,descriptor.set.nam...
2020-05-08 13:25:27
88311
原创 ES6个人笔记记录——函数扩展
rest参数add = (...value) => { console.log(value instanceof Array);}add(1,2,3,4,5)name属性let add2 = function(...values) { let sum; for(let value of values){ sum += value; } return sum;}...
2020-05-08 11:50:53
88383
原创 ES6个人笔记记录——数组扩展
// 扩展运算符console.log(1,...[2,3,4],5);// ES5console.log(Math.max.apply(null,[14,2,48]));// ES6let { max } = Math;console.log(max(...[14,2,48]));// ES5var arr1 = [0,1,2];var arr2 = [3,4,5];co...
2020-05-08 11:47:51
73575
原创 ES6个人笔记记录——数组解构
function* fibs(){ let a = 0; let b = 1; while(1){ yield a; [a,b] = [b, a + b]; }}let[first,second,third,fourth,fifth,sixth] = fibs();console.log(sixth);let [a,b] = [3,4];console.log(typ...
2020-05-08 11:46:28
73711
原创 ES6个人笔记记录——字符串扩展
关于ES6的一些学习笔记// console.log("\u0061");console.log("\uD842\uDF02");let s1 = "好";console.log("好",s1.length);let s = "????";console.log(s,s.length,s.charAt(0),s.charAt(1),s.charCodeAt(0),s.charCodeAt(1...
2020-05-08 11:43:22
73403
1
原创 一些被忽略的html小知识（持续更新）
1.sectionsection的width规范指示浏览器应当使用窗口的85%(无论是什么浏览器)2.Pp的规范设置段落宽度为250像素。3.aa标签的理解应该是一个锚点(anchor)（持续更新）...
2020-05-04 16:04:12
73436
原创 高阶函数应用5——惰性加载函数
在 Web 开发中，因为浏览器之间的实现差异，一些嗅探工作总是不可避免。比如我们需要一个在各个浏览器中能够通用的事件绑定函数 addEvent，常见的写法如下：var addEvent = function( elem, type, handler ){ if ( window.addEventListener ){ return elem.addEventListener( type, h...
2020-04-25 12:42:19
14618
1
原创 高阶函数应用4——分时函数
在前面关于函数节流的讨论中，我们提供了一种限制函数被频繁调用的解决方案。下面我们将遇到另外一个问题，某些函数确实是用户主动调用的，但因为一些客观的原因，这些函数会严重地影响页面性能。一个例子是创建 WebQQ 的 QQ 好友列表。列表中通常会有成百上千个好友，如果一个好友用一个节点来表示，当我们在页面中渲染这个列表的时候，可能要一次性往页面中创建成百上千个节点。在短时间内往页面中大量添加 DO...
2020-04-25 12:27:41
14610
原创 高阶函数应用3——函数节流
JavaScript 中的函数大多数情况下都是由用户主动调用触发的，除非是函数本身的实现不合理，否则我们一般不会遇到跟性能相关的问题。但在一些少数情况下，函数的触发不是由用户直接控制的。在这些场景下，函数有可能被非常频繁地调用，而造成大的性能问题。下面将列举一些这样的场景。1.函数被频繁调用的场景1.window.onresize 事件。我们给 window 对象绑定了 resize 事件，...
2020-04-25 12:21:05
14598
原创 高阶函数应用2—— uncurrying
在 JavaScript 中，当我们调用对象的某个方法时，其实不用去关心该对象原本是否被设计为拥有这个方法，这是动态类型语言的特点，也是常说的鸭子类型思想。同理，一个对象也未必只能使用它自身的方法，那么有什么办法可以让对象去借用一个原本不属于它的方法呢？答案对于我们来说很简单，call 和 apply 都可以完成这个需求：var obj1 = { name: 'sven'};var o...
2020-04-25 12:08:24
14665
3
原创 高阶函数应用1——函数柯里化
首先我们讨论的是函数柯里化（function currying）。currying 的概念最早由俄国数学家 MosesSchönfinkel 发明，而后由著名的数理逻辑学家 Haskell Curry 将其丰富和发展，currying 由此得名。currying 又称部分求值。一个 currying 的函数首先会接受一些参数，接受了这些参数之后，该函数并不会立即求值，而是继续返回另外一个函数，刚...
2020-04-25 12:03:10
14638
原创 javascript高阶函数实现AOP
AOP（面向切面编程）的主要作用是把一些跟核心业务逻辑模块无关的功能抽离出来，这些跟业务逻辑无关的功能通常包括日志统计、安全控制、异常处理等。把这些功能抽离出来之后，再通过“动态织入”的方式掺入业务逻辑模块中。这样做的好处首先是可以保持业务逻辑模块的纯净和高内聚性，其次是可以很方便地复用日志统计等功能模块。在 Java 语言中，可以通过反射和动态代理机制来实现 AOP 技术。而在 JavaScr...
2020-04-25 11:37:22
16725
原创 有关闭包的详细解释(主要摘自设计模式书)
对于 JavaScript 程序员来说，闭包（closure）是一个难懂又必须征服的概念。闭包的形成与变量的作用域以及变量的生存周期密切相关。下面我们先简单了解这两个知识点。1.1 变量的作用域变量的作用域，就是指变量的有效范围。我们最常谈到的是在函数中声明的变量作用域。当在函数中声明一个变量的时候，如果该变量前面没有带上关键字 var，这个变量就会成为全局变量，这当然是一种容易造成命名冲突...
2020-04-24 13:49:45
17177
原创 使用call改变this指向
call 和 apply 最常见的用途是改变函数内部的 this 指向，我们来看个例子：var obj1 = { name: 'sven'};var obj2 = { name: 'anne'};window.name = 'window';var getName = function(){ alert ( this.name );};getName(); // 输出: wi...
2020-04-24 12:21:15
18621
原创 JavaScript中this指向问题(4种)
this跟别的语言大相径庭的是，JavaScript 的 this 总是指向一个对象，而具体指向哪个对象是在运行时基于函数的执行环境动态绑定的，而非函数被声明时的环境。this的指向除去不常用的 with 和 eval 的情况，具体到实际应用中，this 的指向大致可以分为以下 4 种。作为对象的方法调用。作为普通函数调用。构造器调用。Function.prototype.cal...
2020-04-24 12:10:15
17968
核酸采样点一站查毕业论文 go+微信小程序
2023-03-14
cmder-20200311T032555Z-001.zip
2020-03-11
算法分析与设计.zip
2019-05-18
this is a res
2018-11-22
安卓实验包含报告(全)
2018-11-21
这是一个android计算器
2018-11-20
学生成绩管理系统
2018-07-15
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人