<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[Lin__hr的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/Lin__hr</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; Lin__hr]]></copyright><item><title><![CDATA[vue中Computed和Watch的区别]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/126823726</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/126823726</guid><author>Lin__hr</author><pubDate>Mon, 12 Sep 2022 22:09:16 +0800</pubDate><description><![CDATA[当调用watcher.depend()方法时，会将读取计算属性的那个watcher添加到计算属性的watcher实例的依赖列表中，当计算属性中用到的数据发生变化时，计算属性的watcher实例就会执行watcher.update()方法，在update方法中会判断当前的watcher是不是计算属性的watcher，如果是则调用getAndInvoke去对比计算属性的返回值是否发生了变化，如果真的发生变化，则执行回调，通知那些读取计算属性的watcher重新执行渲染逻辑。下面我们就来看一下该函数的具体逻辑。]]></description><category></category></item><item><title><![CDATA[javascript执行上下文]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/126274460</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/126274460</guid><author>Lin__hr</author><pubDate>Wed, 10 Aug 2022 21:06:19 +0800</pubDate><description><![CDATA[执行上下文可以说是js代码执行的一个环境，存放了代码执行所需的变量，变量查找的作用域链规则以及this指向等。同时，它也是js很底层的东西，很多的问题如变量提升、作用域链和闭包等都可以在执行上下文中找到答案，所以这也是我们学习执行上下文的原因因为执行上下文是在编译阶段创建的，所以接下来先看一下js代码的执行过程吧。...]]></description><category></category></item><item><title><![CDATA[vue源码之虚拟dom与diff算法]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/126044407</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/126044407</guid><author>Lin__hr</author><pubDate>Fri, 29 Jul 2022 21:30:58 +0800</pubDate><description><![CDATA[* 虚拟dom就是用js对象来描述一个dom节点
* vue是数据驱动视图的，数据发生变化视图就要随之更新，在更新视图的操作中难免要操作dom，而操作真是dom又是非常耗费性能的，因为浏览器把dom设计的非常复杂
* 所以我们要尽量少的操作dom，不要盲目的去更新视图，而是通过对比数据变化前后的状态，计算出视图中那些地方需要更新，只更新需要更新的地方
* 通过js模拟一个dom节点，称为虚拟dom节点·，当数据发生变化时，对比变化前后的虚拟dom节点，通过diff算法计算出需要更新的地方，然后再去更新视图.]]></description><category></category></item><item><title><![CDATA[html，css，javascript是怎样变成页面的？]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/126001118</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/126001118</guid><author>Lin__hr</author><pubDate>Wed, 27 Jul 2022 17:58:26 +0800</pubDate><description><![CDATA[一个完整的渲染流程大致可总结为如下渲染进程将HTML内容转换为能够读懂的DOM树结构。渲染引擎将CSS样式表转化为浏览器可以理解的styleSheets，计算出DOM节点的样式。创建布局树，并计算元素的布局信息。对布局树进行分层，并生成分层树。为每个图层生成绘制列表，并将其提交到合成线程。合成线程将图层分成图块，并在光栅化线程池中将图块转换成位图。合成线程发送绘制图块命令DrawQuad给浏览器进程。浏览器进程根据DrawQuad消息生成页面，并显示到显示器上。...]]></description><category></category></item><item><title><![CDATA[重写宏任务与微任务！]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/125701536</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/125701536</guid><author>Lin__hr</author><pubDate>Sun, 10 Jul 2022 02:53:31 +0800</pubDate><description><![CDATA[事件循环是由一个队列组成的，异步任务的回调遵循先进先出，在 JS 引擎空闲时会一轮一轮地被取出，所以被叫做循环。根据队列中任务的不同，分为宏任务和微任务。如果js是多线程的话，对于一个dom元素，如果一个线程删除掉这个元素，另一个线程要修改这个元素，这是就会出现矛盾js是单线程的，单线程在执行程序时，所走的程序路径按照连续顺序拍下来，前面的处理好才会执行后面的代码，即自上而下执行，若js没有异步的话，当前面的代码执行需要花费很多时间而与后面的代码没有关联，后面的代码就会被堵塞，影响用户体验执行时间不准确：主]]></description><category></category></item><item><title><![CDATA[写给小白的手写promise源码]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/125508463</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/125508463</guid><author>Lin__hr</author><pubDate>Mon, 04 Jul 2022 02:40:23 +0800</pubDate><description><![CDATA[promise是解决异步编程的一种方案，可以解决回调地狱等问题，promise是有状态的，根据promise的状态采用不同的处理结果，promise在如今的前端领域应用是否广泛，所以作为前端学习者，一定要掌握promise及其内部原理，同时·，这也是面试的高频考点.........]]></description><category></category></item><item><title><![CDATA[leetcode122. 买卖股票的最佳时机||]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/125524594</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/125524594</guid><author>Lin__hr</author><pubDate>Wed, 29 Jun 2022 16:26:15 +0800</pubDate><description><![CDATA[给你一个整数数组 prices ，其中 prices[i] 表示某支股票第 i 天的价格。在每一天，你可以决定是否购买和/或出售股票。你在任何时候 最多 只能持有 一股 股票。你也可以先购买，然后在 同一天 出售。返回 你能获得的 最大 利润 。

题解
动态规划
对于每一天来说，有两种状态，持有股票和不持有股票，对于动态规划来说，我们要能够找到与上一个状态的关系，也就是找出状态方程，所以我们定义一个二维数组dp显然，我们要求的是最后一天不持有股票所获得的最大利润，那怎么推出动态方程呢？对于前一天，也有这两]]></description><category></category></item><item><title><![CDATA[leetcode15. 三数之和]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/125465401</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/125465401</guid><author>Lin__hr</author><pubDate>Sat, 25 Jun 2022 23:25:04 +0800</pubDate><description><![CDATA[给你一个包含 n 个整数的数组 nums，判断 nums 中是否存在三个元素 a，b，c ，使得 a + b + c = 0 ？请你找出所有和为 0 且不重复的三元组。注意：答案中不可以包含重复的三元组。示例 1：
题解
能用哈希表吗？
两数之和出于之前两数之和，就会往哈希表方面想，两数之和是判断数组中是否有两个数之和等于target，则可以利用哈希表，遍历一次数组，对于每个nums[i]，判断哈希表中有没有target-nums[i]，有的话就找到答案了，没有的话就将nums[i]设置为哈希值，这样依次迭]]></description><category></category></item><item><title><![CDATA[vue源码之数据侦测]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/123782940</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/123782940</guid><author>Lin__hr</author><pubDate>Tue, 29 Mar 2022 20:39:32 +0800</pubDate><description><![CDATA[学习vue2和vue3源码之数据侦测

]]></description><category></category></item><item><title><![CDATA[this指向问题全面解析]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/122993864</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/122993864</guid><author>Lin__hr</author><pubDate>Thu, 17 Feb 2022 23:13:37 +0800</pubDate><description><![CDATA[1.1 为什么要用this
1.2 误解
1.2.1 指向自身
function foo(num) { 
 console.log( "foo: " + num ); 
 // 记录 foo 被调用的次数
 this.count++; 
} 
foo.count = 0; 
var i; 
for (i=0; i&lt;10; i++) { 
 if (i &gt; 5) { 
 foo( i ); 
 } 
} 
// foo: 6 
// foo: 7 
// foo: 8 
// foo: 9 
//]]></description><category></category></item><item><title><![CDATA[javascript作用域]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/122883327</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/122883327</guid><author>Lin__hr</author><pubDate>Fri, 11 Feb 2022 16:23:50 +0800</pubDate><description><![CDATA[第一章 作用域是什么
作用域简单来讲就是一套规则，用来规定存储变量，并且如何方便地找到这些变量
1.1 编译原理
传统语言的编译过程
在传统语言的流程中，程序中的一段源代码在执行之前会经历三个步骤，统称为“编译”


分词/词法分析


**这个过程会将有字符组成的字符串（一段源代码就是字符串）分解成有意义的代码块，这些代码块就叫作词法单元。**例如，考虑程序 var a = 2;。这段程序通常会被分解成为下面这些词法单元：var、a、=、2 、;。空格是否会被当作词法单元，取决于空格在
这门语言中是否具有]]></description><category></category></item><item><title><![CDATA[js执行机制（event loop）]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/120590586</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/120590586</guid><author>Lin__hr</author><pubDate>Sat, 02 Oct 2021 23:45:03 +0800</pubDate><description><![CDATA[js引擎的执行机制
前提


通过该笔记，在有异步代码同时出现时能够判断出js的执行顺序


js是单线程语言


js的Event loop是js的执行机制


js单线程的原因
如果js是多线程的话，对于一个dom元素，如果一个线程删除掉这个元素，另一个线程要修改这个元素，这是就会出现矛盾
js需要异步的原因
js是单线程的，单线程在执行程序时，所走的程序路径按照连续顺序拍下来，前面的处理好才会执行后面的代码，即自上而下执行，若js没有异步的话，当前面的代码执行需要花费很多时间而与后面的代码没有关联，后]]></description><category></category></item><item><title><![CDATA[javascript构造函数和原型]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/118052270</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/118052270</guid><author>Lin__hr</author><pubDate>Mon, 02 Aug 2021 15:57:59 +0800</pubDate><description><![CDATA[1

]]></description><category></category></item><item><title><![CDATA[浅谈javascript面向对象理解]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/117265152</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/117265152</guid><author>Lin__hr</author><pubDate>Fri, 18 Jun 2021 01:07:50 +0800</pubDate><description><![CDATA[1.面向对象与面向编程的比较
1.1 面向对象（oop）

面向对象是把事物分解称为一个个对象，然后由对象之间分工与合作，是以对象功能划分问题，而不是步骤
特征： 封装性、继承性、多态性
优点： 优点：易维护、易复用、易扩展，由于面向对象有封装、继承、多态性的特性，可以设计出低耦合的系统，使系统 更加灵活、更加易于维护
缺点： 性能比面向过程低


...]]></description><category></category></item><item><title><![CDATA[CSS3新特性之2D转换]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/115409850</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/115409850</guid><author>Lin__hr</author><pubDate>Fri, 02 Apr 2021 23:53:30 +0800</pubDate><description><![CDATA[1.1 2D转换
1.1.1 二维坐标系
​	X轴水平向右，Y轴水平向下
1.1.2移动 translate

语法

​			transform: translate(x,y);
​			或者分开写
​			transform: translateX(n);
​			transform: translateY(n);
​			括号内可为像素单位，也可以是百分比，负号表示与正方向相反

重点
*  定义2D转换中的移动，沿着X和Y轴移动元素
* translate最大的优点： 不会影响到其他盒子
* tra]]></description><category></category></item><item><title><![CDATA[C语言函数声明与定义]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/114647956</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/114647956</guid><author>Lin__hr</author><pubDate>Wed, 10 Mar 2021 22:06:23 +0800</pubDate><description><![CDATA[函数声明
被调用函数定义出现在主调函数的后面，则需要声明，否则编译器会报错。
声明位置如果在函数外，则任何函数都能调用，如果只声明在main函数中，就只有main函数能调用。
函数声明时参数可以只写变量类型。
函数定义
函数的定义包括：函数类型、函数名、函数体
函数类型即函数最终返回的变量的类型，如果return语句中变量类型与定义时的函数类型不一样，则会改变变量的类型，与函数类型保持一致。

...]]></description><category></category></item><item><title><![CDATA[javascript学习笔记01（创建对象）]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/114297027</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/114297027</guid><author>Lin__hr</author><pubDate>Fri, 05 Mar 2021 00:00:54 +0800</pubDate><description><![CDATA[在javascript中，对象是一组无序的相关属性和方法的集合，所有的事物都是对象，如字符串、数值、数组、函数等。
创建对象的三种方式
1、利用字面量创建对象
代码展示：
// 创建对象
var obj = {
	unname: '张三',
	age: 18,
	sex: '男',
	sayHi: function() {
	console.log('hi~');
	}
}
// 调用对象
console.log(obj.unname);
console.log(bbj['age']);
obj.sayHi]]></description><category></category></item><item><title><![CDATA[大一寒假学习笔记07（css3的新特性）]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/113916042</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/113916042</guid><author>Lin__hr</author><pubDate>Mon, 22 Feb 2021 21:14:39 +0800</pubDate><description><![CDATA[新增的Css3特性有兼容性问题，ie9才支持
css3新增选择器
1、属性选择器
属性选择器可以根据元素特定属性来选择元素，这样就可以不用借助于类或者id选择器。

注：类选择器、属性选择器、伪类选择器，权重都为10
2、结构伪类选择器
结构伪类选择器主要根据文档结构 来选择元素，常用于根据父级选择器里面的子元素

nth-child（n）选择某个父元素的一个或多个特定的子元素
（1）n可以是数字，关键字和公式；
（2）n如果是数字，就是选择第n个子元素，里面数字从1开始；
（3）n可以是关键字： even]]></description><category></category></item><item><title><![CDATA[大一寒假学习笔记05（css高级技巧）]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/113828489</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/113828489</guid><author>Lin__hr</author><pubDate>Mon, 22 Feb 2021 17:53:05 +0800</pubDate><description><![CDATA[精灵图
为了有效地减少服务器接收和发送请求的次数，提高页面的加载速度，出现了css精灵技术（也称 css sprites、css雪碧）

核心原理：
将网页中的一些小背景图像整合到一张大图中，这样服务器只需要一次请求就可以了
精灵图的使用：
1、移动背景图片位置，此时可以使用background-position，第一个值为x值，第二个值为y值;
2、移动的距离就是这个目标图片的x和y坐标。注意网页中的坐标有所不同；
3、因为一般情况下都是往上往左移动，所以数值是负值（x轴往右边走是正值，往左边走是负值，Y]]></description><category></category></item><item><title><![CDATA[大一寒假学习笔记06（html5的新特性）]]></title><link>https://blog.youkuaiyun.com/Lin__hr/article/details/113859875</link><guid>https://blog.youkuaiyun.com/Lin__hr/article/details/113859875</guid><author>Lin__hr</author><pubDate>Sat, 20 Feb 2021 21:44:03 +0800</pubDate><description><![CDATA[html5的新增特性主要是针对以前的不足，增加了一些新的标签、新的表单和新的表单属性。但有兼容性的问题，基本上ie9+以上版本的浏览器才支持。
html5新增的语义化标签
 ：头部标签
  ：导航标签
  ：内容标签
  ：定义文档某个区域
  ：侧边栏标签
  ：尾部标签
注： 
1、这种语义化标签主要针对搜索引擎的；
2、在页面中可以使用多次；
3、在IE9中，需要把这些元素转换为块级元素；
4、移动端更喜欢使用这些标签。
## HTML5新增的多媒体标签
**1、音频： **

...]]></description><category></category></item></channel></rss>