<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[Kane_qqq的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/Kane_qqq</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; Kane_qqq]]></copyright><item><title><![CDATA[实现vue-router]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/125126643</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/125126643</guid><author>Kane_qqq</author><pubDate>Sat, 04 Jun 2022 22:30:34 +0800</pubDate><description><![CDATA[实现vue-router]]></description><category></category></item><item><title><![CDATA[移动端适配方案2]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/125029735</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/125029735</guid><author>Kane_qqq</author><pubDate>Sun, 29 May 2022 12:57:22 +0800</pubDate><description><![CDATA[html{
    font-size:10px
}

iphone6  375px屏宽

js动态设置fontsize
var html = document.documentElement
var rootSize = html.clientWidth / 375 * 10
html.style.fontSize = rootSize + "px"


]]></description><category></category></item><item><title><![CDATA[vue发布订阅模式,发布订阅模型，手写一个发布订阅者模型,vue响应式基本流程 ,简单手写vue的响应式原理]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124903544</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124903544</guid><author>Kane_qqq</author><pubDate>Sat, 21 May 2022 21:19:16 +0800</pubDate><description><![CDATA[1.什么是发布订阅模式 (又叫做观察者模式)

他定义了对象间的一种一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于他的对象都将得到通知。

JS天生对发布订阅模式就有支持


// JS天生对发布订阅模式就有支持
// 例子：
// document.addEventListener("click",()=&gt;{
//     console.log("document click")
// })

2.发布订阅模型

a.发布者会给订阅者提供一个方法以便于订阅某些事件发生时要做的事情

b.]]></description><category></category></item><item><title><![CDATA[vue不使用脚手架，基础写法。]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124777892</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124777892</guid><author>Kane_qqq</author><pubDate>Sun, 15 May 2022 05:37:03 +0800</pubDate><description><![CDATA[说起来也搞笑，一直都是用脚手架，实际有个h5老项目，不用脚手架，一下子写不来了，所以记录下。


&lt;body&gt;
    &lt;div id="app"&gt;
        内容
    &lt;/div&gt;
&lt;/body&gt;
&lt;script src="../../resources/lib/vue.min.js"&gt;&lt;/script&gt; //引入vue文件
&lt;script&gt;
    var vm= new Vue({
        el:"#]]></description><category></category></item><item><title><![CDATA[项目配置接口函数以及使用]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124777880</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124777880</guid><author>Kane_qqq</author><pubDate>Sun, 15 May 2022 05:14:36 +0800</pubDate><description><![CDATA[1.创建axios示例，新建一个js文件。


import axios from 'axios'
const service = axios.create({
    baseURL:"/",
    timeout:100000,
    headers:{
        "content-type":"application/json"
    }
})
//请求拦截器
service.interceptors.request.use(
    config=&gt;{
        if(con]]></description><category></category></item><item><title><![CDATA[配置proxy跨域]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124777879</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124777879</guid><author>Kane_qqq</author><pubDate>Sun, 15 May 2022 05:09:27 +0800</pubDate><description><![CDATA[module.exports={
    runtimeCompiler:true,
    publicPath:"/", //基本路径
    devServer:{
        host:"localhost",
        port:8080,
        open:true,
        https:false,
        //设置开发接口代理
        proxy:{
            "/api":{
                target:"http.]]></description><category></category></item><item><title><![CDATA[bind、call、apply的区别]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124583799</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124583799</guid><author>Kane_qqq</author><pubDate>Sun, 15 May 2022 05:07:51 +0800</pubDate><description><![CDATA[bind、call、apply的区别与实现原理_Chengbo_X的博客-优快云博客_apply bind call区别1、简单说一下bind、call、apply的区别三者都是用于改变函数体内this的指向，但是bind与apply和call的最大的区别是：bind不会立即调用，而是返回一个新函数，称为绑定函数，其内的this指向为创建它时传入bind的第一个参数，而传入bind的第二个及以后的参数作为原函数的参数来调用原函数。var obj = {};function test() { cons...]]></description><category></category></item><item><title><![CDATA[mustache模版引擎 -- 底层tokens思想]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124703509</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124703509</guid><author>Kane_qqq</author><pubDate>Wed, 11 May 2022 09:52:39 +0800</pubDate><description><![CDATA[//mustache模版引擎 -- 底层tokens思想
        //思路：模版字符串 编译成 tokens 结合 data 解析成DOM字符串
        tokens是一个JS的嵌套数组，说白了，就是模版字符串的JS表示
        它是“抽象语法数”、“虚拟节点”等等的开山鼻祖
        模版字符串：&lt;h1&gt;我买了一个{{thing}},好{{mood}}啊&lt;/h1&gt;
        tokens: [
            ["tex...]]></description><category></category></item><item><title><![CDATA[mustache模版引擎 -- 正则表达式思路]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124703473</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124703473</guid><author>Kane_qqq</author><pubDate>Wed, 11 May 2022 09:51:08 +0800</pubDate><description><![CDATA[//mustache模版引擎 -- 正则表达式思路
//最简单的模版引擎的实现机理，利用的是正则表达式中的replace()方法。
//replace()的第二个参数可以是一个函数，这个函数提供捕获的东西的参数，就是第二个形参
//结合data对象，即可进行智能的替换
//但当HTML页面结构情况复杂时，正则表达式的思路肯定就不行了。
        var templateStr = "&lt;h1&gt;我买了一个{{thing}},好{{mood}}&lt;/h1&gt;"
        var .]]></description><category></category></item><item><title><![CDATA[模板引擎]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124661864</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124661864</guid><author>Kane_qqq</author><pubDate>Mon, 09 May 2022 11:03:20 +0800</pubDate><description><![CDATA[&lt;body&gt;
    &lt;div&gt;
        &lt;ul id="list"&gt;
            &lt;li&gt;
                &lt;div class="hd"&gt;小明的基本信息&lt;/div&gt;
                &lt;div&gt;
                    &lt;p&gt;姓名：小明&lt;/p&gt;
                    &lt;p&gt;年龄：12&lt;/p&gt.]]></description><category></category></item><item><title><![CDATA[vue绑定原理]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124589846</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124589846</guid><author>Kane_qqq</author><pubDate>Thu, 05 May 2022 15:27:54 +0800</pubDate><description><![CDATA[vue.js是采用数据劫持结合发布者-订阅者模式的方式，通过object.defineProperty() (生成Observer)来劫持各个属性的setter(界面改变触发),getter(data中改变触发)，在数据变动时发布消息给订阅者(watcher)，触发相应的监听回调。



入口函数，传过来一些数据，我们通过object.defineProperty()劫持并监听所有属性，一旦数据发生变化，通知订阅器，找到对应的订阅者，然后更新视图。

Dep订阅器的作用：1.通知订阅者更新视图...]]></description><category></category></item><item><title><![CDATA[关于promise面试题]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124583514</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124583514</guid><author>Kane_qqq</author><pubDate>Thu, 05 May 2022 10:26:14 +0800</pubDate><description><![CDATA[1. promise的几个API

promise.resolve(1)

promise.reject(1)

promise.all([promise1,promise2,promise3])

promise.race([promise1,promise2,promise3])

2. promise的三个状态
pending，表示进行中

fulfilled也是resolved，表示成功

rejected，表示失败

3.promise的状态变化
只能从pending-&gt;resolved或者]]></description><category></category></item><item><title><![CDATA[斐波那契数列 js实现]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124583308</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124583308</guid><author>Kane_qqq</author><pubDate>Thu, 05 May 2022 10:14:25 +0800</pubDate><description><![CDATA[1.递归


function fb1(n){
    if(n &lt;= 2){
        return 1;    
    }else{
        return fb1(n-1) + fb1(n-2);
    }
}
 

2.迭代


function fb3(n){
    var res1 = 1;
    var res2 = 1;
    var sum = res2;
    for(var i = 2;i &lt; n;i ++){
        sum = res1 ]]></description><category></category></item><item><title><![CDATA[Session、Cookie、Token总结]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124583238</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124583238</guid><author>Kane_qqq</author><pubDate>Thu, 05 May 2022 10:11:10 +0800</pubDate><description><![CDATA[1. 引入：

HTTP是无状态协议，无法记得上一次连接的信息，比如记不得用户是否已经登陆等信息。

而Session、Cookie、Token便是对HTTP无状态的一种补充；

2.Cookie:

Cookie是浏览器对于一些信息的键值对形式保存，当浏览器关闭，Cookie也就删除了;

3. Session:

Session是服务器中保存的对象（Tomcat保存在ConcurrentHashMap&lt;Session&gt;中），生成之后在返回Http response时，会发送sesionId给]]></description><category></category></item><item><title><![CDATA[关于http的面试题]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124583038</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124583038</guid><author>Kane_qqq</author><pubDate>Thu, 05 May 2022 10:05:13 +0800</pubDate><description><![CDATA[1.Http协议实现的原理机制

(1).整个流程步骤:





(2)域名解析过程:





(3).三次握手过程

(4).发起Http请求

(5).响应Http请求并得到HTML代码

(6).浏览器解析HTML代码

(7).浏览器对页面进行渲染呈现给用户



2.get与post请求的区别?

区别一:get重点在从服务器上获取资源,post重点在想服务器发送数据;

区别二:get传输数据是通过URL请求,以filed(字段)=value的形式,置于URL后,并用"?"连接,多个请求数据]]></description><category></category></item><item><title><![CDATA[node.js express框架 后端搭建]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124582698</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124582698</guid><author>Kane_qqq</author><pubDate>Thu, 05 May 2022 09:49:35 +0800</pubDate><description><![CDATA[App.js


var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');
var homeRouter = require('./routes/home');
// 引入购物车模块
var shopping]]></description><category></category></item><item><title><![CDATA[Vue2中无法检测到数组变动的原因及解决]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124513243</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124513243</guid><author>Kane_qqq</author><pubDate>Sat, 30 Apr 2022 15:10:38 +0800</pubDate><description><![CDATA[官方文档中对于这点简要的概括为“由于JavaScript的限制”无法实现，而Object.defineProperty是实现检测数据改变的方案，那这个限制是指Object.defineProperty吗？

其实原因并不是因为Object.defineProperty()存在漏洞，而是出于性能问题的考虑。 Object.defineProperty 在数组中的表现和在对象中的表现是一致的，数组的索引就可以看做是对象中的 key 。

通过索引访问或设置对应元素的值时，可以触发 getter 和 setter]]></description><category></category></item><item><title><![CDATA[游览器渲染原理]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124482144</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124482144</guid><author>Kane_qqq</author><pubDate>Thu, 28 Apr 2022 19:51:25 +0800</pubDate><description><![CDATA[1.游览器在接收到服务器返回的html页面之后

  2.游览器开始构建DOM树，遇到CSS样式会构建CSS规则树

  3.遇到js会通过DOM API和CSS DOM API 来操作DOM数和CSS规则树

  4.解析完成后，游览器引擎会通过DOM数和CSS规则树来构造渲染树

  5.渲染树构建完成之后，进行布局处理，换一种说法就是确定每个节点在屏幕上的确切得显示位置

  6.最后开始绘制，遍历渲染树，并用UI后端层，绘制出每一个UI节点
...]]></description><category></category></item><item><title><![CDATA[vue 绑定原理]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124481943</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124481943</guid><author>Kane_qqq</author><pubDate>Thu, 28 Apr 2022 19:42:33 +0800</pubDate><description><![CDATA[1.vue会遍历此data中对象所有得属性

2.并使用Object.defineProperty把这些属性全部转为getter/setter

3.而每个组件实例都有watcher对象

4.它会在组件渲染的过程中把属性记录为依赖

5.之后当依赖项的setter被调用时，会通知watcher重新计算，从而致使它关联的组件得以更新
...]]></description><category></category></item><item><title><![CDATA[this指向]]></title><link>https://blog.youkuaiyun.com/Kane_qqq/article/details/124481760</link><guid>https://blog.youkuaiyun.com/Kane_qqq/article/details/124481760</guid><author>Kane_qqq</author><pubDate>Thu, 28 Apr 2022 19:32:26 +0800</pubDate><description><![CDATA[this 4种绑定规则

1.默认绑定

函数内默认this指向window

function girl(){

  console.log(this)

}

girl();  //window

2.隐式绑定

var girl={

  name="小红";

  height:160,

  weight:180,

  detail:function(){

    console.log("姓名"+this.name)

    console.log("...]]></description><category></category></item></channel></rss>