<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[huangssssx的专栏]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/huangssssx</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; huangssssx]]></copyright><item><title><![CDATA[vue-router 使用name跳转时，404失效的问题]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/120483863</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/120483863</guid><author>huangssssx</author><pubDate>Sun, 26 Sep 2021 10:55:23 +0800</pubDate><description><![CDATA[使用name跳转的时候，如果路由表中没有找到对应的name的时候，并不会跳转到404页面，例如下面的代码：


    gotoUserCenter() {
      this.$router.push({ name: 'userCenterPage' })
    },

当name：“userCenterPage”不存在于路由表中时就会跳转到一个空白页面，而并不会跳转到404页面，其实是因为vue-router没有对这种情况做什么处理：



当前网上的应对方案是1. 不使用name来跳转 2. 在守]]></description><category></category></item><item><title><![CDATA[ubuntu下的docker配置]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/103545559</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/103545559</guid><author>huangssssx</author><pubDate>Sun, 15 Dec 2019 04:32:07 +0800</pubDate><description><![CDATA[1. 起因
公司里的代码管理用的还是svn，这种古老的代码库造成了代码合并是个痛苦的事情，所以急需一个靠谱的git私库关于管理小组的代码，这个时候我将目光移向了docker，毕竟方便的开箱即用不香么？
2. 安装docker
折腾了很久的ubuntu安装docker的教程，始终卡在docker的download源404问题上
root@huangssssx-TM1801:/etc/apt# add...]]></description><category></category></item><item><title><![CDATA[关于new操作符的分析]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/102340226</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/102340226</guid><author>huangssssx</author><pubDate>Tue, 08 Oct 2019 00:35:54 +0800</pubDate><description><![CDATA[关于new操作符的分析
1. new的执行步骤

生成一个新的object.
将构造函数的上下文指向object.
当构造函数返回值是基本数据类型时返回object,否则返回原始返回值。

2. 代码
function _new(fun,args){
	let o = Object.create(fun.getPrototypeOf());
	let res = fun.apply(o,args)...]]></description><category></category></item><item><title><![CDATA[前端面试题]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/99830489</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/99830489</guid><author>huangssssx</author><pubDate>Tue, 20 Aug 2019 13:41:22 +0800</pubDate><description><![CDATA[1. script标签中defer和async属性的区别
答：
a&gt; 如果没有defer和async
浏览器会立即加载并执行js脚本，此时后续文档流的渲染将会被阻塞。
b&gt; 如果是defer标志
当浏览器遇到这种标签时，会开始加载script标签内容，但是不会阻塞后续文档元素的渲染，待所有页面元素解析完成后，DOMContentLoaded 事件触发之前执行这个script标签的代码。...]]></description><category></category></item><item><title><![CDATA[react-tree-walker 源码阅读]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/99713436</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/99713436</guid><author>huangssssx</author><pubDate>Mon, 19 Aug 2019 09:42:40 +0800</pubDate><description><![CDATA[/*
 * @Description: In User Settings Edit
 * @Author: your name
 * @Date: 2019-08-18 13:12:37
 * @LastEditTime: 2019-08-18 23:19:58
 * @LastEditors: Please set LastEditors
 */
var defaultOptions = {
...]]></description><category></category></item><item><title><![CDATA[nodejs控制台彩色文字输出]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/97576682</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/97576682</guid><author>huangssssx</author><pubDate>Sun, 28 Jul 2019 00:43:37 +0800</pubDate><description><![CDATA[console.log('\x1B[36m%s\x1B[0m', info);  //cyan
console.log('\x1B[33m%s\x1b[0m:', path);  //yellow
var styles = {
    'bold'          : ['\x1B[1m',  '\x1B[22m'],
    'italic'        : ['\x1B[3m',  '\x...]]></description><category></category></item><item><title><![CDATA[外边距塌陷(margin collapse)]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/95041071</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/95041071</guid><author>huangssssx</author><pubDate>Sun, 07 Jul 2019 23:23:38 +0800</pubDate><description><![CDATA[流内块组件的top/bottom有时候会合并为单个外边距（合并后最大的外边距），这样的现象被称为外边距塌陷。
https://blog.youkuaiyun.com/sinat_22996989/article/details/47255541

...]]></description><category></category></item><item><title><![CDATA[css 布局]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/94996986</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/94996986</guid><author>huangssssx</author><pubDate>Sun, 07 Jul 2019 16:36:43 +0800</pubDate><description><![CDATA[1. 水平垂直居中（css3）：

&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
    &lt;me...]]></description><category></category></item><item><title><![CDATA[【VUE实战】学习笔记（三）]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/91661938</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/91661938</guid><author>huangssssx</author><pubDate>Wed, 12 Jun 2019 23:49:26 +0800</pubDate><description><![CDATA[v-bind指令：
作用：用于动态更新HTML上的属性，当数据变化时，就会重新渲染。
缩写:v-bind:class=“xxxx” 等于:class=“xxxx”


绑定class的几种方式：



受控方式


  &lt;div class="container" :class="{'red':isRed ,’ error ’:isError}"&gt;
    &lt;a v-bind...]]></description><category></category></item><item><title><![CDATA[javascript 执行机制]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/91358678</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/91358678</guid><author>huangssssx</author><pubDate>Sun, 09 Jun 2019 22:50:00 +0800</pubDate><description><![CDATA[事件循环Event Loop
https://segmentfault.com/a/1190000013102056
https://www.cnblogs.com/intangible/p/8066979.html
console.log('1');

setTimeout(function() {
    console.log('2');
    process.nextTick(funct...]]></description><category></category></item><item><title><![CDATA[leetcode(二)宝石与石头]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/91355690</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/91355690</guid><author>huangssssx</author><pubDate>Sun, 09 Jun 2019 18:42:17 +0800</pubDate><description><![CDATA[给定字符串J 代表石头中宝石的类型，和字符串 S代表你拥有的石头。 S 中每个字符代表了一种你拥有的石头的类型，你想知道你拥有的石头中有多少是宝石。J 中的字母不重复，J 和 S中的所有字符都是字母。字母区分大小写，因此"a"和"A"是不同类型的石头。

示例 1:
输入: J = “aA”, S = “aAAbbbb”
输出: 3
示例 2:


输入: J = “z”, S = “ZZ”
输出...]]></description><category></category></item><item><title><![CDATA[leetcode(一)两数之和]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/90745674</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/90745674</guid><author>huangssssx</author><pubDate>Mon, 03 Jun 2019 00:11:50 +0800</pubDate><description><![CDATA[问题：

给定一个整数数组 nums 和一个目标值 target，请你在该数组中找出和为目标值的那 两个 整数，并返回他们的数组下标。
你可以假设每种输入只会对应一个答案。但是，你不能重复利用这个数组中同样的元素。

示例:

因为 nums[0] + nums[1] = 2 + 7 = 9
所以返回 [0, 1]

回答：
/**
 * @param {number[]} nums
 * @pa...]]></description><category></category></item><item><title><![CDATA[【VUE实战】学习笔记（二）]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/90708505</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/90708505</guid><author>huangssssx</author><pubDate>Thu, 30 May 2019 23:42:53 +0800</pubDate><description><![CDATA[1.计算属性：
计算属性是对【复杂表达式=&gt;数据】的聚合，并不一定是个纯函数，但是最好能用一个纯函数作为计算属性。
&lt;template&gt;
  &lt;div class="lesson2"&gt;{{personNames}}&lt;/div&gt;
&lt;/template&gt;

&lt;script&gt;
export default {
  name: "Hello...]]></description><category></category></item><item><title><![CDATA[【VUE实战】学习笔记（一）]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/90614436</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/90614436</guid><author>huangssssx</author><pubDate>Tue, 28 May 2019 00:00:43 +0800</pubDate><description><![CDATA[1. 前言：

插值与表达式。
生命周期。

2. 生命周期：

created 实例创建完成后调用，此阶段完成了数据的观测等，但尚未挂载， $el 还不可用。
需要初始化处理一些数据时会比较有用，后面章节将有介绍．
mounted el 挂载到实例上后调用，一般我们的第一个业务逻辑会在这里开始
beforeDestroy 实例销毁之前调用。主要解绑一些使用 addEventListener 监听...]]></description><category></category></item><item><title><![CDATA[设计模式（九）组合模式]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/89189974</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/89189974</guid><author>huangssssx</author><pubDate>Wed, 10 Apr 2019 18:07:22 +0800</pubDate><description><![CDATA[1. 前言：


使用场景：
部分、整体场景。比如：树形菜单、文件文件夹的管理


优点：
高层模块调用简单，节点自由增加。


缺点
当系统业务复杂时，实现组合模式将会非常困难，并非所有组件的业务都是一致的，而对于这将造成不可避免的冗余。比如：root节点需要提供层级缩略图功能，但是子节点并不需要，但是由于使用了组合模式则每个对象都有同样的代码，这导致无谓的浪费。


例子：
&lt;!DOCT...]]></description><category></category></item><item><title><![CDATA[设计模式（八）过滤器模式]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/89076881</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/89076881</guid><author>huangssssx</author><pubDate>Sun, 07 Apr 2019 22:45:05 +0800</pubDate><description><![CDATA[1. 前言
过滤器模式是个比较特殊的模式，它没有很复杂的结构，作为一个模式来说它太简单了，简单到只有一个输入和一个输出，可以认为是个不标准的纯函数（因为输入的数组引入了外部干扰的可能）。

使用场景：当需要将过滤逻辑和业务代码解耦的时候
优点：可复用，解耦过滤逻辑。
无

2. 代码:
&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
&lt;head&gt...]]></description><category></category></item><item><title><![CDATA[设计模式（七）桥接模式]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/88933598</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/88933598</guid><author>huangssssx</author><pubDate>Sun, 31 Mar 2019 19:12:29 +0800</pubDate><description><![CDATA[1. 前言：


使用场景：
当涉及到多维度时，也就是多层继承的情况时。


优点：



抽象和实现的分离。
优秀的扩展能力。
实现细节对客户透明。


缺点：
桥接模式的引入会增加系统的理解与设计难度，由于聚合关联关系建立在抽象层，要求开发者针对抽象进行设计与编程。

2. 例子
使用继承实现时：

可以看出当要增加一个新的产品时，比如:LenoveDesktop，则需要影响到两个维度：电脑种...]]></description><category></category></item><item><title><![CDATA[设计模式（六）适配器模式]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/88896856</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/88896856</guid><author>huangssssx</author><pubDate>Fri, 29 Mar 2019 16:48:29 +0800</pubDate><description><![CDATA[1.前言
说起适配器模式最先想到的例子就是110v和220v插头转接器的例子了：

有一天你从香港买来一个iphone8，但是香港的插头要比大陆地区的插头大一些，你回到家之后发现在现有的屋子环境下找不到合适的插口能够插入这个插头。现在有两个办法，一是：更换屋里的所有的或者部分插口能够插下iphone8，但是这个行不通的，家是在大陆，一般电器插口还是国标的，虽然解决了我一时需要使用ip8，但是手机更...]]></description><category></category></item><item><title><![CDATA[设计模式（五）原型模式]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/88867291</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/88867291</guid><author>huangssssx</author><pubDate>Thu, 28 Mar 2019 13:39:16 +0800</pubDate><description><![CDATA[1.前言

使用场景：


当创建一个对象的前置操作会耗费非常多的资源时。比如初始化一个实例需要查询多个数据库的时候，这个时候我们只需要考虑输入输出时候存在唯一对应关系，如果是的话就可以将结果缓存起来，当下次需要再次生产该类型的对象时clone一份就可以，节省了巨大的系统资源。
当类的实例种类有限时。因为原型模式实际上就是一种缓存模式，当类的实例类型很多的时候比如：animals类，根据场景不同产...]]></description><category></category></item><item><title><![CDATA[需要完成的任务计划]]></title><link>https://blog.youkuaiyun.com/huangssssx/article/details/88732583</link><guid>https://blog.youkuaiyun.com/huangssssx/article/details/88732583</guid><author>huangssssx</author><pubDate>Thu, 28 Mar 2019 11:05:52 +0800</pubDate><description><![CDATA[1.编程模式学习
2.mongodb学习
3.uml学习
4.http协议学习
5.java学习（目前重点是网络编程方面）

]]></description><category></category></item></channel></rss>