- 博客(179)
- 收藏
- 关注
RSS订阅
原创 前端网络安全相关知识 （XSS和 CSRF）
新冠肺炎疫情这么严重，大家是在家办公呢？还是带薪休假呢？或者是停薪休假呢？不管大家在干什么，我觉得很难静不下心来，专心做某件事吧？我反正忍不住一会儿就想看下疫情都最新消息，时刻关注着，什么时候结束这场“噩梦”……俗话说：不求三月下扬州，但求月底能下楼～～～闲暇之际：总结一下网络安全知识，共享下吧，如有不到位的，小窗口欢迎????????????首先说一下他的重要性随着互联网的发达，各种WEB应用也变得越...
2020-02-18 17:11:40
4044
原创 使用Vuex 报错 unknown action type:XXX（未知的操作类型:）
只是想实现一个简单的 count ++ count – 的功能不到半年没使用 vue 突然发现不会用了unknown action type: 这个报错看了许久，耗费了好长时间，中午整明白为什么了看代码：在组件里面调用 actions 下面的方法，一直报错，未知的操作类型，可以自己在store 里面明明定义了嘛。费解。。。。 //this.$store.commit()触发...
2019-09-28 17:34:16
86447
20
原创 前后端是如何交互的
iOS，H5，安卓等前端开发的如何跟后台进行交互?应该怎么去规避一些不该属于自己的任务而被后台强加于自己?1.前端请求数据URL由谁来写?在开发中,URL主要是由后台来写的,写好了给前端开发者.如果后台在查询数据,需要借助查询条件才能查询到前端需要的数据时,这时后台会要求前端提供相关的查询参数，这里的查询参数也就是URL请求的参数。2.接口文档主要由谁来写?接口文档也是主要由后台开发者...
2019-06-13 10:49:02
34941
12
原创 web前端项目开发流程
开发流程图解需求评审召集需求涉及到的UI、开发、产品、测试人员整理业务流程，同步信息，明确分工明确需求目的，考虑当前需求设计是否可满足目的整理流程中如果涉及的其他人员，则召集商讨如需求设计上影响现有业务功能，应要求产品重新设计实现方案，然后重新评审注意事项业务流程同步：评审后重新梳理流程，存在疑问处及时找产品沟通周边需求依赖：评审功能与依赖功能并行开发，由于前置需求未完成导致...
2019-06-13 09:32:57
14608
2
转载 Diff算法
Diff算法什么是Diff算法？diff算法作为Virtual DOM的加速器，其算法的改进优化是React整个界面渲染的基础和性能的保障，同时也是React源码中最神秘的，最不可思议的部分传统Diff：计算一棵树形结构转换为另一棵树形结构需要最少步骤，如果使用传统的diff算法通过循环递归遍历节点进行对比，其复杂度要达到O(n^3)，其中n是节点总数，效率十分低下，假设我们要展示1000...
2019-06-12 08:38:53
23796
5
原创 vue优点、缺点以及vue常用的一些方法
VUE1、Vue是什么?Vue是一个渐进式的javascript开发框架，通过组件的开发，最后进行组件的组合，合并组件形成页面构造器(构造函数)自动化构建工具优点组件化开发单页面路由丰富的Api方法双向的数据绑定单向数据流易于结合其他第三库缺点生态系统不够完善可扩展性稍差1、全局安装 npm install -g vue-cli2、创建项目 v...
2019-06-12 08:28:46
11342
原创 Mobx总结以及mobx和redux区别
Mobx解决的问题传统React使用的数据管理库为Redux。Redux要解决的问题是统一数据流，数据流完全可控并可追踪。要实现该目标，便需要进行相关的约束。Redux由此引出了dispatch action reducer等概念，对state的概念进行强约束。然而对于一些项目来说，太过强，便失去了灵活性。Mobx便是来填补此空缺的。这里对Redux和Mobx进行简单的对比：1. Redux...
2019-05-31 12:00:02
26799
2
原创 关于报错Support for the experimental syntax 'decorators-legacy' isn't currently enabled
报错原因装饰器写法不被支持解决办法bable转码npm install @babel/plugin-proposal-decorators配置package.json“babel”: {“plugins”: [[“@babel/plugin-proposal-decorators”,{“legacy”: true}]],“presets”: [“react-app”...
2019-05-16 19:28:46
8691
6
转载 做项目到底该用Vue和还是react？
2016年React巩固了它作为前端框架之王的地位，这一年中可以看到它在Web端和移动端的快速成长，同时稳稳领先于它的主要竞争对手Angular。但是2016对Vue来说也是同样令人印象深刻的一年，它发布了Vue 2.0版本并且在JavaScript社区引起了巨大反响，GitHub上多出的25000颗star就是最好的证明。React和Vue的适用范围无疑是很相似的：同样是基于组件的轻量级框架...
2019-05-04 18:55:25
15523
原创 字符串正则做到每10个字符换行
var str = “测试 ceshi 巴拉巴拉 娃哈哈 噼里啪啦 叽里呱啦”;str=str.replace(/[^\x00-\xff]/g,"KaTeX parse error: Expected 'EOF', got '&' at position 1: &̲\x01").replace(…&\n").replace(/\x01/g,"");console.log(str);
2021-03-10 10:16:11
1280
原创 Promise.all和Promise.race的区别
const f1 = new Promise(function (resolve, reject) { resolve('佳佳') }) const f2 = new Promise(function (resolve, reject) { reject('要') }) const f3 = new Promise(function (resolve, reject) { ...
2020-08-19 21:30:34
611
原创 判断数据类型的方法
1: typeof平时我们需要判断数据类型的时候，可能第一个想到的方法就是typeof，但是，我们都知道，是有点小缺陷的typeof null返回类型错误，返回object引用类型，除了function返回function类型外，其他均返回object。其中，null 有属于自己的数据类型 Null ， 引用类型中的 数组、日期、正则 也都有属于自己的具体类型，而 typeof 对于这些类型的处理，只返回了处于其原型链最顶端的 Object 类型，没有错，但不是我们想要的结果。2：toStrin
2020-08-10 23:06:03
701
原创 在 ES5 中判断函数如何被调用
在 ES5 中判断函数是不是使用了 new 来调用（即作为构造器）,最流行的方式是使用 instanceof ，例如： function Person(name) { if (this instanceof Person) { this.name = name; // 使用 new } else { throw new Error("You must use new with Person
2020-08-08 17:14:08
453
原创 快速删除数组中对象内的某些值
数组内嵌套多个对象，要求删除对象内指定key值虽然直接遍及通过delete方法也可以直接删除了，但是，如果删除的对象有很多，那岂不是太low了？废话不多说，直接撸代码方法一：const deleteParams = ['name', 'show', 'age'] const data = [ { name: 'zs', show: true, age: '12', eat: 'apple', look: 'book' }, { name: 'lisi', show: true, age: '10',
2020-08-06 13:12:32
1772
原创 基于canvas实现的放大镜功能
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> #myCanvas { border: 1px solid ...
2020-04-09 19:52:52
536
原创 canvas实现的loading效果
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
2020-04-09 18:40:07
844
原创 canvas自制画板
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
2020-04-09 18:32:17
235
原创 【Git】切换分支时，报错：error: pathspec 'XXXX' did not match any file s known to git.
gitlab 上面明明新建了一个分支，专门用来更改某一个需求用的，可是通过git checkout ****(分支名)，竟然报错，还以为自己写错单词了，又重新写了一遍，还是这个错误：上面大概意思就是：这个分支和git已知的任何文件都不匹配然后又通过 git branch -a查看本地和远程所有分支,发现确实没有这个分支，奇了个怪呢？？？？？那为什么gitlab上面就显示呢？？？？那我们来获...
2020-03-27 18:57:23
26182
2
原创 一键复制功能（兼容pc端和移动端）2种方式以及附带案例
react-copy-to-clipboardnpm install --save react react-copy-to-clipboardimport React from 'react';import {CopyToClipboard} from 'react-copy-to-clipboard'; const languageList =() => [ { ...
2020-03-23 11:10:54
1010
原创 面试题：判断一个给定整数数组中是否存在某两个元素之和恰好等于一个给定值 k，存在则返回 true，否则返回 false。
面试题：实现一个函数，判断一个给定整数数组中是否存在某两个元素之和恰好等于一个给定值 k，存在则返回 true，否则返回 false。该函数的输入参数有两个，第一个参数为整数数组 nums，第二个参数为整数 k，返回值为布尔值。可以参考以下签名，写出实现const checkTwoSum = function(nums, k) { // Write your code here ...
2020-03-22 11:33:57
2643
2
原创 谈谈 a 标签 target='_blank' 跳转外部链接的问题
平时微信都会关注一些相关的前端公众号什么的，无聊的时候，不仅可以打发时间，还能稍稍学点儿东西，我认为大多人都会有这些习惯吧！今天上班路上，随便打开手机看了下订阅号，突然看到了一个标题，一下吸引了我的注意力！上面写的 外链 用 target="_blank" 结果悲剧了？？？？？我在想，不就一个 a 标签跳转页面，能有什么悲剧呢？？今天之前，如果跳转页面，并在新的窗口打开，我第一个想到的肯...
2020-03-19 11:06:40
6139
2
原创 JavaScript 判断 html 元素是否包含某个类名 class（3种方式）
第一种方法（HTML5中的classList API）如果不考虑兼容IE10以下的话，可以用HTML5中的classList API，非常方便：var node = document.getElementById('element');if(node.classList.contains('test')){ console.log('包含 test 这个class');}第二个...
2020-03-11 10:54:27
27312
原创 mac电脑如何显示隐藏文件或者.开头的隐藏文件
以上的隐藏文件，正常都是不显示的，到底如何才能让他全部显示出来呢？？？最简单的方法：shift+command+.一个快捷键搞定✌️✌️✌️✌️✌️
2020-03-09 10:54:50
509
原创 react中监听页面滚动的高度以及横向滚动的位置
//首先在componentDidMount，进行scroll事件的注册，绑定一个函数，让这个函数进行监听处理componentDidMount() { window.addEventListener('scroll', this.bindHandleScroll)}bindHandleScroll=(e)=>{ // 滚动的高度(兼容多种浏览器)const scro...
2020-03-07 18:52:17
8488
原创 create-react-app + mobx 小demo
新的一周又开始了，一如既往的家里办公～～～～昨天开周会了，其他同事手里多少都有点工作，不像我，bug解决完了，新的需要还没出来，这就尴尬了？？？????????????不能告诉领导我是真的没事干吧？？？哈哈，其实组长也知道自己手里到底有没有工作，不妨趁着闲暇之际，来学点儿东西吧～～～我们公司对项目使用框架一般都是react+redux+saga，趁着工作不忙，来学习一下 “mobx” 吧！但是没想到一上午...
2020-02-25 14:53:49
412
原创 2020年02月24日～～～最终活成了自己讨厌的样子
我不喜欢自己花费大量时间只为琢磨另一个人的心情；我不喜欢自己焦虑、患得患失的样子；我不喜欢自己一天什么事也不做，只为了等待另一个人的信息；我不喜欢这样没有安全感、毫无自我的自己；我只想当一个冷静自持的人，永远能跳脱自身看待问题，像一个给自己开刀的外科医生。我想认真读书，努力工作，到处旅行，努力让自己变得更丰富。...
2020-02-24 19:56:20
455
2
转载 redux和mobx对比
Reduxaction:一个javascript对象，描述动作相关信息，主要包含type和payload属性；type:action类型；payload：负载数据；reducer：定义应用状态如何响应不同动作（action），如何更新状态；store：管理action和reducer及其关系等对象，主要提供以下功能：维护应用状态并支持访问状态（getstate()）;支持监...
2020-02-24 18:24:33
645
原创 react 项目支持 装饰器写法 Support for the experimental syntax ‘decorators-legacy‘ isn‘t currently enabled
Support for the experimental syntax ‘decorators-legacy’ isn’t currently enabled有道云翻译过来意思为：目前还不支持实验性语法“decorator -legacy”其实大概意思就是装饰器语法不支持呗！报错如下图：遇到问题，肯定第一时间百度，看大家有没有遇到类似情况，如何解决的，参考答案几乎都是：npm ins...
2020-02-24 12:47:58
1741
原创 2020年02月22日～To make money
我努力赚钱，不是因为爱钱，而是这辈子不想因为钱，和谁在一起，也不想因为钱，而离开谁，如果问我爱情和面包选择哪一个？我会说你给我爱情就好，面包我自己买！...
2020-02-22 10:50:27
200
1
原创 2020年2月20日～感慨
总觉得来日方长，总幻想诗和远方，总觉得年少轻狂，总盼望地久天长，如今远方还是远方，已没了诗的向往，轻狂变成了无奈，天长变成了奢望，曾经的来日方长，已变得迷失了方向。...
2020-02-20 18:17:41
209
3
转载 es6 类（类的使用以及类的继承）
概述在ES6中，class (类)作为对象的模板被引入，可以通过 class 关键字定义类。class 的本质是 function。它可以看作一个语法糖，让对象原型的写法更加清晰、更像面向对象编程的语法。类的使用小demo<!DOCTYPE html><html lang="en"><head> <meta charset="UTF...
2020-02-20 15:28:12
472
原创 webpack 4的简易配置
今天早晨醒来看了下 新冠肺炎疫情状况，今天明显有好转，希望“春天”尽快来临吧！????哎，不能去公司上班，在家呆着也好无聊，手头工作也不多～～～～因为疫情，在家办公室效率低，工资都降了，如果疫情一直不好，那岂不是要饿死的节奏？？？不管怎么样，还是得不断巩固、学习新知识，那我们今天来回顾下 webpack 对简单配置项吧！实现功能自动注入js开发环境热更新抽离CSS压缩JS、CSS、Ht...
2020-02-20 12:32:55
321
原创 React Hooks
之前的文章中总结过 React Hooks常用的钩子useState、useContext、useReducer、useEffect的用法，今日趁着工作不忙，再次详细了解下 Hooks简介什么是HooksHooks是一个新的React特性提案，组件尽量写成纯函数，如果需要外部React特性（比如状态管理，生命周期），就用钩子把外部特性"钩"进来，通常函数名字都是以use开头。首次在v16.7...
2020-02-20 12:11:21
296
转载 金额正则校验
<input type="text" name="je" onkeyup="clearNoNum(this) " />元 function clearNoNum(obj){ obj.value = obj.value.replace(/[^\d.]/g,""); //清除“数字”和“.”以外的字符 obj....
2019-12-26 15:46:57
706
转载 vue的实现流程
三要素: 双向绑定、模板解析、渲染第一步：解析模板成render函数with的引用模板中所有的信息都要被render函数包含模板中用到的data属性都变成js变量v-modle、v-for……变成js返回vnode第二步： 响应式开始监听通过object.defineProperty监听到data中属性的get和set方法将data中的属性代理带vm上第三步： 首次渲染，显示页...
2019-12-20 17:30:58
291
转载 带你彻底了解闭包以及其原理
闭包一直是许多初学者的难题，网上对闭包的讲解也是众说纷纭，但还是许多人不能明白。下面我通过五个简单例子，让你明白闭包原理。第一个例子<script> var i = 0; document.onclick = addNumber; function addNumber(){ i++; document.tit...
2019-12-20 17:21:24
1245
原创 正则
什么是正则？是一种规则，一种模式，字符串的处理工具字面量var reg=/ /元字符和反义。一个除了换行符和行结束符以外的字符\w 单词字符（下划线、数字、字母）\W 非数字、字母、下划线\d 数字（0-9）\D 非数字\s 空白\S 非空白\^ 开始符\b 匹配边界\B 匹配非单词边界\n 换行量词+ 一个或多个* 0个或多个? 0个或一个x|y 匹配...
2019-12-20 14:49:09
333
转载 JS常用的正则表达式（手机号、邮箱、身份证、用户名、密码等）
常用正则表达式合集:验证数字：^[0-9]*$验证n位的数字：^\d{n}$验证至少n位数字：^\d{n,}$验证m-n位的数字：^\d{m,n}$验证零和非零开头的数字：^(0|[1-9][0-9]*)$验证有两位小数的正实数：^[0-9]+(.[0-9]{2})?$验证有1-3位小数的正实数：^[0-9]+(.[0-9]{1,3})?$验证非零的正整数：^\+?[1-9][0-...
2019-12-17 10:53:41
1187
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人