haokur-优快云博客

原创文章归档

学习中很容易陷入一个怪圈, 就是自己会的熟的, 更喜欢一学再学, 会写的代码一写再写, 做着重复的事情, 而且还自我感觉良好. 好像一直在努力, 结果却并不如任意. 计划按以下清单, 逐一把自己已知的, 和查漏补缺加上未知的一些知识点, 总结一下.才疏学浅, 疏漏错误之处, 还请不吝赐教.

2018-05-25 10:33:08 790

1-100范围中，有1000个可重复的数，以出现次数的多少排序，返回一个新数组？蹦出来的第一个直观的解法，用一个对象将遍历的数组的出现次数记录下来，然后把记录的值排序，反查key，然后合并成一个数组。值排序处卡壳了一下。反思了下，得到一个有点笨但理解容易的解法。/** * 根据对象的一个属性排序 * @param data 原始数组(数组单个元素为对象) * @param sortKey 要根据排序的key * @param type desc 倒序, asc 正序 */funct.

2020-11-19 12:45:43 218

原创 webpack进阶

基于 webpack 提供的接口，社区可以贡献各种 loader 和 plugin，组合使用可以使得 webpack 的功能很丰富强大。常用 loadersass-loader，css-loader，style-loader => 加载样式url-loader => 加载文件，如字体文件和图片文件html-loader => 加载模板文件babel-loader...

2019-06-26 16:31:46 207

原创 webpack基础

安装npm install -g webpack webpack-cli快速开始最新的 webpack 支持零配置使用，默认入口为当前目录下的 src 中的 index.js 文件，默认打包输出的目录为 dist 目录，默认打包模式 mode 为 development先建一个文件夹，如 webpack-testwebpack-test 文件下新建一个 src 目录，再sr...

2019-06-25 16:08:08 194

原创大道至简，知易行易

大道至简，知易行易。如果知易行难，那就是知道的还不够透彻，选的路还不够简单。简单的事情也可以有伟大的成就，而且更容易成为。纵观诸多成功的产品，并不是本身有多么强大，而是它提供了一种模式，一种让众人拾柴火焰高的机会。比如 github ，我们为之神往的不是本身 github 的代码有多牛逼，而是上面诸多的开源项目，而这些都是社区的人贡献的。而也是因为它的模式是全员参与的，所以也不担心它有一天会...

2019-05-24 17:42:34 361

原创【前端工程化】git commit 提交规范

全局安装 commitizensudo npm install commitizen -g在项目目录下，添加 cz-conventional-changelog 适配器，直接使用 angular 的提交规范commitizen init cz-conventional-changelog --save --save-exact作用：package.json 中的 devD...

2019-05-16 16:05:54 1232

原创 Nodejs 开发命令行工具

准备工作安装 NodejsNodejs 官网下载起步新建一个目录，作为命令行工具源码目录。mkdir webflow-cli初始化 package.json 文件npm init --yes进入命令行工具源码目录（webflow-cli），并且新建 bin 文件夹，并创建主程序，wflow.jscd webflow-climkdir bi...

2018-08-06 21:15:57 4418

原创 Javascript 内置方法之 - XMLHttpRequest

XMLHttpRequest 类XMLHttpRequest 为 ajax 的核心。使用var xhr = new XMLHttpRequest()XMLHttpRequest 本质及构成本质为一个函数；typeof XMLHttpRequest ; // 'function'原型链关系：XMLHttpRequest “继承”于 XMLHttpRequest...

2018-08-02 18:16:56 8069

原创 javascript 基本方法扩展

一门语言会涌现出大量框架和库，说明它本身的不完善性。js 本身实现了核心功能，一些高级方法，需要使用者去完善。市面上有多如牛毛的库，这里也提供一些应用中常用的高级方法。

2018-07-18 17:12:58 484

原创 Vue 的 computed 和 method 的一些异同

相同点都是函数，都可以插值到 DOM 中，并且是响应式平时很少或基本不会在项目中使用 methods 中的方法执行插值的方式，也不推荐，但还是要了解可以这么做，以及为什么不这么做的原因。<template> <div> <div>{{ fullName }}</div> <div&...

2018-07-11 22:05:03 524

原创开发工具之 - git 篇

清单自动保存和清除已保留的 git 账号和密码自动保存配置删除基本操作, 按下不表自动保存和清除已保留的 git 账号和密码自动保存配置git config --global credential.helper osxkeychain删除mac打开自带 “钥匙串访问” > 侧边栏种类 > 点击密码 > 名称中找到...

2018-06-15 11:04:21 259

原创 Javascript 那些套路

模块化自己想要一个库 , 想让这个库可以通过 import 或者 require 导入, 也兼容浏览器直接导入时. ( 以 Tool 为例); (function (global, factory) { var isSupportModule = typeof exports !== 'undefined' &amp;amp;&amp;amp; typeof module !== 'undef...

2018-06-14 15:29:31 505

原创 javascript 进阶之 - 执行上下文

引言执行上下文 = 执行 + 上下文 ;也就是说执行上下文, 必然是伴随这执行的发生. 那么怎么才能执行?浏览器解析到 &amp;lt;script&amp;gt; 标签时或者成功加载外部脚本后, 会逐行执行, 也叫全局执行.在逐行读到函数调用时, 也会执行, 这是函数的执行.还有逐行读到比较特殊的 eval 语句, 也会执行 , 暂且称作 eval 执行. 相应的执行则会生成不同的上...

2018-06-05 18:39:03 530

原创 javascript 进阶之 - 原型和原型链

引言常规情况 , 原型 prototype 本质是一个对象 {} ; 原型链的链本质是一个对象引用 , 指向特定的 prototype 对象 ; prototype 和 __proto__ 都是对象上的一个属性; 也就是说 , 非常规的情况, 是可以手动修改 prototype 和 __proto__ 为任何值的.为什么需要 prototype ?就像工厂需要通过对原材料经...

2018-06-05 16:41:15 218

原创 angualr 之 - 实战项目 ionic-starter

有时候,你不必等到准备好一切才出发. 拿着这个现成的脚手架项目 , 先玩起来. 开始安装依赖环境npm install -g ionicnpm install -g cordova本地运行git clone https://github.com/haokur/ng5-ionic3-starternpm install npm start...

2018-06-04 23:21:05 715

原创 javascript 应用之 - 防抖节流

防抖什么是防抖? 为什么要防抖?频繁触发 , 只在停下来 n 秒之内无触发后 , 才执行相关操作 ; 因为有些复杂的操作, 如操作DOM , 频繁的触发很影响性能, 可能会把浏览器卡住.核心维护一个定时器, 也就是说对用户的操作 , 做延迟执行每次触发都先清除 1 中的定时器, 不管执行了与否 .简单实现function debounce(func, waitTim...

2018-06-04 22:19:18 174

原创 javascript 进阶之 - Promise

引言promise 主要解决了回调地域, 也就是嵌套太深的 callback, 而采用链式方式. 如:// 普通方式$.get({ url:'url', success:function(){ $.get({ url:'url2', success:function(){ ...

2018-06-03 18:58:19 456

原创 javascript 进阶之 - 事件循环

引言js 引擎是单线程, 所以同一个时间只能做一件事.js 的执行顺序核心是队列 , 而执行的核心是执行栈. 总是从事件队列取事件执行.js 代码有同步执行代码和异步代码, 却并不是以一段代码要执行的时间做区分.解析到 &lt;script&gt; 标签 , 或者成功加载一个脚本文件, 是在事件队列中添加了一个事件.粗略流程模拟浏览器开启 -&gt; js 引擎开启 -&gt...

2018-06-03 17:17:37 435

原创 css 基础之 - flex

flex 布局很重要很核心的一个概念就是 , flex 是有两个轴, 一个主轴, 一个交叉轴. 主轴永远和交叉轴互相垂直; 在未对子元素设置任何样式时, 子元素在主轴的表现, 由子元素内容决定, 而在交叉轴上则是占满交叉轴, 即为交叉轴的 100%; 在 flex 遇到 margin 和定义宽度, 总是会遇到一些意料之外的表现. 所以尽量少的 flex 属性和其他...

2018-06-02 22:30:44 286

原创 javascript 进阶之 - 预编译

引言在 javascript 的世界里, 恨不能所有的东西都能打印, 都能 debugger 打断点, 一步一步看其执行的逻辑 . 但是:有些属性限制了访问, 比如 [[Scopes]] , [[Class]] [[Caller]] … 让你不得而知其到底是个啥, 只能道听途说, 半猜地似懂非懂. 有些内置方法, 无法用代码查看 , 比如 Object 里面到底都进行了哪些操作.有些...

2018-06-02 14:34:45 241

原创 javascript 对象类型之 - Date

创建和类型判断var date = new Date();console.log(date); // Fri Jun 01 2018 11:10:58 GMT+0800 (CST)typeof date; // "object"date instanceof Date; // trueObject.prototype.toString.call(date); // "[objec...

2018-06-01 15:53:47 229

原创 javascript 对象类型之 - Array

概述var arr = [] ;typeof arr; // 'object'创建方式// 1.字面量式var arr1 = []; var arr2 = [1,2,3]; // 2.构造式var arr3 = new Array(); // []var arr4 = new Array(1,2,3); // [1,2,3]var arr5 = new Array...

2018-05-31 18:23:08 316

原创 css 应用之 - margin的妙用

margin 实现居中在限定盒子宽度的前提下.&amp;lt;style&amp;gt; .conatiner{} .inner{ width:100px; height:100px; background:orange; margin-left:auto; margin-right:auto; ...

2018-05-31 11:39:58 725

原创 javascript 基础之 - 分支

非 false 则为 truefalse 的情景:false0nullNaNundefined”其余的则都为 trueif else 系if , 如果括号内条件为真 , 则执行相关代码, 否则跳过var if(true){ console.log('执行');}if else 主要用于两分情景, if 条件和 else ...

2018-05-30 17:22:28 316

原创 javascript 基础之 - 递归

举个例子, 一组小朋友排了一个纵队, 类似这样 ‘张三’ -&amp;amp;amp;gt; ‘李四’ -&amp;amp;amp;gt; ‘王五’ -&amp;amp;amp;gt; ‘小明’ -&amp;amp;amp;gt; ‘小花’ -&amp;amp;amp;gt; ‘小黑’ ; 假如队列报数, 从张三开始, 很容易就能得出队伍的长度, 这是一个累加的过程. 现在又假如, 直接问小黑 ,

2018-05-29 18:05:12 247

原创 javascript 基础之 - 迭代

按顺序访问集合中的第一层次的每一项. 遍历迭代循环不必分的太细, 能完成业务需求就好.常规迭代for 循环// 什么是第一层次, 也就是深层遍历的反面var arr = [1,2,[3,4]];// 迭代的结果for(var i=0;i&lt;arr.length;i++){ console.log(arr[i]); }// 打印结果: 1 ...

2018-05-29 15:14:37 793

原创 javascript 基础之 - 迭代递归总览

通过有限次运行相同或类似的逻辑行为, 达成目标结果.循环重复执行行为while , 先判断再执行, 可能一次都不执行// 死循环while(true){}// 非死循环都有终止条件,退出循环// 循环体执行结果, 应是努力靠近判断的边界条件, 以期结束循环var a = 0while(a<10){ a ++; console....

2018-05-29 11:12:03 215

原创 javascript 基础之 - 函数

函数乃 javascript 中一等公民. 它和变量一样, 可以作为参数 , 也可以作为返回值在 js 的世界里到处穿梭, 畅通无阻.var fn = function(){}typeof fn ; // 'function'fn instanceof Function ; // trueObject.prototype.toString.call(fn) ; // &amp;amp;amp;quot;[o...

2018-05-28 22:44:38 300

原创 javascript 数据类型之 - Object

对象的存储都存堆内存, 在程序中访问和传递, 都按引用值访问和传递, 可类比快捷方式. 实质是一个无序的键值对集合.创建方式var obj = {} ;obj instanceof Object ; // truevar obj2 = new Object({});obj2 instanceof Object; // true// 用这种方式会有一点点不一样va...

2018-05-28 18:29:17 257

原创 javascript 数据类型之 - 总览

分类, 目前共 7 类stringnumberbooleanundefinednullsymbolobjecttypeof 操作符var str = 'hello';typeof str; // &amp;amp;quot;string&amp;amp;quot;var num = 1;typeof num; // &amp;amp;quot;number&amp;amp;quot;var b

2018-05-28 15:10:33 181

原创 javascript 数据类型之 - Symbol

ES6 新增数据类型, 类似于字符串类型, 通常用来作为对象的属性名.创建和使用var key = Symbol();typeof key ; // 'symbol'var obj = {}obj[key] = 'hello'console.log(obj); // {Symbol():'hello'}obj[key]; // 'hello'var key2 = ...

2018-05-28 11:28:56 959

原创 javascript 数据类型之 - Null

创建方式var a = null// 当通过 id 获取 DOM 元素不存在时var form = document.getElementById('#form'); // null// 但通过 class 和 tagName 获取不存在时var form = document.getElementsByTagName('form'); // HTMLCollection [] 空...

2018-05-27 23:29:00 279

原创 javascript 数据类型之 - Undefined

产生情景// 1.只声明,不赋值var something ;something; // undefined// 2.直接赋值undefinedvar other = undefined ;other; // undefined// 3.直接访问对象上不存在的值var obj = {}obj.name ; // undefined// 4.函数参数未传值funct...

2018-05-26 19:22:10 233

原创 javascript 数据类型之 - Boolean

创建方式// 字面量var bool = true// 构造类构造var bool2 = new Boolean(true); // truevar bool3 = new Boolean(1123); // truevar bool4 = new Boolean('12313'); // truevar bool5 = new Boolean(null); // false...

2018-05-26 18:38:01 178

原创 javascript 数据类型之 - Number

创建方式字面量var num1 = 1.2var num2 = 1构造函数式var num1 = new Number(1.2)var num2 = new Number('1.2')字面量和构造式的区别var num1 = 1.2567typeof num1 ; // "number"num1 instanceof Number; // fal...

2018-05-26 18:22:04 316

原创 javascript 数据类型之 - String

基本数据类型特点值不可以更改, 进行操作都是创建一个新的区域存放操作结果, 原值不变.简单类型, 只有值, 没有属性和方法, 相关操作是内部先转成相对应包装对象.创建方式字面量字面量表示如何表达这个值，一般除去表达式，给变量赋值时，等号右边都可以认为是字面量。字面量分为字符串字面量(string literal )、数组字面量(array literal)...

2018-05-26 16:42:52 239

原创也说说闭包

在一次面试的时候, 被问到谈谈闭包.一直觉得闭包这个词, 玄而又玄, 英文名叫 closure , 翻译过来叫闭包. 并不能一眼从字面上看出一点玄机.在用 chrome 浏览器调试的时候, 发现了函数对象上的一个 [[scope]] 属性. 数组类型. 凡自建函数 , [[scope]] 至少是有一个元素, 那就是全局作用域也就是整个 window 对象, 用 debugge...

2018-05-26 02:00:24 319

原创 centos5.6 生产环境部署

基本规范尽量源码安装 , 源码下载目录 /usr/src/安装目录 /usr/local一次性安装所有可能用到的依赖yum -y install make gcc-c++ cmake bison-devel ncurses-devel perl-DBD-MySQL gcc gcc-c++ openssl-devel curl-devel expat-devel gette...

2018-05-25 11:27:14 1007

原创陌上花开, 缓缓归

不发qq空间动态, 不发心情, 不发票圈. 有些心情, 有些想法, 只能憋着, 憋久了 , 很容易就郁闷了. 在这熙熙攘攘的大都市, 太多的压力, 需要一个出口, 需要一个驿站, 偶尔慢下脚步, 抽根烟, 长吁一口气.所以还是希望能找到一个出口, 释放心中一些压力. 记录一下成长的历程. 可以作为回忆, 也可以作为总结复盘使用.陌上花开, 人生是一场长跑; 不必总是火急火燎,...

2018-05-24 23:04:46 283

空空如也

空空如也