- 博客(80)
- 收藏
- 关注
RSS订阅原创 一文彻底搞懂前端缓存机制
2）当强缓存没有命中的时候，浏览器一定会发送一个请求到服务器，通过服务器端依据资源的另外一些http header验证这个资源是否命中协商缓存，如果协商缓存命中，服务器会将这个请求返回，但是不会返回这个资源的数据，而是告诉客户端可以直接从缓存中加载这个资源，于是浏览器就又会从自己的缓存中去加载这个资源；当强缓存未命中时，浏览器就会发送请求到服务器，服务器会验证协商缓存是否命中，如果协商缓存命中，请求返回的http状态为304，并会显示说明Not Modified，浏览器收到该返回后，就会从缓存中加载了。
2023-03-15 12:57:20
1486
原创 拿到大厂前端offer的前端开发是怎么回答面试题的
两个块级元素的上外边距和下外边距可能会合并（折叠）为一个外边距，其大小会取其中外边距值大的那个，这种行为就是外边距折叠。需要注意的是，浮动的元素和绝对定位这种脱离文档流的元素的外边距不会折叠。重叠只会出现在垂直方向。如果两者都是正数，那么就去最大者如果是一正一负，就会正值减去负值的绝对值两个都是负值时，用0减去两个中绝对值大的那个兄弟之间重叠和父子之间重叠（1）兄弟之间重叠float底部元素的position的值为（2）父子之间重叠子元素加入浮动属性或定位。
2023-03-15 12:55:38
536
原创 前端常考面试题整理
插件系统是 Webpack 成功的一个关键性因素。在编译的整个生命周期中，Webpack 会触发许多事件钩子，Plugin 可以监听这些事件，根据需求在相应的时间点对打包内容进行定向的修改。// 注册插件时，会调用 apply 方法 // apply 方法接收 compiler 对象 // 通过 compiler 上提供的 Api，可以对事件进行监听，执行相应的操作 apply(compiler) {
2023-03-15 12:55:13
769
原创 一文读懂Js中的this指向
this关键字是一个非常重要的语法点。毫不夸张地说，不理解它的含义，大部分开发任务都无法完成。简单说，this就是属性或方法“当前”所在的对象。上面代码中，this就代表property属性当前所在的对象。下面是一个实际的例子。name : '张三' , describe : function() {return '姓名：' + this . name;} };person . describe() // "姓名：张三"上面代码中，this.name表示name属性所在的那个对象。由于。
2023-03-15 12:55:03
1520
原创 js异步编程的三种模式
javascript语言的执行环境是"单线程"(single thread)，就是指一次只能完成一件任务。如果有多个任务，就必须排队，等前面一个任务完成，再执行后面一个任务，以此类推。这种模式的好处是实现起来比较简单，执行环境相对单纯；坏处是只要有一个任务耗时很长，后面的任务都必须排队等着，会拖延整个程序的执行。
2023-03-02 08:44:41
185
原创 js对象和原型、原型链的关系
JS的原型、原型链一直是比较难理解的内容，不少初学者甚至有一定经验的老鸟都不一定能完全说清楚，更多的"很可能"是一知半解，而这部分内容又是JS的核心内容，想要技术进阶的话肯定不能对这个概念一知半解，碰到问题靠“猜”，却不理解它的规则！
2023-03-02 08:43:41
126
原创 字节前端经典面试题（附答案）
跨域问题其实就是浏览器的同源策略造成的。同源策略限制了从同一个源加载的文档或脚本如何与另一个源的资源进行交互。这是浏览器的一个用于隔离潜在恶意文件的重要的安全机制。协议端口号域名必须一致。同源策略：protocol（协议）、domain（域名）、port（端口）三者必须一致。当前域下的 js 脚本不能够访问其他域下的 cookie、localStorage 和 indexDB。当前域下的 js 脚本不能够操作访问操作其他域下的 DOM。当前域下 ajax 无法发送跨域请求。
2023-02-28 11:49:29
1209
原创 js作用域、作用域链和它的一些优化
随着JavaScript语言的发展，语言中的作用域的种类也变得丰富起来，不再局限于函数作用域作为最小变量声明范围来使用，而是可以基于更小范围的跨级作用域来管理我们的变量引用范围。变量的管理变得更加的灵活、安全。作用域链是作用域链嵌套的结构产物，所有变量标识符的解析和引用会沿着作用域链进行查找。而词法环境，是JavaScript对于作用域的内部技术实现。深入了解词法环境后，也让我们更清楚代码在解析变量标识符时的内部执行过程。也根据这个过程，我们大概总结出了两点关于作用域和变量使用的性能优化点。
2023-02-28 11:49:13
291
原创 前端二面经典面试题指南
XSS 攻击指的是跨站脚本攻击，是一种代码注入攻击。攻击者通过在网站注入恶意脚本，使之在用户的浏览器上运行，从而盗取用户的信息如 cookie 等。XSS 的本质是因为网站没有对恶意代码进行过滤，与正常的代码混合在一起了，浏览器没有办法分辨哪些脚本是可信的，从而导致了恶意代码的执行。获取页面的数据，如DOM、cookie、localStorage；DOS攻击，发送合理请求，占用服务器资源，从而使用户无法访问服务器；破坏页面结构；流量劫持（将链接指向某网站）；
2023-02-28 11:47:29
469
原创 js函数式编程讲解
是一种编程范型，它将电脑运算视为数学上的函数计算，并且避免使用程序状态以及易变对象。函数式编程更加强调程序执行的结果而非执行的过程，倡导利用若干简单的执行单元让计算结果不断渐进，逐层推导复杂的运算，而不是设计一个复杂的执行过程。函数式编程的思维过程是完全不同的，它的着眼点是函数，而不是过程，它强调的是如何通过函数的组合变换去解决问题，而不是我通过写什么样的语句去解决问题。
2023-02-28 11:47:17
277
原创 javascript 高级编程之Array 用法总结
引用类型是一种数据结构，用于将数据和功能联系起来。创建对象的方式：1.new操作符2.字面量表示法创建。
2023-02-27 14:41:02
404
原创 有哪些前端面试题是必须要掌握的
/ 处理逻辑 })回调函数有一个致命的弱点，就是容易写出回调地狱（Callback hell）。// 处理逻辑 ajax(url1 ,() => {// 处理逻辑 ajax(url2 ,() => {// 处理逻辑 }) }) })// 处理逻辑 secondAjax() }) } function secondAjax() {// 处理逻辑 }) } ajax(url ,() => {// 处理逻辑 firstAjax() })以上的代码虽然看上去利于阅读了，但是还是没有解决根本问题。
2023-02-27 14:40:51
447
原创 2023前端面试知识点总结
1）Promise基本特性1、Promise有三种状态：pending(进行中)、fulfilled(已成功)、rejected(已失败)2、Promise对象接受一个回调函数作为参数, 该回调函数接受两个参数，分别是成功时的回调resolve和失败时的回调reject；另外resolve的参数除了正常值以外， 还可能是一个Promise对象的实例；reject的参数通常是一个Error对象的实例。
2023-02-24 09:07:24
470
原创 JS词法环境和执行上下文
JavaScript是一门解释性动态语言，但同时它也是一门充满神秘感的语言。如果要成为一名优秀的JS开发者，那么对JavaScript程序的内部执行原理要有所了解。本文以最新的ECMA规范中的第八章节为基础，理清JavaScript的词法环境和执行上下文的相关内容。这是理解JavaScript其他概念（let/const暂时性死区、变量提升、闭包等）的基础。本文参考的是最新发布的第十代ECMA-262标准，即ES2019。
2023-02-24 09:06:56
280
原创 细说Js中的this
说的是执行上下文的thisbinding。this说的是当前函数的调用位置。这个是概念描述。下面通过上面的只是去分析各种情况下的thisbinding是什么东西。this 提供了一种更优雅的方式来隐式“传递”一个对象引用，因此可以将API设计得更加简洁并且易于复用。随着使用模式越来越复杂，显式传递上下文对象会让代码变得越来越混乱，使用 this 则不会这样箭头函数的this是绑定到父函数foo的，其实不是，只是沿用。因为箭头函数内部没有做任何的绑定操作。局部变量this。
2022-12-12 11:59:21
138
原创 细说js变量、作用域和垃圾回收
某个执行环境中的所有代码执行完毕后，该环境将会被销毁，保存在其中的所有变量和函数定义也随之销毁，全局执行环境直至网页或浏览器关闭时才被销毁（ 如果存在闭包，情况又有所不同，会在后面几篇提到 😅，多谢 吴hr 指正）。在函数内部，最接近的环境就是函数的局部环境，若初始化变量时没有使用 var 声明，该变量会自动被添加到全局环境。其中基本类型是按值传递，而引用类型的值是按引用访问的，所以在操作对象时，实际上是在操作对象的引用而不是实际的对象 ( ps：在为对象添加属性时，操作的是实际的对象 )。
2022-12-12 11:58:49
118
原创 JS知识点梳理之作用域、作用域链、柯里化、闭包
作用域是指 js 变量使用时所存在的一个区域，分为全局作用域（window）和局部作用域（function、setTimeout…等都会产生局部作用域）。当局部作用域变量名与全局作用域变量名重复时，局部变量会覆盖全局变量。在局部作用域使用变量时，如果在自己作用域找不到对应变量，则会往上一级作用域查找，直到全局作用域，如果全局作用域无此变量则会报 undefined。相反，全局作用域中无法使用局部作用域中的变量。上面这种一层层向外查询变量的过程叫做查询作用域链。
2022-12-12 11:57:03
111
原创 彻底搞懂JS原型与原型链
说到JavaScript的原型和原型链，相关文章已有不少，但是大都晦涩难懂。本文将换一个角度出发，先理解原型和原型链是什么，有什么作用，再去分析那些令人头疼的关系。原型和原型链都是来源于对象而服务于对象的概念，所以我们要先明确一点：JavaScript中一切引用类型都是对象，对象就是属性的集合。、、、、等都是引用类型。也就是说 数组是对象、函数是对象、正则是对象、对象还是对象。上面我们说到对象就是属性（property）的集合，有人可能要问不是还有方法吗？其实方法也是一种属性，因为它也是的表现形式，具体见下
2022-12-07 14:35:20
332
原创 细说JavaScript闭包
2.函数作用域当这个函数被执行完之后，这个局部变量也相应会被销毁。所以你会看到在getName函数外面的name是访问不到的3.块级作用域if语句及for语句后面的{…}这里面所包括的，就是块级作用域二、什么是闭包？1.闭包的基本概念闭包其实就是一个可以访问其他函数内部变量的函数。即一个定义在函数内部的函数，或者直接说闭包是个内嵌函数也可以。因为通常情况下，函数内部变量是无法在外部访问的（即全局变量和局部变量的区别），因此使用闭包的作用，就具备实现了能在外部访问某个函数内部
2022-12-07 14:33:38
250
原创 细说JavaScript闭包
2.函数作用域当这个函数被执行完之后，这个局部变量也相应会被销毁。所以你会看到在getName函数外面的name是访问不到的3.块级作用域if语句及for语句后面的{…}这里面所包括的，就是块级作用域二、什么是闭包？1.闭包的基本概念闭包其实就是一个可以访问其他函数内部变量的函数。即一个定义在函数内部的函数，或者直接说闭包是个内嵌函数也可以。因为通常情况下，函数内部变量是无法在外部访问的（即全局变量和局部变量的区别），因此使用闭包的作用，就具备实现了能在外部访问某个函数内部
2022-12-07 14:32:43
191
原创 为什么vue3要选用proxy，好处是什么？
Proxy是对象的包装器，将代理上的操作转发到对象，并可以选择捕获其中一些操作。它可以包装任何类型的对象，包括类和函数。……然后，我们应该在所有地方使用proxy而不是target。代理没有自己的属性或方法。如果提供了捕捉器（trap），它将捕获操作，否则会将其转发给target对象。我们可以捕获get，set，deleteProperty 等操作函数调用（apply捕捉器）new操作（construct 捕捉器）Reflect 旨在补充 Proxy。对于任意Proxy。
2022-11-18 13:48:34
926
原创 令人头疼的Javascript隐式&强制转换
Javascript 的隐式强制只是指 Javascript 试图将意外的值类型强制为预期的类型。因此，您可以在需要数字的地方传递一个字符串，在需要字符串的地方传递一个对象等，它会尝试将其转换为正确的类型。这是最好避免的 Javascript 功能。
2022-11-18 13:47:25
105
原创 前端懒加载和预加载
懒加载和预加载的目的都是为了提高用户的体验，二者行为是相反的，一个是延迟加载，另一个是提前加载。懒加载对缓解服务器压力有一定作用，预加载则会增长服务器前端压力缓存。懒加载：又叫延迟加载、按需加载，当我们打开一个网页，优先展示的首屏图片就先加载，而其他的图片，等到需要去展示的时候再去请求图片资源。目的：更好的加载页面的首屏内容，对于含有不少图片的比较长的网页来讲，能够加载的更快，避免了首次打开时，一次性加载过多图片资源，是对网页性能的一种优化方式。原理：浏览器解析到img标签的src有值，才会去发起请求，那么
2022-11-18 13:46:55
557
原创 一文彻底搞懂前端缓存机制
2）当强缓存没有命中的时候，浏览器一定会发送一个请求到服务器，通过服务器端依据资源的另外一些http header验证这个资源是否命中协商缓存，如果协商缓存命中，服务器会将这个请求返回，但是不会返回这个资源的数据，而是告诉客户端可以直接从缓存中加载这个资源，于是浏览器就又会从自己的缓存中去加载这个资源；当强缓存未命中时，浏览器就会发送请求到服务器，服务器会验证协商缓存是否命中，如果协商缓存命中，请求返回的http状态为304，并会显示说明Not Modified，浏览器收到该返回后，就会从缓存中加载了。
2022-11-16 19:46:43
147
原创 一文读懂Js中的this指向
this关键字是一个非常重要的语法点。毫不夸张地说，不理解它的含义，大部分开发任务都无法完成。简单说，this就是属性或方法“当前”所在的对象。上面代码中，this就代表property属性当前所在的对象。下面是一个实际的例子。name : '张三' , describe : function() {return '姓名：' + this . name;} };person . describe() // "姓名：张三"上面代码中，this.name表示name属性所在的那个对象。由于。
2022-11-16 19:46:29
217
原创 一比一手写迷你版vue，彻底搞懂vue运行机制
现在前端面试Vue中都会问到响应式原理以及如何实现的，如果你还只是简单回答通过Object.defineProperty()来劫持属性可能已经不够了。本篇文章通过学习文档及视频教程实现手写一个简易的Vue源码实现数据双向绑定，解析指令等。本篇文章主要以几种实现双向绑定的做法、实现Observer、实现Compile、实现Watcher、实现MVVM这几个模块来阐述了双向绑定的原理和实现。
2022-11-16 19:44:56
114
原创 js函数式编程讲解
是一种编程范型，它将电脑运算视为数学上的函数计算，并且避免使用程序状态以及易变对象。函数式编程更加强调程序执行的结果而非执行的过程，倡导利用若干简单的执行单元让计算结果不断渐进，逐层推导复杂的运算，而不是设计一个复杂的执行过程。函数式编程的思维过程是完全不同的，它的着眼点是函数，而不是过程，它强调的是如何通过函数的组合变换去解决问题，而不是我通过写什么样的语句去解决问题。
2022-11-15 14:33:07
71
原创 js对象和原型、原型链的关系
JS的原型、原型链一直是比较难理解的内容，不少初学者甚至有一定经验的老鸟都不一定能完全说清楚，更多的"很可能"是一知半解，而这部分内容又是JS的核心内容，想要技术进阶的话肯定不能对这个概念一知半解，碰到问题靠“猜”，却不理解它的规则！
2022-11-15 14:32:48
145
原创 js异步编程的三种模式
javascript语言的执行环境是"单线程"(single thread)，就是指一次只能完成一件任务。如果有多个任务，就必须排队，等前面一个任务完成，再执行后面一个任务，以此类推。这种模式的好处是实现起来比较简单，执行环境相对单纯；坏处是只要有一个任务耗时很长，后面的任务都必须排队等着，会拖延整个程序的执行。
2022-11-15 14:31:56
73
原创 javascript 高级编程 之 Array 用法总结
引用类型是一种数据结构，用于将数据和功能联系起来。创建对象的方式：1.new操作符2.字面量表示法创建Array检测数组:检测数组是基本类型还是引用类型转换方法:将数组转换成字符串或数组对象栈方法:后进先出的操作数组的方法队列方法:先进先出的操作数组的方法操作方法:数组的拼接、截取、插入、删除、替换位置方法:查找数组项、返回索引值迭代方法:对每个数组项进行操作的方法缩小方法:操作数组的每一项，构建最终的返回值arrName instanceof ArrayArray.isArray(arrN
2022-11-14 13:15:25
435
原创 js作用域、作用域链和它的一些优化
随着JavaScript语言的发展，语言中的作用域的种类也变得丰富起来，不再局限于函数作用域作为最小变量声明范围来使用，而是可以基于更小范围的跨级作用域来管理我们的变量引用范围。变量的管理变得更加的灵活、安全。作用域链是作用域链嵌套的结构产物，所有变量标识符的解析和引用会沿着作用域链进行查找。而词法环境，是JavaScript对于作用域的内部技术实现。深入了解词法环境后，也让我们更清楚代码在解析变量标识符时的内部执行过程。也根据这个过程，我们大概总结出了两点关于作用域和变量使用的性能优化点。
2022-11-14 13:14:01
76
原创 细说js变量、作用域和垃圾回收
某个执行环境中的所有代码执行完毕后，该环境将会被销毁，保存在其中的所有变量和函数定义也随之销毁，全局执行环境直至网页或浏览器关闭时才被销毁（ 如果存在闭包，情况又有所不同，会在后面几篇提到 😅，多谢 吴hr 指正）。在函数内部，最接近的环境就是函数的局部环境，若初始化变量时没有使用 var 声明，该变量会自动被添加到全局环境。其中基本类型是按值传递，而引用类型的值是按引用访问的，所以在操作对象时，实际上是在操作对象的引用而不是实际的对象 ( ps：在为对象添加属性时，操作的是实际的对象 )。
2022-11-10 11:32:18
321
原创 JS知识点梳理之作用域、作用域链、柯里化、闭包
作用域是指 js 变量使用时所存在的一个区域，分为全局作用域（window）和局部作用域（function、setTimeout…等都会产生局部作用域）。当局部作用域变量名与全局作用域变量名重复时，局部变量会覆盖全局变量。在局部作用域使用变量时，如果在自己作用域找不到对应变量，则会往上一级作用域查找，直到全局作用域，如果全局作用域无此变量则会报 undefined。相反，全局作用域中无法使用局部作用域中的变量。上面这种一层层向外查询变量的过程叫做查询作用域链。
2022-11-10 11:31:58
59
原创 JS词法环境和执行上下文
JavaScript是一门解释性动态语言，但同时它也是一门充满神秘感的语言。如果要成为一名优秀的JS开发者，那么对JavaScript程序的内部执行原理要有所了解。本文以最新的ECMA规范中的第八章节为基础，理清JavaScript的词法环境和执行上下文的相关内容。这是理解JavaScript其他概念（let/const暂时性死区、变量提升、闭包等）的基础。本文参考的是最新发布的第十代ECMA-262标准，即ES2019。
2022-11-10 11:30:11
66
原创 细说JavaScript闭包
红宝书：闭包是指有权访问另外一个函数作用域中的变量的函数MDN：一个函数和对其周围状态的引用捆绑在一起（或者说函数被引用包围），这样的组合就是闭包。也就是说，闭包让你可以在一个内层函数中访问到其外层函数的作用域。
2022-11-07 16:39:01
98
原创 细说Js中的this
说的是执行上下文的thisbinding。this说的是当前函数的调用位置。这个是概念描述。下面通过上面的只是去分析各种情况下的thisbinding是什么东西。this 提供了一种更优雅的方式来隐式“传递”一个对象引用，因此可以将API设计得更加简洁并且易于复用。随着使用模式越来越复杂，显式传递上下文对象会让代码变得越来越混乱，使用 this 则不会这样箭头函数的this是绑定到父函数foo的，其实不是，只是沿用。因为箭头函数内部没有做任何的绑定操作。局部变量this。
2022-11-07 16:38:05
71
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人