<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[samfung09的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/samfung09</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; samfung09]]></copyright><item><title><![CDATA[HTTP协议]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/105061633</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/105061633</guid><author>samfung09</author><pubDate>Tue, 24 Mar 2020 00:12:24 +0800</pubDate><description><![CDATA[TCP/IP协议族

TCP/IP协议族是一个网络通信模型，以及一整个网络传输协议家族，为互联网的基础通信架构。该协议家族的两个核心协议：TCP（传输控制协议）和IP（网际协议），为该家族中最早通过的标准。这个协议族由互联网工程任务组负责维护。TCP/IP 协议族是Internet最基本的协议，HTTP协议是它的一个子集。TCP/IP协议族按层次分为以下5层。





1、物理层（实体层）

...]]></description><category></category></item><item><title><![CDATA[CSS3简单写个圆形进度条动画]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/104024958</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/104024958</guid><author>samfung09</author><pubDate>Fri, 17 Jan 2020 21:39:06 +0800</pubDate><description><![CDATA[圆圈转动完整代码

html


&lt;div id="wrap"&gt;
    &lt;div class="box-left"&gt;
        &lt;div class="circle-left"&gt;&lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="box-right"&gt;
        &lt;div class="ci...]]></description><category></category></item><item><title><![CDATA[Object.defineProperty和Proxy对比]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/103758871</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/103758871</guid><author>samfung09</author><pubDate>Sun, 29 Dec 2019 23:59:47 +0800</pubDate><description><![CDATA[Object.defineProperty(obj, prop, descriptor)

MDN文档

第三个参数的解释：

configurable：属性是否可配置（重新defineProperty），是否可删除，默认false

enumerable：属性可否被遍历，默认false

writable：配合value使用，可否修改value，默认false

value：默认undefine...]]></description><category></category></item><item><title><![CDATA[vue-router原理解析]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/103656597</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/103656597</guid><author>samfung09</author><pubDate>Sun, 22 Dec 2019 20:28:39 +0800</pubDate><description><![CDATA[更新中...
]]></description><category></category></item><item><title><![CDATA[vue的一些知识点]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/80392191</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/80392191</guid><author>samfung09</author><pubDate>Sun, 15 Dec 2019 20:51:14 +0800</pubDate><description><![CDATA[数据更新列表却不重新渲染

例如数组中一个对象中的一个字段数字变了，这时vue并不会更新视图。为什么呢？

还是上面举的例子，用 this.$set 解决


//购物车中某个商品数量加1了，这时再watch环境下
if(this.goodsList.length &gt; 0){//如果购物车列表有数据则寻找有没有已存在的
    this.exist = this.goodsList.some...]]></description><category></category></item><item><title><![CDATA[JavaScript小妙招2]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/103359592</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/103359592</guid><author>samfung09</author><pubDate>Tue, 03 Dec 2019 00:18:31 +0800</pubDate><description><![CDATA[二、十、十六进制转换

二进制十进制互转





二进制转十六进制





位运算符~、&amp;、|、^、&lt;&lt;、&gt;&gt;

链接

位运算符是在数字底层（即表示数字的 32 个数位）进行操作的。

~ 加一取反


var a = 2;
console.log(~a)    //-3
a = -9;
console.log(~a)    //8



&amp;


...]]></description><category></category></item><item><title><![CDATA[Node.js爬取百度图片之解析objURL外加随手写个瀑布流]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/102557812</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/102557812</guid><author>samfung09</author><pubDate>Mon, 14 Oct 2019 22:13:40 +0800</pubDate><description><![CDATA[分析请求地址

先来分析一下请求地址，我搜索的是“古力娜扎”


https://image.baidu.com/search/acjson?tn=resultjson_com&amp;ipn=rj&amp;ct=201326592&amp;is=&amp;fp=result&amp;queryWord=%E5%8F%A4%E5%8A%9B%E5%A8%9C%E6%89%8E&amp;cl=2&a...]]></description><category></category></item><item><title><![CDATA[AJAX封装]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/102180688</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/102180688</guid><author>samfung09</author><pubDate>Sat, 05 Oct 2019 23:20:27 +0800</pubDate><description><![CDATA[一些前置知识

AJAX状态（readyState）

0 ---------- unsent 刚开始创建XHR，还未发送

1 ---------- opened 已经执行open这个操作

2 ---------- headers_received 已经发送AJAX请求（AJAX任务开始），响应头信息已经被客户端接收（响应头中包含了：服务器的时间，返回的HTTP状态码...）

3...]]></description><category></category></item><item><title><![CDATA[JS面向对象]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/101318881</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/101318881</guid><author>samfung09</author><pubDate>Tue, 24 Sep 2019 23:08:06 +0800</pubDate><description><![CDATA[封装

工厂模式创建对象


function createPerson(name, age){
    let obj = {};
    obj.name = name;
    obj.age = age;
    obj.sayHi= function(){
        console.log('My name is '+ name +'!');
    }
    return ob...]]></description><category></category></item><item><title><![CDATA[JS数组扁平化]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/100998807</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/100998807</guid><author>samfung09</author><pubDate>Wed, 18 Sep 2019 23:27:21 +0800</pubDate><description><![CDATA[本来是不想写的，想了一下还是写下来吧。

数组扁平化意思就是将多维数组变成1维数组，在JS中要实现数组扁平化方法有很多种，下面随便列举几种。话不多说，往下看代码。



方法1、最基础的for循环 + 递归


var arr = [1,2,[3,4,5,[6,7,[8,9]]],10,[11,12]];
function arrFlat(arr){
  var temp = [];
  for...]]></description><category></category></item><item><title><![CDATA[JS正则]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/100834351</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/100834351</guid><author>samfung09</author><pubDate>Sat, 14 Sep 2019 20:39:13 +0800</pubDate><description><![CDATA[创建方式

创建方式有两种


//字面量方式，两个斜杠包起来一些正则元字符
let reg = /\d+/g;
//构造函数方式，注意斜杠转义
let reg = new RegExp("\\d+", "g");

两种创建方式的区别

1、构造函数方式要特别注意反斜杠转义，因为在字符串中 \ 本来就特殊，比如你想输出"\"


let str1 = '\'    //会报错
let str2 ...]]></description><category></category></item><item><title><![CDATA[HTML解析之DOMContentLoaded和onload]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/100753488</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/100753488</guid><author>samfung09</author><pubDate>Thu, 12 Sep 2019 00:01:45 +0800</pubDate><description><![CDATA[说在前面

在很久很久以前，我在封装自己的JQuery库时就使用过DOMContentLoaded，觉得这个知识点看看别的文章就行了，不过现在我想把它记下来。



JS代码与body标签的位置关系

一个HTML初学时会遇到的问题，一个html页面中js代码应该放到哪里？


&lt;!--如果script标签在body前面--&gt;
&lt;head&gt;
    ...
    &lt...]]></description><category></category></item><item><title><![CDATA[用webpack4搭一个vue项目]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/86694444</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/86694444</guid><author>samfung09</author><pubDate>Tue, 29 Jan 2019 20:50:57 +0800</pubDate><description><![CDATA[平时一般都用vue-cli，今天自己来手动搭一个vue项目，当然基本项目结构还是参考vue-cli的。

 

引入vue包错误

在js文件中直接 import Vue from 'vue' 导入vue之后使用可能会报一下错误


webpack You are using the runtime-only build of Vue where the template compiler is ...]]></description><category></category></item><item><title><![CDATA[jwt原理及简单实现]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/86533421</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/86533421</guid><author>samfung09</author><pubDate>Sat, 19 Jan 2019 22:25:54 +0800</pubDate><description><![CDATA[cookies、session和jwt的一些优缺点

先来说说cookies和session实际应用中的一些不足

【缺点】cookies的安全性不好，攻击者可以通过获取本地cookies进行欺骗或者利用cookies进行CSRF攻击。
	【缺点】使用cookies时，在多个域名下，会存在跨域问题。
	【缺点】session在一定的时间里，需要存放在服务端，因此当拥有大量用户时，也会大幅度降低服务...]]></description><category></category></item><item><title><![CDATA[canvas]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/86083318</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/86083318</guid><author>samfung09</author><pubDate>Tue, 08 Jan 2019 23:28:55 +0800</pubDate><description><![CDATA[我发现看自己的博客比查文档还快，所以就在这里写一下 canvas 基础的API。以及我自己封装的画笔，github地址

基础API

画线


var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
ctx.moveTo(20, 20);     //画笔移动到这个坐标开始画
ctx.l...]]></description><category></category></item><item><title><![CDATA[小程序中使用阿里字体图标]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/85252548</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/85252548</guid><author>samfung09</author><pubDate>Tue, 25 Dec 2018 19:00:49 +0800</pubDate><description><![CDATA[相信有这个需求的都在其他项目中用过阿里图标，所以这里就跳过怎么去找阿里图标。

1、

找好了图标之后，直接下载到本地



 

2、

点击查看在线连接



复制代码



 

3、

将刚才下载好的字体图标项目解压，找到 iconfont.css ，打开，然后上一步复制的代码覆盖下图红线部分



 

4、

将修改后的 iconfont.css 全部内容复制到 wxss 中，然后在 ...]]></description><category></category></item><item><title><![CDATA[Vue服务端渲染之Nuxt.js上手]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/85011214</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/85011214</guid><author>samfung09</author><pubDate>Sat, 15 Dec 2018 22:53:44 +0800</pubDate><description><![CDATA[说在前头：本文主要简书Nuxt.js框架的基本使用，该框架集成度比较高，但文档比较全，主要参考官方文档。

安装

使用官方提供的脚手架。按照官方文档，使用npx命令安装。什么，你还不知到npx？


npx create-nuxt-app &amp;lt;项目名&amp;gt;

然后进行一些选择，比如选择什么服务端框架，这里我选了Koa



还会让你选择UI框架，这里我选了Element



其余的都是常...]]></description><category></category></item><item><title><![CDATA[你真的了解回流和重绘吗]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/84960388</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/84960388</guid><author>samfung09</author><pubDate>Tue, 11 Dec 2018 22:44:41 +0800</pubDate><description><![CDATA[转自掘金文章

浏览器的渲染过程

本文先从浏览器的渲染过程来从头到尾的讲解一下回流重绘，如果大家想直接看如何减少回流和重绘，可以跳到后面。（这个渲染过程来自MDN）



从上面这个图上，我们可以看到，浏览器渲染过程如下：

解析HTML，生成DOM树，解析CSS，生成CSSOM树
	将DOM树和CSSOM树结合，生成渲染树(Render Tree)
	Layout(回流):根据生成的渲染树，进...]]></description><category></category></item><item><title><![CDATA[Node.js调用ip接口获取地理信息]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/84308441</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/84308441</guid><author>samfung09</author><pubDate>Tue, 20 Nov 2018 20:00:44 +0800</pubDate><description><![CDATA[最近项目中需要获取访问ip的地理信息。

在网上找了一下，找到了一个阿里云的接口，免费的，登录阿里云购买就行了。

购买之后，在阿里云控制台里就可以看到该项服务的AppKey、AppCode等信息



回到购买页面，看看api使用方法，果然不出所料没有Node.js版本。



没关系，可以点击调试去看看，其实就是用Node发起一个get请求而已，只需配置一下请求头，就像写爬虫一样。

下面看代...]]></description><category></category></item><item><title><![CDATA[分享几个平时可能会在后端用到的工具函数]]></title><link>https://blog.youkuaiyun.com/samfung09/article/details/84257457</link><guid>https://blog.youkuaiyun.com/samfung09/article/details/84257457</guid><author>samfung09</author><pubDate>Mon, 19 Nov 2018 18:04:59 +0800</pubDate><description><![CDATA[生成uuid


const uuid = require('uuid');

/**
 * @method 返回一个唯一符号
 */
exports.uuid = function(){
    //v1是基于时间戳生成uuid，v4是随机生成uuid
    return uuid.v4().replace(/\-/g, '');
}

 

md5加盐加密


const crypto = ...]]></description><category></category></item></channel></rss>