- 博客(48)
- 资源 (14)
- 收藏
- 关注
RSS订阅原创 React18 setState异步更新
因为setState是异步的，当前队列里，它在寻找myState的值的时候，通过作用域找到的是状态的初始值1，所以该更新执行后myState变为2，即从7->2。这里要注意，setTimeout整个函数式先执行的，回调会被放在宏任务里，它们的state的作用域是在click时候的状态下的上下文，即myState是1，flag是true。setState是异步更新的，setState((pre)=>...)此种更新方式将会依赖上一次的状态值，多个state更新会进行批处理更新，减少渲染次数。
2023-03-19 19:40:11
985
原创 @Inject与@Injectable
在Angular框架中，经常会使用到@Inject与@Injectable这两个装饰器。它们与框架的依赖注入系统息息相关。什么是Angular InjectorInjector，注入器。主要工作是否负责注入向服务与组件、指令等注入依赖。Injector主要通过Angular provider中的token进行查找需要注入的依赖。Angular Provider中提供了依赖的相关信息，比如token，创建实例的方式等。Injector通过这些信息进行创建实例，并负责把实例注入到服务、组件、指令中。
2021-02-02 13:34:37
5396
原创 Node.js 从零开发web server博客项目--controller与返回模型
上篇博客记录了《Node.js 从零开发web server博客项目》项目的初始化及初步的项目结构规划。开篇将继续接着上篇中的项目内容，介绍返回内容的设计与解析postData，接着重新梳理一遍项目的结构目录，培养搭建脉络清晰的项目的习惯。对于接口返回的内容结构，我们通过一个创建一个resModel.js进行说明。新建model/resModel.js,class BasicMode...
2020-05-08 13:22:57
540
原创 Node.js 从零开发web server博客项目--项目初始化
本篇博客记录了《Node.js 从零开发web server博客项目》的原生开发系列内容。开篇主要介绍原生项目的搭建，以及初步的项目结构设计。一、创建项目新建项目目录，并进入到项目目录中，使用命令npm init初始化项目，期间会让你配置项目名称，版本，作者等信息。结束之后生成package.json文件。...
2020-04-23 22:27:33
565
原创 在Angular中通过Subject进行组件之间通讯
Subject既可以当sender也可以自我subscribe，并且可以被多个订阅者订阅。在Angular中，我们可以通过创建一个服务来为不同的组件之间提供通讯服务。而通讯的实现就是通过Subject。第一步创建服务：import { Injectable,OnInit } from '@angular/core';import { Subject } from 'rxjs/Sub...
2020-03-08 18:02:25
976
原创 前端项目中常用到的指令汇总--持续更新
一、button中的点击事件节流需求：避免用户在持续单击按钮的时候不断触发绑定的函数调用，节约资源。方法：通过指令的方式赋予button新的click行为特定。注意：采用订阅的方式要注意在销毁的时候及时取消订阅。大致流程如下1、创建指令2、@HostListener中监听click事件，并将事件作为observable发出3、订阅发出的click事件，并且debounc...
2020-03-08 17:29:51
479
原创 Nodejs项目在docker中如何在dev、st、生产等环境切换配置
项目一般经历过dev、st、uat等环节之后才能正式部署到生产。对于不同的环境有不同的配置，比如数据库配置、反向代理配置等等。大部分项目可以通过环境变量配置区分dev、st、uat、prd等环境。Nodejs项目也可以采用这种方式实现切换。以部署在docker中的nodejs为例，阐述如何在不同环境中使用不同的反向代理。项目概况：nodejs项目，express框架，部署在docker中，...
2020-02-24 23:19:03
1739
原创 Angular第二路由named outlet在懒加载中的bug解决方案
第二路由，named outlet，也叫命名路由。一个template中只允许有一个无名主路由与多个named outlet。named outlet一般用来做弹框，弹窗使用，弹框只有手动关闭才能关闭，否则即使页面切换，页面中仍然会有弹窗存在。接下来介绍一个在懒加载模块中的第二路由的使用，在使用过程中会发现一个bug以及如何避免该bug。 创建一个新的模块，该模块在app模块中通过懒加载...
2020-02-23 23:26:25
474
原创 RxJS在Angular中的实战例子
一、输入框的联想输入要求：从输入中监听数据。（从keydown事件中获取事件宿主输入框中的值） 移除输入值中的前后空白符，并且长度符合要求 防抖（keyup时发送请求，这也会导致每敲一次键盘都会发出一次请求，如何优化？） 如果输入值没发生变化，则不用发出请求 如果已发出的ajax请求结果会因为后续的修改而变得无效，那就取消它开发环境主要信息：Angular5.x; RXJS:...
2020-02-23 21:48:15
781
原创 JS声明提前
直接上一段代码解释下声明提前alert(a) // 弹出函数aa(); // 弹出10, 因为函数定义全部都提升上去var a=3; function a(){ alert(10)} alert(a) // 弹出的是3a=6; a(); //报...
2019-11-22 17:54:59
163
原创 angular/cli eject项目之后，测试无法生成coverage 报告问题
一个angular项目，被我通过eject之后需要补充单元测试。执行karma start ./karma.conf.js --single-run --coverage之后，生成的coverage报告的icov.info为空。解决办法是在karma.conf.js中增加以下配置angularCli: {environment: 'dev',codeCoverage: true...
2019-08-05 19:38:49
794
转载 Angular paramMap、queryParamMap、snapShot该如何应用？
本文转载自：http://blog.tcs-y.com/2019/03/28/ng2-router-paramMap-queryParamMap/使用angular的router.navigate()方法进行跳转页面的时候，我们传值的方式有两种：使用链接参数数组：router.navigate(['/a', {code: '123'}])。构造的链接为/a;code=123. 使用查询参...
2019-08-05 19:37:54
4175
原创 Angular路由与项目结构的关系
1、项目结构决定路由配置Angular项目如何定义路由？我的一个做法是先确定项目的特性目录，即分清楚各个模块及其子模块，每个模块中的父子组件关系。理清模块（module）、模版（template）、组件（component）。模版提供插口router-outlet用于命中路由之后接入路由指向的页面。路由一般按照module组织，即一个module配一个路由模块（router module）。...
2019-08-05 19:33:22
258
原创 Spy的应用--Ionic单元测试如何解决UI组件依赖注入No provider for AlertController、LoadingController等问题
最近在写前端单元测试中遇到了一个多层依赖的问题。由于项目中使用了Ionic中的UI框架，在一些服务（service）文件中需要使用到一些弹框、菊花加载条、对话框等组件，所以会在service文件中依赖注入AlertController Loading等组件。在对这些service进行测试的时候，需要注入这些依赖。如TestBed.configureTestingModule({ ...
2019-07-15 15:00:54
330
原创 ng-zorro源码解读--属性装饰器
属性装饰器属性装饰器表达式会在运行时当做函数被调用，传入的参数有两个：1、对于静态成员来说是类的构造函数，对于实例是类的原型对象2、属性名称该方法应该返回一个函数，函数有两个上述的参数，并且在返回的函数中添加修改逻辑，如@PropertyDecorator('value') prop;function PropertyDecorator(value){ retur...
2019-06-26 18:20:04
2829
2
原创 @Inject与InjectionToken的使用
DI依赖注入是一种编码模式，构造函数中的参数通过注入器获取不需要自己创建。@Inject是参数修饰符，表示该参数是通过注入的方式获取。通过一段代码表示依赖注入与@Inject的使用有A类，B类，B类依赖类A：class A{ name:string; age:Number; constructor(n:string, a:number){ this.name = n;...
2019-06-25 20:17:58
4352
2
原创 JS面向对象程序设计--原型
一、原型对象JS中，函数都有原型，名称叫prototype。在面向对象中，构造函数也不例外。prototype的类型是object，也是对象，所以原型也叫原型对象。function Person(){};console.log(Person.prototype); //object// 实例的__proto__指针var p1 = new Person(); // __pr...
2019-06-20 17:12:05
161
原创 JS面向对象程序设计--创建对象的常见方法
方式一：工厂模式function createPerson(name, age, job){ var person = new Object(); person.name = name; person.age = age; person.job = job; person.sayName = function(){ alert(this...
2019-06-20 13:10:57
182
原创 JS面向对象程序设计--对象属性
1、数据属性与访问器属性、定义多个属性var object = new Object();Object.defineProperty({ object, "key", { configurable:true, writable:trune, value:'value'， enumrable:true,...
2019-06-17 13:18:52
186
原创 前端装饰器
1、javascript中的装饰器装饰器是对类、方法、属性的修饰，增加额外的行为。装饰器不侵入，所以对原先的内容不会破坏。装饰器可以理解成一种解决问题的通用思路，装饰器模式遇到程序之后诞生了多种多样的表现形式。javascript也引入了装饰器这一实验内容，在typescript中已经有使用的案例。这篇博客记录方法的装饰器，先梳理下装饰器的思路。比如有一个run方法，原先的run方法只是简...
2019-06-04 00:11:50
1031
原创 如何学习NgZorro的源码
1、先阅读ng-zorro的官方文档，比如nzButton的如何使用方法，产生的效果，形成初步的映象。我们先看最简单的使用方法：<button nz-button nzType="primary">Primary</button>效果就是一个圆角蓝色背景的按钮，按钮带有文字Primary，鼠标点击按钮有波纹效果。2、选中按钮审查元素，观察审查元素中的htm...
2019-05-17 00:14:29
2163
原创 Git之修复生产bug
master分支版本一般为生产上的版本，生产出现问题，该如何操作修复bug？1、确定主分支上哪个提交之前是生产上的版本，找到生产上版本的最后一次提交commit hash码2、新建bugfix分支，并切换到bugfix分支Git checkout -b bugfix commithashcode3、修改bug，提交正常的commit push如果提示无法正常push则会提醒...
2019-04-24 20:32:07
965
原创 CSS盒子模型、边距重叠、计算宽高
CSS盒模型笔记，主要包括了盒模型的标准模式和IE模式的区别，通过box-sizing属性设置宽高的计算方式，盒模型中的边距重叠问题，几种通过js获取宽高的方法，BFC相关概念以及BFC的几种使用场景。1、IE模式和标准模式先敬上一张描述这两种模式的图：标准模式和IE模式区别在于计算width与height的方式。但是总宽度和总长度的计算方式是一样的。可以通过box-siz...
2019-02-24 17:20:12
500
原创 CSS中的BFC
这篇笔记记录了BFC的概念，特点，创建BFC的方法，应用等。1、BFC的概念Block Formatting Context，块级格式化上下文。可以理解成一个独立的容器，与外界互不相干，互不打扰。2、BFC的特点（1）、相邻块级，垂直方向上的边距重叠（2）、BFC区域不会与浮动元素重叠（清楚文字环绕）（3）、BFC的独立性，里外互不影响（4）、BFC块内的浮动元素会参与...
2019-02-24 17:18:27
219
原创 Ionic项目单元测试
这篇文章记录了使用github上的一个含有单元测试配置的Ionic项目改造自己的项目，使自己的项目也能跑单元测试。Ionic版本3.x，参考的github项目地址：https://github.com/ionic-team/ionic-unit-testing-example修改自己的项目步骤如下：1、将示例项目的devDependencies中的依赖增加到自己的项目中，主要需要如下依...
2019-02-18 15:32:02
504
原创 6.3一图读懂JavaScript原型链--JavaScript高级程序设计笔记
实例instance有__pro__指针指向类的原型SubType.prototype； 实例instance有constructor指针指向SuperType，实际上就是SuperType实例constructor的指向； SubType.prototype是SuperType的一个实例，即SubType的原型为SuperType的一个实例; SubType.prototype有一个_...
2018-12-13 13:16:05
214
原创 总结：前端泛型在工作中的应用--TypeScript
1、应用场景前端需要对一个数据列表进行模型化（data-model），假设这个数据模型的类型是A，我希望将后端返回的json数组转化为类型A的列表即Array<A>(A[])，数据模型多种多样，其他页面的列表需要转化成B[],C[]等等，因此，我需要定义一个方法，这个方法能够将json数组（可视为Object array）转化成我想要的对象数组。对于这个问题我们可以用泛型来解决。...
2018-12-09 22:00:40
475
原创 前端数据模型（data model）该使用InterFace还是Class--TypeScript
在工作当中，对于前端页面上的一些数据会定义数据模型（data model），这时候该使用interface还是class呢？对于interface和class的介绍，可以查看typescript官网https://www.tslang.cn/docs/handbook/interfaces.html和https://www.tslang.cn/docs/handbook/classes.htm...
2018-12-08 17:45:14
3700
1
原创 Angular测试机床TestBed
用测试机床TestBed准备测试环境：TestBed.configureTestingModule({imports:[],providers:[]});-imports引入需要的模块，如果有请求，则需要引入HttpClientTestingModule，使用HttpClientController拿到请求，并mock返回数据;-providers注入相关的服务，互相依赖的...
2018-12-05 13:23:16
1065
1
转载 Git分支
Git 分支几乎每一种版本控制系统都以某种形式支持分支。使用分支意味着你可以从开发主线上分离开来，然后在不影响主线的同时继续工作。在很多版本控制系统中，这是个昂贵的过程，常常需要创建一个源代码目录的完整副本，对大型项目来说会花费很长时间。有人把 Git 的分支模型称为“必杀技特性”，而正是因为它，将 Git 从版本控制系统家族里区分出来。Git 有何特别之处呢？Git 的分支可谓是
2016-12-02 11:41:05
434
转载 Egit fetch from upstream 与 pull的区别
原文： http://www.tech126.com/git-fetch-pull/ Git中从远程的分支获取最新的版本到本地有这样2个命令：1. git fetch：相当于是从远程获取最新版本到本地，不会自动merge Git fetch origin mastergit log -p master..origin/mastergit merge origin/mast
2016-11-23 10:59:09
17608
转载 解决Eclipse中使用Egit无法push to upstream的问题
在上一篇《Eclipse 使用Egit插件通过SSH上传代码到GitHub》中，本人通过Egit上使用ssh方式上传代码到github中，但是后面出现了问题，每次修改完代码之后想push到github上，发现push to upstream为灰色无法点击。通过查阅其他朋友的解决方案得到了问题答案。在新建完本地仓库与远程仓库，并commit本地仓库之后，需要配置仓库。具体方案如下：1、w
2016-11-23 10:54:11
6665
原创 亚马逊店铺健康因素总结
一、亚马逊店铺的几个状态图片有点长，切成两部分了二、影响亚马逊账户的几个因素参考文章：1、http://bbs.fobshanghai.com/thread-6612766-1-1.html2、http://bbs.fobshanghai.com/thread-6612714-1-1.html
2016-11-12 17:46:48
800
原创 亚马逊账户关联
一、关联账户的危害多账号如果不幸被关联，亚马逊不会以任何一种形式通知你，只有你自己清楚是否被关联。关联的后果比较严重，一单某个账号被关，其他关联的账号也会被牵连。二、关联因素2.1 IP因素如果使用相同的外网IP登录不同的账号，这种情况会被亚马逊记录，作为关联因素之一，但不会仅仅因为这个因素马上判定关联。2.2浏览器指纹浏览器指纹包含以下内容：（1）USER-A
2016-11-10 17:12:00
2091
原创 Eclipse 使用Egit插件通过SSH上传代码到GitHub
以下的叙述是基于已经在github.com上注册了账户，并且在Eclipse中安装了Egit插件。1、SSH上传代码原理使用SSH主要考虑两个方面，一个是安全，第二个是传输速度比较快。当然还有其他的一些优点比如不用记密码，管理起来也比较方便。具体的SSH原理参考文章SSH原理http://blog.youkuaiyun.com/aug0st/article/details/403245972、
2016-10-06 11:25:27
1960
原创 NoiseAPI第一版
编辑日期 2015年11月22日版本：第一版1、 上报用户状态（1） url: http://domain/ReportUserState 方法：post（2） 参数说明（都是String类型）参数含义举例reportTime手机时间2015-11-22 2
2015-11-24 08:22:55
468
原创 spring+mybatis+restful的搭建
近期需要写一个android项目，服务端由我负责，打算使用spring+mybatis+restful搭建。搭建过程如下，具体细节日后有时间再整理。1、新建一个Dynamic web项目，Eclipse版本如下：Eclipse Java EE IDE for Web Developers.Version: Luna Release (4.4.0)2、引入spring mybatis jer
2015-05-18 10:50:23
2601
转载 ubuntu12下安装jdk1.7与eclipse
今天在虚拟机ubuntu上安装jdk，查阅相关文章之后，结合各篇文章的方法，最终成功安装。现将过程记录下来。1、下载好linux适用的jdk1.7，我的是解压放在usr/lib/jvm下。2、 配置环境变量sudo gedit ~/.profile，在最后面加上以下配置export JAVA_HOME=/usr/lib/jvm/jdk1.7.0_07export JRE_HO
2015-05-11 16:59:03
531
原创 Linux mesg命令的简单实现
实验题目：不想被那些发送 write 的人打扰的用户可以使用命令 mesg。阅读 mesg.通过程 序试验以了解它如何工作,然后写)个这样的程序。首先我们得知道mesg命令是做什么的。实际上， mesg命令决定是否允许其他人传讯息到自己的终端机界面y : 允许讯息传到终端机界面上。n : 不允许讯息传到终端机界面上 。如果没有设定，则讯息传递与否则由终端机界
2013-05-11 21:19:50
1728
原创 Linux write指令的代码实现(自己编写实现)
系统：ubuntu10.10实验题目： 编写⼀个 write 简单版本,能够接受用户名作为参数,并 在屏幕上显示你想通信的用户。查看 write 的标准版本显示的内容。 你的程序应该可以处理这样的特殊情况:你想聊天的人可能没有登录。另⼀方 面,你想聊天的人可能登录了若干个终端。 解决过程：记得当时安装虚拟系统时，只设定了一个用户，为了做这个实验我必须添加几个用户。如果你系统
2013-05-11 00:49:32
1354
1
Linux/unix 实践教程
2013-05-11
汽车加油问题
2013-05-11
骑士巡游 回溯法
2013-05-10
骑士巡游问题
2013-05-10
数字计数问题
2013-04-07
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人