blog icon indicating copy to clipboard operation
blog copied to clipboard

📝 My blog / notes

Results 86 blog issues
Sort by recently updated
recently updated
newest added

[Article Link](https://blog.bitsrc.io/what-is-a-pwa-and-why-you-should-care-388afb6c0bad) ### Summary: There are some core attributes which progressive web applications support. In other words, they are the reasons why we should care about PWA and apply it...

阅读笔记

js 如何截取一个字符串或数字中两个关键字段中间的字呢? 如我业务中遇到的一个问题,很多长字符串例如: 'Goal:Support Freyja users to use Google appUser Story:RCINT-6200:Support Freja users to use Google extensionRCINT-8671:Migration Check Point - Click to Dial & SMSComponent:Feature:Project:Tier(/s):' 我需要 截取'Goal' 和 'User Story'...

开发小记

### 单例模式: `定义`:保证一个类仅有一个实例,并提供一个访问它的全局访问点。 `例子`:单击登录按钮的时候,页面中会出现一个登录浮窗,而这个登录浮窗是唯一的,无论单击多少 次登录按钮,这个浮窗都只会被创建一次,那么这个登录浮窗就适合用单例模式来创建。 `实现思路`:用一个变量来标志当前是否已经为某个类创建 过对象,如果是,则在下一次获取该类的实例时,直接返回之前创建的对象。 ![image](https://user-images.githubusercontent.com/24861316/36572989-a161d5ec-1879-11e8-8a25-2e31bc0614e3.png) 以上是接近传统面向对象语言中的实现,单例对象从 “类”中创建而来。 JavaScript 其实是一门无类(class-free)语言,也正因为如此,生搬单例模式的概念并无 意义。在 JavaScript 中创建对象的方法非常简单,既然我们只需要一个“唯一”的对象。 `js版本定义`:保证一个全局对象仅有一个实例,提供给全局访问。 全局变量不是单例模式,但在 JavaScript 开发中,我们经常会把全局变量当成单例来使用。 例如: ```js var a = {}; ``` 当用这种方式创建对象 a 时,对象 a...

js
阅读笔记

### 日常git命令记录 每当你觉得文件修改到一定程度的时候,就可以“保存一个快照”,这个快照在Git中被称为commit。 `git log` :查看git历史记录 `git log --graph` :看分支合并图 `git log --pretty=oneline ` : 查看精简的git历史记录 ![image](https://user-images.githubusercontent.com/24861316/42334504-fa02dcd4-80af-11e8-9fbd-2d10de2e409a.png) 在Git中,用`HEAD`表示当前分支&版本,即图中的`master`,`commit 7b035146e7db9086b9e0973ba1de6f13a99721f1` 上一个版本就是HEAD^,上上一个版本就是HEAD^^,当然往上100个版本写100个^比较容易数不过来,所以写成HEAD~100。 `git reset --hard HEAD^ ` :回退到上一个版本 `git reset --hard {commit...

工具

在ES6出来前,js并无类,与类最接近的是:创建一个构造器,然后将方法指派到 该构造器的原型上。 可以通过我之前结合高程这本书整理的文章看看,[js面对对象(创建对象,实现继承)](https://github.com/aermin/blog/issues/31) 接下来,根据代码看看两者之间的联系,在原有的基础上吸收使用ES6的类。 ES6 之前,实现自定义类型的继承是个繁琐的过程。严格的继承要求有多个步骤。 ## ES6前的代码实现 ```js function Rectangle(length, width) { // ① this.length = length; this.width = width; this.test = "test~" } Rectangle.prototype.getArea = function() { //...

js

`概念`: - 一个app有一个store,一个store管理着一个全局state - createStore 传入reducer,返回getState, dispatch, subscribe - action是一个至少有type这个键的对象,可以写一个creactActioner 函数去return生成action对象 - createStore.dispatch(action) 根据action这个对象去更新state - dispatch是一个函数,内部有将执行reducer函数 - reducer也是一个函数,传入state,action, 输出一个新的state . (switch case return….) [demo链接](https://codepen.io/hxvin/pen/YjGmge?editors=1011) ![qq20180719-212609-hd](https://user-images.githubusercontent.com/24861316/42945304-a372bccc-8b9a-11e8-99b0-66c5abd2a0f0.gif) ```html ``` ```js //实现一个createStore function...

react

### 在本地修改pull request 场景:同学A提交了一个pr,同学B想把这个pr拉取到本地,并在这基础上进行修改,最后提交新的pr 1. 在repo中点击这个 ![image](https://user-images.githubusercontent.com/24861316/43686726-2b8a0a74-98fd-11e8-80b1-eb4147feeda1.png) 2. 然后选择你要修改和合并的pr ![image](https://user-images.githubusercontent.com/24861316/43686741-5ae823e6-98fd-11e8-8275-9e281188c9af.png) 3. 滑到底部点击链接:`command line instructions.` ![image](https://user-images.githubusercontent.com/24861316/43686808-31602d42-98fe-11e8-9d08-38c00b30df86.png) 4. 然后可看到github给出的接下去的操作 ![image](https://user-images.githubusercontent.com/24861316/43686816-3fbf9c6a-98fe-11e8-8967-105d0421da52.png) 其实就是创建一个分支,然后pull拉取同学A远程repo中提交该pr的的分支,这时本地仓库代码就是同学A提交的那个pr时的版本的仓库代码。 接着你可以进行修改,然后按照你的开发流程最终把你的修改也提交一个pr。 ![image](https://user-images.githubusercontent.com/24861316/43686905-a637c5de-98ff-11e8-8e56-31c91ba483be.png) `示例`: ``` git checkout -b caffffe-fix-it 2.0 ``` ```...

工具

### JSON.stringify json对象序列化成json字符串 console.log(JSON.stringify({name:'aermin',age:18})); // "{"name":"aermin","age":18}" [一道笔试题](https://juejin.im/entry/59a039995188252435079fa1?utm_source=gold_browser_extension) 当要转化的对象有“环”存在时(子节点属性赋值了父节点的引用),为了避免死循环,JSON.stringify 会抛出异常。 ```js const obj = { foo: { name: 'foo', bar: { name: 'bar', baz: { name: 'baz', aChild: null // 待会将指向obj.bar...

js

记得去年的春节,那时候已经想走前端这条路了,在一次同学聚会,喧闹的ktv中,跟软件专业的高中好友peyton讨论起了学编程这回事,给了我这个跨专业学编程的很多鼓励。 去年春节后算开始正式自学前端,至今满一年,这一路上其实还挺不容易。 一方面是起步低且晚,做为一名双非普通一本学校物理系的大三狗,除了考计算机二级临时抱佛脚看了一点C语言,其他无任何编程知识基础,基本也没啥圈内的程序猿可以交流,加上老是怕麻烦别人,索性基本自己靠搜索引擎摸索了,不过这样虽然一开始很难受,但倒也是养成了靠goole自己解决问题的能力和习惯。 另一方面是时间,因为大三课挺多的,而且为了大四能更好的实习,我还多修了两门课来凑学分,不过下学期退出了物理系的专题研究实验室,不过上学期在实验室学习的那些东西也不算作废,毕竟懂得了科研需要的寂寥和耐心。总之就是难度高的课上课听一些,难度不高的就课堂上看编程书,回宿舍就接着学,哈哈,菜并快乐着。最后通过《Head First HTML与CSS》,《JavaScript DOM编程艺术》,《JavaScript高级程序设计》,以及做百度前端IFE任务,最后算是初步入门前端了,这学期也拿了奖学金,时间管理和精力管理也稍有体会。 期间,我写了个vue项目[vue-home](https://github.com/hxvin/vue-home),到现在为止获得了一百多个`star`,对萌新来说也是一个鼓励。 大学中最充实的一学期,之前的两年半就在社团中迷茫度日。。有点可惜。 不过接着被直系学长推荐进了一个我们学校的学生工作室(感谢toad学长,一路上帮了我很多),然后就参与接了个外包。也开始懂得了项目开发流程,前后端联调,与UI的配合。 在暑假找了家当地算不错的上市公司进行暑假实习,实习学到了很多东西,不止前端,还有node(koa),php(这个没好好学,忘了个精光)都是在这边接触的,公司前端岗位偏全栈,前端写mvc的v层和c层。从导师那边学到不少编程经验和习惯。两个多月后,HR要帮我转试用,也就是确认毕业后留下来。那时候我提出来的薪酬挺廉价的,还是被压价1/12(有点明白哈登被雷霆压价的心酸) 😂给的待遇偏低(跟后来拿到的offer比,低了快一倍)。还有就是不大满意公司的技术氛围,基本是各干各的,有点郁闷,没啥技术交流。最后我选择了放弃转试用,回学校。不过这个暑假里很感谢公司,感谢增哥和元哥的指导,我获得挺大的成长,为伪全栈之路打下了基础,而且debug能力猛进😂,感谢公司陈年老bug的锻炼。 期间,我还在空余时间(公司不加班)根据同学的需求写了个跟爬虫有关的项目 [厦门校招君](http://www.hxvin.com:4000/) 接着就在10月中下旬(时间有点晚了其实)参加几家厦门公司的招聘,拿了几个offer。十月底选择了一家公司进行日常实习。在这边,业务繁多,导师太忙基本没怎么管你,我来了就马上独自负责vue的部分项目业务,跟着大家天天加班。这里技术氛围挺不错,和同事们的相处和合作很愉快,也经常技术交流。在这里,技术,业务逻辑思维和担当能力得到了不少锻炼,也学习了敏捷开发流程,其中我觉得收益匪浅的是从导师潮哥那里学到的有条理性地思考问题和解决问题,开发中注意时间管理和安排。最后, 受到了前辈们的称赞😊。 上了快三个月的班,想想毕业设计项目和论文还没写,就先回学校了,花了一个多月写了[airchat](https://github.com/hxvin/airchat)这个项目,又是收获满满,学到了很多,借着js这门神奇的语言,算是真的成了一名小伪全栈。而且这段时间看了《学习javascript数据结构与算法》和《图解http》这两本书,趁机打一下基础。 总结2017: - 搭上了前端的列车 - 拿了专业课的奖学金 - 跟同学一起接了个外包,写了[vue-home](https://github.com/hxvin/vue-home) ,[airchat](https://github.com/hxvin/airchat) 两个开源项目,和一个未开源项目 [厦门校招君](http://www.hxvin.com:4000/) - 实习半年,进步颇大 -...

随笔

对象: 对象具有自己的属性和方法 一辆汽车可以拥有油耗、颜色、轴距、速度等状态属性 一辆汽车可以拥有启动、行驶、加减速、刹车等方法 类:类是描述一类对象的状态和行为的模板 ![image](https://user-images.githubusercontent.com/24861316/44318387-35be0600-a468-11e8-855e-c6e8c8d5d9ab.png) ![image](https://user-images.githubusercontent.com/24861316/44318736-73bc2980-a46a-11e8-9cf1-b0c563fcec8b.png) package 是组织类的一种方式,通常以一个组织机构的域名的反写形式开头 如 com.github,有效防止类的命名冲突。 ![image](https://user-images.githubusercontent.com/24861316/44320474-bbe04980-a474-11e8-8ec2-13ec12e799ad.png) void: 方法的定义必须要有返回值类型修饰符,其中一个用来表明方法没有返回值,这个关键字是void。构造方法(构造函数)是一种特殊的方法,作用是初始化实例属性,和用于生成实例对象,没有显式的返回值,它被默认强制void。所以说构造方法和空方法都是void方法。但区别是构造函数能自动初始化。 ```java public class Car { // 成员变量 int color; int speed; // 方法 void startup() {...