- 博客(129)
- 收藏
- 关注

原创 【说明】最近文章可在掘金查看
最新文章都是在掘金编辑,然后同步在csdn,格式可能不是很美观,可以早掘金查看https://juejin.cn/post/6952885561187270687。
2021-04-19 23:28:16
418
原创 js - 理解函数组合
怎么理解函数组合compose(f, g, t) => x => f(g(t(x))函数组合,字面意思将多个函数有序组合起来。有序组合的原因是不同的顺序返回的函数是不同函数。var { compose } = require('ramda')const f = x => x + 1;const g = x => x * 2;const fg1 = compose(f, g);const fg2 = compose(g, f);console.log(fg.
2021-04-19 23:12:08
577
1
原创 css BFC
前置回顾先回顾前面的文章:css 视觉格式化模型 (visual formatting model ) 盒模型的尺寸和类型定位方案【正常文档流,浮动和绝对定位】文档树内部元素之间的关系外部信息(视口大小,图片的固有尺寸等)总结,visual formatting model决定浏览器如何显示如何处理文档树。盒子类型和定位方案决定元素盒子如何在文档树中显示和放置。正常文档流 Normal flow在普通流中,盒子会依次放置。在块格式化上下文中,盒子在垂直方向依次排列;而在行.
2021-04-19 23:11:26
389
1
原创 js - 理解函数柯里化
怎么理解柯里化柯里化的意思就是将一个多元函数,转换成一个依次调用的单元函数。curry 的这种用途可以理解为:参数复用。本质上是降低通用性,提高适用性。f(a,b,c) → f(a)(b)(c)var add = function(x) { return function(y) { return x + y; }; };const increment = add(1);increment(10); // 11var { curry } = require('lodash
2021-04-14 20:29:02
309
1
原创 前端项目负责人需要具有的能力
前言因为业务线比较多,所以公司内部每一个项目当中都是一个中级开发在负责项目。所以也是给与一定培训和指导。以下内容全是从个人角度的理解去给与一些参照。技术能力基本的日常开发需求。前端技术体系。快速掌握和上手新技术的能力每一个负责人都有可能面对某个系统需要用到其他的新技术,或者以前没有接触过的技术,这里需要负责人有着自己的学习方法和学习能力,可以在短时间内掌握一门技术,快速进入开发,并在开发的过程当中继续积累和提高新技术指导和帮助初级同学解决问题这个环节不能缺失,这里就要求技术全面和思.
2021-04-01 23:32:01
1057
原创 css 视觉格式化模型 (visual formatting model )
为什么需要了解视觉格式化模型?解释一些css效果,下面的两个问题?下面child1:一般为了水平居中会在水平方向上设置auto,这里在垂直方向上设置auto,会导致垂直居中的效果呢? 下面两种方式一种是基于position,一种基于margin。可以观察chorme浏览器检查元素的不同水平垂直居中<html lang="en"> <head> <meta charset="UTF-8"> <title>Docu..
2021-03-29 23:03:29
767
原创 结构化思维-MECE分析方法
基本介绍MECE,是Mutually Exclusive Collectively Exhaustive的缩写,中文意思是“相互独立,完全穷尽”。 也就是对于一个重大的议题,能够做到不重叠、不遗漏的分类,而且能够借此有效把握问题的核心,并成为有效解决问题的方法。原则MECE即把一个工作项目分解为若干个更细的工作任务的方法。它主要有两条原则:第一条是完整性,说的是分解工作的过程中不要漏掉某项,要保证完整性; 第二条是独立性,强调了每项工作之间要独立,每项工作之间不要有交叉重叠。..
2021-03-20 00:01:57
1937
1
原创 typeof & instanceof
7种数据类型number, string, object, boolean, function, undefined, symboltypeof 1 // "number"typeof '1' // "string"typeof true // "boolean"typeof function() {} // "function"typeof [] // "object"typeof {} // "object"typeof null // "object"type
2021-03-15 11:15:17
256
原创 js继承图解
继承是面向对象编程中讨论最多的话题。很多面向对象语言都支持两种继承:接口继承和实现继承。前者只继承方法签名,后者继承实际的方法。接口继承在 ECMAScript 中是不可能的,因为函数没有签名。实现继承是 ECMAScript 唯一支持的继承方式,而这主要是通过原型链实现的。原型知识前置var Person = function(name){ this.name = name; // tip: 当函数执行时这个 this 指的是谁?};Person.prototype.getName.
2020-12-05 02:32:49
626
原创 代码分割 - React.lazy
import()在你的应用中引入代码分割的最佳方式是通过动态 import() 语法。使用之前:import { add } from './math';console.log(add(16, 26));使用之后:import("./math").then(math => { console.log(math.add(16, 26));});当 Webpack 解析到该语法时,会自动进行代码分割。如果你使用 Create React App,该功能...
2020-11-15 00:33:38
431
原创 js函数的参数都是按值传递怎么理解
ECMAScript 中所有函数的参数都是按值传递的。这意味着函数外的值会被复制到函数内部的参数中,就像从一个变量复制到另一个变量一样。如果是原始值,那么就跟原始值变量的复制一样,如果是引用值,那么就跟引用值变量的复制一样。对很多开发者来说,这一块可能会不好理解,毕竟变量有按值和按引用访问,而传参则只有按值传递。原始数据类型这里就不说了。只说一下引用数据类型。function setName(obj) { obj.name = "Nicholas"; } let person = .
2020-11-14 21:38:37
497
原创 github fork项目同步更新
背景:项目使用umi/sula的开源项目,遇到一些bug,本地修复提交merge请求之后,想同步更新sula的最新代码到本地fork的项目。可以看到sula在merge项目之后又有新的提交,所以fork的代码就想更新到最新的。解决:步骤1git remote add upstream xxxxgit remote add upstream git@github.com:umijs/sula.git此时我们本地会有两个远程的remote...
2020-10-27 23:42:07
2271
原创 react多页签页面缓存
demo分支代码:https://github.com/rodchen-king/ant-design-pro-v2/tree/tab-branch背景ant design pro v2的项目需要多页签显示页面而且还需要页面能够缓存下来。多页面展示 不同数据会对应不同的详情页面 代码里面的路由跳转可以正常进行页面切换 页签可以关闭主要设计:这里主要是考虑多页面+缓存问题。这里是借用了ant tabs标签的缓存作用。tabs的多页面只是显示和隐藏,组件本身还存...
2020-10-17 14:41:09
3188
原创 ant design pro v2 - 权限控制
同步语雀地址:https://www.yuque.com/chenzilong/nigxcx/qtv5n3github地址:https://github.com/rodchen-king/ant-design-pro-v2/tree/permission-branch后台管理平台内部权限大部分涉及到到两种方式:资源权限 & 数据权限1. 基本介绍资源权限:菜单导航栏 & 页面 & 按钮 资源可见权限。数据权限:对于页面上的数据操作,同一个人同一个页面不同的数据可能存在不
2020-09-15 21:05:28
1803
原创 webpack的初步入门
目录*. 写在开始*.1 同学们提出来的问题【镇楼】*.2 方式方法*.3 阶段目标*.4 本文的主线图*.5 学习要求1. 前端发展开始说起1.1 发展历史1.2 日益复杂的前端1.3 包管理的发展2. 前端为什么需要打包3. 前端可选的打包工具对比3.1 Grunt3.2 Gulp3.3 webpack 【webpack是什么?】3.4 webpack和gulp,grunt的对比4. webpack可以用来做什么【从零开始搭建简易.
2020-09-10 20:56:51
1982
原创 如何使用一行代码遍历二叉树累加求值?
问题背景如何想起里这个问题的,主要是在给成员讲解数组reduce方法的时候想到的。传给 reduce()和 reduceRight()的函数接收 4 个参数:前一个值、当前值、项的索引和数组对象。这个函数返回的任何值都会作为第一个参数自动传给下一项。第一次迭代发生在数组的第二项上,因此第一个参数是数组的第一项,第二个参数就是数组的第二项讲到函数返回的任何值都会作为第一个参数自动传给下...
2020-03-23 20:47:38
608
原创 服务器搭建npm私服
文章同步语雀地址:https://www.yuque.com/chenzilong/mxypih/lmv38lnpm 知识记录环境准备Nexus 3.2.1 需要JDK8,如果没有JDK,需要先到oracle官网上去下载Nexus 下载地址:http://www.sonatype.org/nexus/我的版本当前最新版本:nexus-3.20.1-01-un...
2019-12-29 14:55:12
2240
原创 微信公众号开发记录
近期在做微信公众号菜单跳转网页链接的一个应用,所以记录一下碰到的关键点。开发前准备具有网页授权的微信公众号/开发者账号因为我们这里有准备好的微信公众号,所以没什么问题,就是公众号需要开通相关的接口。开发环境需要的服务器和域名,域名解析到服务器,配置IP白名单基本设置 -> IP白名单公众号设置 -> 功能设置 -> 域名绑定 ...
2019-11-26 03:25:14
1203
原创 react refs
Refs (16.9.0)Refs提供了一种方式,允许我们访问DOM节点或在render方法中创建的React元素。使用场景管理焦点,文本选择或媒体播放。例如:新页面打开可以通过refs去显示的将鼠标聚焦于input输入框。触发强制动画。这种方式还没有遇到过。集成第三方DOM库。例如富文本编辑框,需要通过ref方式获取到富文本编辑框的文本内容。普通使用创建Refs...
2019-09-29 13:52:08
405
原创 create-react-app 支持IE(IE11/IE10/IE9)
create-react-app创建项目之后无法在IE上正常访问修改代码支持IE11 (github地址:添加代码支持IE11)修改package.json,index.js,然后删除node_modules,重新安装修改代码支持IE10/IE9(github地址:添加代码支持IE10/IE9)上一步骤之后,IE10/IE9存在下面问题(1)安装 core...
2019-09-06 10:51:08
7208
2
原创 create-react-app引入less
1. create-react-app创建项目2. npm run eject 暴露配置项3. 安装less less-loadernpm install less less-loader --save4. 配置config/webpack.config.js (github地址)5. 验证运行修改App.less,测试。...
2019-09-06 09:20:38
1498
原创 编写可维护的javascript - 基本格式化
由于新公司前期比较忙,之前也没时间学习新东西,但是目前感觉代码写的还是不够规范,所以也是花时间学习如何书写规范的代码,js/css/公共代码的书写。缩进层级:使用制表符进行缩进(制表符可以进行设置4个或者2个) 语句必须使用分号进行结尾 代码长度不超过80个字符 换行:通常会在运算符(避免ASI自动插入分号的问题)后面进行换行,下一行避免增加两个层级的缩进。变量赋值除外,变量赋值的下一行...
2019-05-18 23:22:25
361
原创 如何扩展element-ui应用项目
Github地址被我删除了,不记得这里文章有引用了,有需要的话可联系,在上传一份到github项目中可能会遇到需要扩展已经用到的前端框架,并且想在其文档中维护项目开发中新添加的组件。这里以element-ui扩展一个之前写的日历组件,并且应用到项目中使用。doc维护页面先看一下添加vue日历组件之后在页面的添加的日历组件展示。扩展element-ui步骤首先fork git...
2019-02-20 16:04:40
2488
1
原创 vue开发规范(单文件组件)
这里主要分为Vue风格指南和customer自定义风格,后续应该会继续更新。vue风格指南 优先级A(必要的) 组件名为多个单词export default { name: 'vue-calendar', components: { 'calendar-body': CalendarBody, 'calendar-header': CalendarHe...
2019-02-14 21:35:39
5838
原创 vue路由基础知识
Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成,让构建单页面应用变得易如反掌。这篇文章知识将路由基础知识按照下面的图解来学习梳理。项目注入项目主文件 main.js注册router文件// The Vue build version to load with the `import` command// (runtime-onl...
2019-02-12 16:02:03
427
原创 手写vue日历控件过程
之前项目中有用到日历控件,当时由于时间问题,是在网上找到一个demo,然后二次开发的,从那时就想着自己写一个日历控件。这篇文章说明日历数据的处理,去除月份天数判断以及是否闰年判断。 设计(以最常用的按月份的日历)日历其实大家都很熟悉,一切的设计都是从功能出发,这是根本。日历的功能分为两大块。日历头部:当前年份/月份。 日历主体:当前月份的具体的日期信息。 日历主体的行数:现在我们...
2019-02-11 21:23:22
2536
原创 vue 生命周期
最近一直在加班,都没时间学习,真的是对于vue的知识没有多少进步,昨天还在公司加班,今天抽空学习一下生命周期吧。生命周期基本介绍官方文档相关介绍生命周期。还是先举例子:<template> <div class="app-container"> <div> <h2>{{message}}</h2&g...
2019-01-20 21:47:47
759
原创 vue日期格式处理
项目开发中,由于后台返回的数据是时间戳,所以前台需要有一哥统一处理日期。举例:后台返回时间戳:1544942468922DocumentDate.Transfer(time).Format('yyyy-MM-dd', /*optional*/ nullValueShow)Transfer将时间戳转换成Date类型,Format第一个参数为日期格式,第二个参数为可选,当日期为nul...
2018-12-16 15:05:06
7030
原创 vue 组件通信
1. 父组件向子组件传值 Prop (1) props的接受方式说明 (2) prop命名问题 (3) prop的初始化处理 Prop 传值内容2. 父/子组件主动获取子/父组件 父组件主动获取子组件 子组件主动获取父组件3. 自定义事件4. 非父子组件通信5. 组件插槽 简单用法 具名插槽
2018-12-16 14:34:44
568
原创 vue表单基础
可以用 v-model 指令在表单 <input>、<textarea> 及 <select> 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。尽管有些神奇,但 v-model 本质上不过是语法糖。它负责监听用户的输入事件以更新数据,并对一些极端场景进行一些特殊处理。v-model 会忽略所有表单元素的 value、checked、se...
2018-11-11 21:03:18
2450
原创 vue事件
之前学习到v-on指令绑定,引入了事件绑定。所以这一章学习事件相关知识。先把之前的一个例子贴出来:<template> <div> <input type="text" v-bind:value="number"> <button @click="addFunction">number + 1</b
2018-11-11 13:44:23
1041
原创 vue指令
指令 (Directives) 是带有 v- 前缀的特殊特性。指令特性的值预期是单个 JavaScript 表达式 (v-for 是例外情况,稍后我们再讨论)。指令的职责是,当表达式的值改变时,将其产生的连带影响,响应式地作用于 DOM。 参数一些指令能够接收一个“参数”,在指令名称之后以冒号表示。例如,v-bind指令可以用于响应式地更新 HTML 特性:<a v-bin...
2018-11-10 23:41:50
563
原创 vue基础知识
写在开始,由于项目更换,需要用到vue + spring boot,所以这个周末又要突击一把了。其中如果有不对的地方还请指出来,毕竟是初学者。写博客当学习笔记。vue创建安装vue脚手架npm install -g vue-cli创建项目(学习以下面第一种方式创建项目)vue init webpack project-namevue init webpack-simpl...
2018-11-10 18:51:02
571
原创 Hyperledger Fabric介绍
Hyperledger 介绍Hyperledger Fabric是由IBM公司主导开发的一个面向企业级客户的开源项目。与比特币和以太坊这类公有链不同,Hyperledger Fabric网络中的节点必须经过授权认证后才能加入,从而避免了POW资源开销,大幅提高了交易处理效率,满足企业级应用对处理性能的诉求。同时,为了满足灵活多变的应用场景,Hyperledger Fabric采用了高度模块化的...
2018-11-05 22:16:01
6439
原创 区块链基础
基础1. 区块链技术名词 交易(Transaction):一次对账本的操作,导致账本状态的一次改变,如添加一条转账记录; 区块(Block):记录一段时间内发生的所有交易和状态结果等,是对当前账本状态的一次共识; 链(Chain):由区块按照发生顺序串联而成,是整个账本状态变化的日志记录。2. 区块链的类型 公有链,任何人都可以参与使用和维护,参与者多为匿名。典型的如比特币和以太...
2018-10-31 23:13:30
895
原创 Hyperledger Fabric环境安装
安装软件VirtualBox Vagrant为什么采用这个方式呢?我本地windows,以前为了安装环境重装了10了次系统才装好,还是使用虚拟机搭建ubuntu 16.04作为开发系统方便。 可以按照hyperledger fabric官网环境配置。安装步骤1. vagrant ssh进入虚拟机2. 添加账号添加一个新用户# sudo adduser rod将此...
2018-10-30 22:44:18
910
原创 账本进化-了解区块链
前言有快三个月没有写文章了,主要原因是个人思想问题,感觉有点彷徨。但是人可以彷徨一阵子,不能彷徨一辈子。第二个是最近两个多月在做区块链(基于hyperledger-fabric),对于这样一个东西,期间确实也碰到了许多坑,第二个也是还有许多东西还没有搞明白,所以准备重新梳理一下,第二个也是可以集中时间多研究一下其中内容。后面的文章会是一个系列:区块链介绍hyperledger-fa...
2018-10-19 00:05:38
711
原创 JSX须知
XML 基本语法定义标签时,只允许被一个标签包裹。标签一定要闭合 元素类型DOM 元素和组件元素。React中的我们的重点是组件,对应规则是 HTML 标签首字母是否为小写字母,其中小写首字母对应 DOM 元素,而组件元素自然对应大写首字母。JSX 还可以通过命名空间的方式使用组件元素,以解决组件相同名称冲突的问题,或是对一组组件进行归类。其实就好像不同对象中的同名方法一个道理...
2018-07-22 18:30:56
1175
原创 React初探
关于React,最近想花时间去了解学习,所以记录一些自己的学习内容。所有的内容只是自己的一些想法,不对的地方希望给与指正。 1. React关注于视图层因为之前学习过Angular,所以习惯Angualr的MVC的模式。Controller作为Model和View的中间层。接触React的时候,就感觉乱,没有明确的MVC结构的划分,Angular的时候,每一个组件偶都会有着几个单...
2018-07-22 18:18:23
746
原创 Angular4 - 构建以及部署
构建:编译和合并首先还是先将之前写的一个demo拿出来,https://github.com/rodchen-king/angular-blank在本地的开发是执行npm start来启动程序。这样的方式是在开发环境中进行的,在生产环境是不可以这样做的。我们开发环境中是typescript文件,我们不能将源代码直接放在生产环境,然后执行npm install去安装开发环境,在安装angular 命...
2018-07-07 01:00:27
2410
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人