- 博客(25)
- 收藏
- 关注
RSS订阅原创 vue中Computed和Watch的区别
当调用watcher.depend()方法时，会将读取计算属性的那个watcher添加到计算属性的watcher实例的依赖列表中，当计算属性中用到的数据发生变化时，计算属性的watcher实例就会执行watcher.update()方法，在update方法中会判断当前的watcher是不是计算属性的watcher，如果是则调用getAndInvoke去对比计算属性的返回值是否发生了变化，如果真的发生变化，则执行回调，通知那些读取计算属性的watcher重新执行渲染逻辑。下面我们就来看一下该函数的具体逻辑。
2022-09-12 22:09:16
313
1
原创 javascript执行上下文
执行上下文可以说是js代码执行的一个环境，存放了代码执行所需的变量，变量查找的作用域链规则以及this指向等。同时，它也是js很底层的东西，很多的问题如变量提升、作用域链和闭包等都可以在执行上下文中找到答案，所以这也是我们学习执行上下文的原因因为执行上下文是在编译阶段创建的，所以接下来先看一下js代码的执行过程吧。...
2022-08-10 21:06:19
3313
1
原创 vue源码之虚拟dom与diff算法
* 虚拟dom就是用js对象来描述一个dom节点* vue是数据驱动视图的，数据发生变化视图就要随之更新，在更新视图的操作中难免要操作dom，而操作真是dom又是非常耗费性能的，因为浏览器把dom设计的非常复杂* 所以我们要尽量少的操作dom，不要盲目的去更新视图，而是通过对比数据变化前后的状态，计算出视图中那些地方需要更新，只更新需要更新的地方* 通过js模拟一个dom节点，称为虚拟dom节点·，当数据发生变化时，对比变化前后的虚拟dom节点，通过diff算法计算出需要更新的地方，然后再去更新视图.
2022-07-29 21:30:58
230
原创 html，css，javascript是怎样变成页面的？
一个完整的渲染流程大致可总结为如下渲染进程将HTML内容转换为能够读懂的DOM树结构。渲染引擎将CSS样式表转化为浏览器可以理解的styleSheets，计算出DOM节点的样式。创建布局树，并计算元素的布局信息。对布局树进行分层，并生成分层树。为每个图层生成绘制列表，并将其提交到合成线程。合成线程将图层分成图块，并在光栅化线程池中将图块转换成位图。合成线程发送绘制图块命令DrawQuad给浏览器进程。浏览器进程根据DrawQuad消息生成页面，并显示到显示器上。...
2022-07-27 17:58:26
195
原创 重写宏任务与微任务！
事件循环是由一个队列组成的，异步任务的回调遵循先进先出，在 JS 引擎空闲时会一轮一轮地被取出，所以被叫做循环。根据队列中任务的不同，分为宏任务和微任务。如果js是多线程的话，对于一个dom元素，如果一个线程删除掉这个元素，另一个线程要修改这个元素，这是就会出现矛盾js是单线程的，单线程在执行程序时，所走的程序路径按照连续顺序拍下来，前面的处理好才会执行后面的代码，即自上而下执行，若js没有异步的话，当前面的代码执行需要花费很多时间而与后面的代码没有关联，后面的代码就会被堵塞，影响用户体验执行时间不准确：主
2022-07-10 02:53:31
147
原创 写给小白的手写promise源码
promise是解决异步编程的一种方案，可以解决回调地狱等问题，promise是有状态的，根据promise的状态采用不同的处理结果，promise在如今的前端领域应用是否广泛，所以作为前端学习者，一定要掌握promise及其内部原理，同时·，这也是面试的高频考点.........
2022-07-04 02:40:23
156
原创 leetcode122. 买卖股票的最佳时机||
给你一个整数数组 prices ，其中 prices[i] 表示某支股票第 i 天的价格。在每一天，你可以决定是否购买和/或出售股票。你在任何时候 最多 只能持有 一股 股票。你也可以先购买，然后在 同一天 出售。返回 你能获得的 最大 利润 。题解动态规划对于每一天来说，有两种状态，持有股票和不持有股票，对于动态规划来说，我们要能够找到与上一个状态的关系，也就是找出状态方程，所以我们定义一个二维数组dp显然，我们要求的是最后一天不持有股票所获得的最大利润，那怎么推出动态方程呢？对于前一天，也有这两
2022-06-29 16:26:15
62
原创 leetcode15. 三数之和
给你一个包含 n 个整数的数组 nums，判断 nums 中是否存在三个元素 a，b，c ，使得 a + b + c = 0 ？请你找出所有和为 0 且不重复的三元组。注意：答案中不可以包含重复的三元组。示例 1：题解能用哈希表吗？两数之和出于之前两数之和，就会往哈希表方面想，两数之和是判断数组中是否有两个数之和等于target，则可以利用哈希表，遍历一次数组，对于每个nums[i]，判断哈希表中有没有target-nums[i]，有的话就找到答案了，没有的话就将nums[i]设置为哈希值，这样依次迭
2022-06-25 23:25:04
66
原创 this指向问题全面解析
1.1 为什么要用this1.2 误解1.2.1 指向自身function foo(num) { console.log( "foo: " + num ); // 记录 foo 被调用的次数 this.count++; } foo.count = 0; var i; for (i=0; i<10; i++) { if (i > 5) { foo( i ); } } // foo: 6 // foo: 7 // foo: 8 // foo: 9 //
2022-02-17 23:13:37
310
原创 javascript作用域
第一章 作用域是什么作用域简单来讲就是一套规则，用来规定存储变量，并且如何方便地找到这些变量1.1 编译原理传统语言的编译过程在传统语言的流程中，程序中的一段源代码在执行之前会经历三个步骤，统称为“编译”分词/词法分析**这个过程会将有字符组成的字符串（一段源代码就是字符串）分解成有意义的代码块，这些代码块就叫作词法单元。**例如，考虑程序 var a = 2;。这段程序通常会被分解成为下面这些词法单元：var、a、=、2 、;。空格是否会被当作词法单元，取决于空格在这门语言中是否具有
2022-02-11 16:23:50
357
原创 js执行机制（event loop）
js引擎的执行机制前提通过该笔记，在有异步代码同时出现时能够判断出js的执行顺序js是单线程语言js的Event loop是js的执行机制js单线程的原因如果js是多线程的话，对于一个dom元素，如果一个线程删除掉这个元素，另一个线程要修改这个元素，这是就会出现矛盾js需要异步的原因js是单线程的，单线程在执行程序时，所走的程序路径按照连续顺序拍下来，前面的处理好才会执行后面的代码，即自上而下执行，若js没有异步的话，当前面的代码执行需要花费很多时间而与后面的代码没有关联，后
2021-10-02 23:45:03
291
1
原创 浅谈javascript面向对象理解
1.面向对象与面向编程的比较1.1 面向对象（oop）面向对象是把事物分解称为一个个对象，然后由对象之间分工与合作，是以对象功能划分问题，而不是步骤特征： 封装性、继承性、多态性优点： 优点：易维护、易复用、易扩展，由于面向对象有封装、继承、多态性的特性，可以设计出低耦合的系统，使系统 更加灵活、更加易于维护缺点： 性能比面向过程低...
2021-06-18 01:07:50
1598
原创 CSS3新特性之2D转换
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
2021-04-02 23:53:30
72
原创 C语言函数声明与定义
函数声明被调用函数定义出现在主调函数的后面，则需要声明，否则编译器会报错。声明位置如果在函数外，则任何函数都能调用，如果只声明在main函数中，就只有main函数能调用。函数声明时参数可以只写变量类型。函数定义函数的定义包括：函数类型、函数名、函数体函数类型即函数最终返回的变量的类型，如果return语句中变量类型与定义时的函数类型不一样，则会改变变量的类型，与函数类型保持一致。...
2021-03-10 22:06:23
657
原创 javascript学习笔记01（创建对象）
在javascript中，对象是一组无序的相关属性和方法的集合，所有的事物都是对象，如字符串、数值、数组、函数等。创建对象的三种方式1、利用字面量创建对象代码展示：// 创建对象var obj = { unname: '张三', age: 18, sex: '男', sayHi: function() { console.log('hi~'); }}// 调用对象console.log(obj.unname);console.log(bbj['age']);obj.sayHi
2021-03-05 00:00:54
141
原创 大一寒假学习笔记07（css3的新特性）
新增的Css3特性有兼容性问题，ie9才支持css3新增选择器1、属性选择器属性选择器可以根据元素特定属性来选择元素，这样就可以不用借助于类或者id选择器。注：类选择器、属性选择器、伪类选择器，权重都为102、结构伪类选择器结构伪类选择器主要根据文档结构 来选择元素，常用于根据父级选择器里面的子元素nth-child（n）选择某个父元素的一个或多个特定的子元素（1）n可以是数字，关键字和公式；（2）n如果是数字，就是选择第n个子元素，里面数字从1开始；（3）n可以是关键字： even
2021-02-22 21:14:39
107
原创 大一寒假学习笔记05（css高级技巧）
精灵图为了有效地减少服务器接收和发送请求的次数，提高页面的加载速度，出现了css精灵技术（也称 css sprites、css雪碧）核心原理：将网页中的一些小背景图像整合到一张大图中，这样服务器只需要一次请求就可以了精灵图的使用：1、移动背景图片位置，此时可以使用background-position，第一个值为x值，第二个值为y值;2、移动的距离就是这个目标图片的x和y坐标。注意网页中的坐标有所不同；3、因为一般情况下都是往上往左移动，所以数值是负值（x轴往右边走是正值，往左边走是负值，Y
2021-02-22 17:53:05
124
原创 大一寒假学习笔记06（html5的新特性）
html5的新增特性主要是针对以前的不足，增加了一些新的标签、新的表单和新的表单属性。但有兼容性的问题，基本上ie9+以上版本的浏览器才支持。html5新增的语义化标签 ：头部标签 ：导航标签 ：内容标签 ：定义文档某个区域 ：侧边栏标签 ：尾部标签注： 1、这种语义化标签主要针对搜索引擎的；2、在页面中可以使用多次；3、在IE9中，需要把这些元素转换为块级元素；4、移动端更喜欢使用这些标签。## HTML5新增的多媒体标签**1、音频： **...
2021-02-20 21:44:03
123
原创 大一寒假学习笔记04（css元素的显示和隐藏）
元素的显示与隐藏本质：让一个元素在页面中隐藏或显示出来；有3种隐藏方式：1、display显示隐藏display属性用于设置一个元素应如何显示display: none;隐藏现象；display: block; 除了转换为块级元素之外，同时还有显示元素的意思；display隐藏元素后，不再占有原来的位置，应用极其广泛，搭配js可以做很多网页特效2、visibility 可见性visibility 属性用于指定一个元素应可见还是隐藏visibility: visible; 元素可视；vi
2021-02-16 21:09:50
114
原创 大一寒假学习笔记02
**css学习笔记**切图的方法：1、右击图层、转换为png,图层合并时，使用快捷键shift+alt可点击要合并的图层，选择菜单栏上的图层，再选择合并图层等；2、选择左侧的菜单栏中的裁剪工具，长按选择切片工具，框出图层后，点击文件、导出、导出为web…、存储等；3、使用cutterman 插件，需要自行下载，使用时在窗口找到扩展功能就能找到。学成在线首页案例练习遇到的问题：1、写标签a后会使盒子下滑，如图：...
2021-02-14 00:17:33
183
2
原创 大一寒假学习笔记01
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录前言一、pandas是什么？二、使用步骤1.引入库2.读入数据总结学习内容：学习时间：学习产出：前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。提示：以下是本篇文章正文内容，下面案例可供参考一、pandas是什么？示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。
2021-02-09 22:15:27
125
原创 大一上学期C语言学生奖学金管理系统
大一上学期C语言课程设计总结：程序中还存在很多的bug，也有很多功能没完善，但这是人生中第一个课设，故发表出来纪念一下。#include <stdio.h>#include <stdlib.h>#include <string.h>#define LEN sizeof(struct student) struct student{ char num[15]; char name[10]; int clas; int Math;
2021-02-04 22:01:07
1493
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人