青春木鱼的博客

摘要：前端开发中，document的load和ready事件有重要区别。ready事件（DOMContentLoaded）在HTML文档解析完成后立即触发，不等待样式表、图片等资源加载，适合DOM操作初始化；load事件则需等待页面所有资源加载完毕才触发，适用于依赖完整页面资源的操作。jQuery中通过$(document).ready()和$(window).on('load')调用，原生JS分别对应DOMContentLoaded和load事件监听。选择时需根据代码对资源依赖程度决定。

函数柯里化是将多参数函数转换为单参数函数链式调用的技术，具有参数复用、提前返回和延迟执行三大特点。通过封装通用柯里化工具函数，可以实现参数的部分应用，减少重复代码。典型案例包括正则校验复用和浏览器兼容性处理，其本质是利用闭包保存参数状态。柯里化的核心思想是“降低适用范围，提高适用性”，是函数式编程的重要技术。

本文介绍了八种常见排序算法的原理和实现代码，包括冒泡排序（稳定）、选择排序（不稳定）、插入排序（稳定）、快速排序（不稳定）、堆排序（不稳定）、归并排序（稳定）、希尔排序（不稳定）和计数排序（稳定）。每种算法都通过JavaScript代码示例演示其实现过程，并对排序规则和稳定性进行了说明。这些排序算法涵盖了从简单到复杂的多种排序方法，适用于不同场景下的数组排序需求。

本文介绍了JavaScript中Object.entries()和Object.fromEntries()方法的原理与应用。Object.entries()将对象转换为键值对数组，支持遍历、过滤等操作；Object.fromEntries()是其逆操作，可将键值对数组转回对象。主要应用场景包括：对象遍历、Map转换、表单处理、URL参数解析等。两者配合使用能实现对象属性的灵活转换，但需注意重复键和Symbol键的处理差异。这些方法为对象操作提供了更便捷的数组化处理方式。

本文介绍了JavaScript中读取cookie的多种方法：1. 读取单个cookie可通过原生JS函数解析document.cookie字符串，使用split()和循环匹配目标值；2. 提供了改进方案，包括正则表达式优化、Object.fromEntries转换等更简洁的实现；3. 推荐第三方库（如js-cookie）和现代浏览器API（CookieStore）方案；4. 读取所有cookie可通过分割document.cookie为键值对象。文中详细解析了各方法的实现逻辑、使用场景和注意事项，并建议根据

JavaScript中将伪数组转换为真数组的常用方法：1.推荐使用Array.from()直接转换；2.扩展运算符适用于可迭代对象；3.Array.prototype.slice.call()传统方法；4.循环+push()适用于特定场景。其中Array.from()是最简单可靠的方式，能处理大多数类数组对象转换需求。转换后的数组可使用原生数组方法，便于后续操作。根据实际需求选择合适方法即可。

既然变量可以指向函数，函数的参数能接收变量，那么一个函数就可以接收另一个函数作为参数，这种函数就称之为高阶函数。在JavaScript中，高阶函数（Higher-Order Function，HOF）是一种特殊的函数，它至少需要满足以下两个条件：❶接受一个或多个函数作为参数。❷返回一个函数。

通过 jsonp，我们可以避开浏览器的同源策略，从而进行跨域请求。jsonp 是利用 HTML 标签的 src 属性引用资源不受同源策影响的特性来实现的，实现步骤如下：①通过动态创建 script 标签，其 scr 指向非同源的 url，并传递一个 callback 参数给服务端；②服务器返回一个以 callback 参数作为函数名的函数的调用和一系列参数；③页面接收到响应后执行回调并对数据进行处理。注意：服务器返回的内容，必须是一段可执行的 JavaScript 代码，不能是其它内容

在JavaScript中，‌valueOf()方法主要用于获取对象的原始值。‌对于不同的对象类型，‌valueOf()方法的表现也不同。‌例如，‌对于函数和数组类型，‌valueOf()方法返回的是原始的函数或数组对象。‌而对于Date对象，‌valueOf()方法返回的是表示日期和时间的数值。‌

String() 和 toString() 都可以转换为字符串类型，但是toString()不可以转换null 和 undefined，因为null 和 undefined 没有自己的包装对象，不能访问对象的toString() 方法，包装对象的属性引用结束，这个新创建的临时对象就会被销毁了。

pm2是带负载均衡功能的nodejs应用程序的进程管理工具，内置负载均衡。其可以帮助您保持node应用程序的永久活动，无需停机皆可重新加载node应用程序。

最新出炉的TIOBE 4月编程语言排行榜出炉啦！大狮兄替大家先看了下，发现其中最引人注目的是，几位曾经的热门选手似乎正在逐渐淡出大众视野...

在现代Web开发中，清除Cookie是维护网站用户隐私和安全性的一个重要步骤。JavaScript提供了几种方法来清除Cookie，包括直接删除特定的Cookie、设置Cookie的过期时间为过去的时间点、以及使用第三方库来辅助清除。在这些方法中，最为直接且常用的技术就是通过设置Cookie的过期时间为过去的时间点来“删除”它。

异步代码需要等同步代码先执行，所以当异步定时器执行时， 同步的for循环已经循环完毕

本文详细解析了一道JavaScript面试题，涉及map函数和parseInt函数的用法。当parseInt作为map的迭代函数时，由于缺少第二个参数（进制），导致结果并非预期的[1,2,3]，而是[1,NaN,NaN]。文章还通过多个例子解释了parseInt的进制解析规则，并提供了额外的变种题供读者思考。

String() 和 toString() 都可以转换为字符串类型，但是toString()不可以转换null 和 undefined，因为null 和 undefined 没有自己的包装对象，不能访问对象的toString() 方法，包装对象的属性引用结束，这个新创建的临时对象就会被销毁了。

在JavaScript中，自定义DOM事件可以通过`CustomEvent`或Event构造函数来创建，并可以使用`dispatchEvent`方法来触发。

JavaScript 中的 new Date() 方法用于创建一个新的 Date 对象，该对象表示当前日期和时间。Date 对象提供了许多方法和属性，可以用于获取和设置日期和时间信息。

Object.defineProperty只能遍历对象属性进行劫持，Proxy直接可以劫持整个对象，并返回一个新对象，我们可以只操作新的对象达到响应式目的。在 Vue 中，Object.defineProperty 无法监控到数组下标的变化，导致直接通过数组的下标给数组设置值，不能实时响应。Object.defineProperty 只能劫持对象的属性，因此我们需要对每个对象的每个属性进行遍历。

每个对象拥有一个原型对象，对象以其原型为模板，从原型继承属性和方法。当然 原型对象 也可能拥有原型，并从中继承属性和方法，依此类推，这种关系被称为原型链。准确地说，这些属性和方法定义在Object的构造器函数(constructor functions)之上的prototype属性上，而非对象实例本身。

性能优化，是每一个开发者都会遇到的问题，特别是现在越来越重视体验，以及竞争越来越激烈的环境下，对于我们开发者来说，只完成迭代，把功能做好是远远不够的，最重要的是把产品做好，让更多人愿意使用，让用户用得更爽，这不也是我们开发者价值与能力的体现吗？重视性能问题，优化产品的体验，比起改几个无关痛痒的 bug 要有价值得多。

JS中的global、window以及document对象的区别

JS中的事件对象event和window.event的区别：window.event‌是Internet Explorer特有的事件对象，不支持其他浏览器。event‌遵循W3C标准，是大多数现代浏览器支持的事件对象。在标准兼容的浏览器中，事件对象作为参数传递给事件处理函数。

在实现Vue移动端适配方面，主要依赖于视口单位（Viewport units）、Flexible.js、PostCSS插件、以及媒体查询（Media Queries）这几个关键技术和策略。其中，Flexible.js是一种广泛采用的解决方案，因为它能够动态改变根元素的字体大小，进而影响整个应用的布局。

垃圾回收机制也称Garbage Collection简称GC。在JavaScript中拥有自动的垃圾回收机制，通过一些回收算法，找出不再使用引用的变量或属性，由JS引擎按照固定时间间隔周期性的释放其所占的内存空间。在C/C++中需要程序员手动完成垃圾回收。

reject是用来抛出异常的，catch是用来处理异常的；reject是Promise的方法，而then和catch是Promise实例的方法（Promise.prototype.then 和 Promise.prototype.catch）。

如何缓存 JavaScript、CSS 文件是一个关注点，因为这能显著提升网站性能、减少服务器负载、节省带宽。简而言之，缓存是指浏览器存储网页资源的一种机制，使得用户在访问同一页面时，无需重新下载相同的资源。特别地，对于JavaScript和CSS文件，一旦缓存，就可以在用户的后续访问中使用本地副本，这样可以加快页面加载速度、改善用户体验。其中，最常用的缓存实现方式包括设置HTTP缓存标头，如Cache-Control和Expires，以及使用服务工作器（Service Workers）。

JS中获得鼠标位置的属性有哪些？

规范JavaScript的注释方法包括使用单行注释、多行注释、使用JSDoc风格的注释以及采用一致的注释习惯。其中，使用JSDoc风格的注释是为了提高代码的可读性和维护性，通过在函数和变量声明之前添加规范化的注释，为代码的每一部分提供清晰的文档说明。这种做法不仅有助于团队成员之间的沟通，也便于未来的代码维护和更新。

软件制作的流程主要包含需求分析、系统设计、编码实现、测试验证、部署上线和维护更新。其中，需求分析是基础，它决定了软件的功能和性能；通过与用户的沟通，明确软件要解决的问题和要实现的目标，以及预期的用户体验。这个阶段的成果通常是需求规格说明书，它将指导后续开发工作。

JavaScript的内存回收优化关键在于理解内存生命周期、减少内存泄露以及合理运用内存管理手段。具体方法包括：避免全局变量的滥用、使用局部变量以便回收、减少对闭包的不当使用、解绑无用的事件监听器、避免不必要的大型数据结构、使用WeakMap和WeakSet以便垃圾回收、利用Chrome DevTools定位内存问题。其中，解绑无用的事件监听器尤为重要，因为忘记解除绑定的事件监听器可能导致DOM元素无法被回收，从而产生内存泄露。这意味着即便相关DOM已从文档中移除，由于仍然存在引用（事件监听器），它的内存仍

在JavaScript中，常用的模块化规范有以下几种：CommonJS规范：主要用于服务器端编程，是Node.js采用的模块化规范。通过require方法加载模块，通过module.exports和export对象输出模块。AMD规范：主要用于浏览器端编程，是RequireJS采用的模块化规范。通过定义方。ES6模块规范：是ECMAScript 6采用的模块化规范，是JavaScript官方标准。通过export关键字输出模块，通过import。

在实际应用中，如果客户端不支持Cookie或禁用Cookie功能，那么服务器就无法获取Session的ID属性，也无法获取与该客户端对应的Session对象。为了解决这个问题，URL重写技术被引入到Session机制中。在无法得知客户端是否支持Cookie功能时，将Seesion的ID属性追加到URL地址的后面，从而实现会话跟踪功能。

在现代的网页设计中，为了提高用户体验和网站性能，图片懒加载已经成为一个常见的技术。图片懒加载可以减少初始加载时间，延迟加载图片直到用户滚动到它们所在的位置。另外，为了进一步提升用户体验，添加淡入效果可以使页面更加平滑和吸引人。在本文中，我们将学习如何使用JavaScript实现图片懒加载的淡入效果。

要实现图片的懒加载，核心的方法包括：利用JavaScript监听滚动事件、通过getBoundingClientRect()判断图片是否进入可视区域、使用Intersection Observer API、结合data属性暂存图片地址。在现代浏览器中，推荐使用Intersection Observer API来实现图片的懒加载，因为它相比传统的事件监听方式更为高效且易于维护。

JS | JS之深入理解滚动大小scroll系列属性

‌客户区client系列属性主要包括clientWidth和clientHeight两个属性。‌‌clientWidth属性‌：此属性返回一个元素的宽度值，包括元素的内容和内边距，但不包括边框、外边距和滚动条部分。返回值是一个整数，单位是像素。此属性是只读的‌。‌clientHeight属性‌：此属性返回一个元素的高度值，包括元素的内容和内边距，但不包括边框、外边距和滚动条部分。返回值也是一个整数，单位是像素。此属性是只读的‌。‌这两个属性的主要用途是获取元素的可视区域大小，不包括滚动条等隐

偏移量(offset dimension)是javascript中的一个重要的概念。涉及到偏移量的主要是offsetLeft、offsetTop、offsetHeight、offsetWidth这四个属性。当然，还有一个偏移参照——定位父级offsetParent。

IntersectionObserver是一种浏览器提供的API，用于监测元素与其祖先元素或视窗的交叉状态。‌ 它通过异步观察目标元素是否可见，来判断目标元素与视窗或其祖先元素的交叉比例，因此也被称为“交叉观察器”。IntersectionObserver的核心功能是判断元素是否进入、离开或部分可见于视窗，这通常用于实现如懒加载、无限滚动等功能‌

在前端开发过程中，我们经常需要获取HTML元素的尺寸和位置信息。getBoundingClientRect()方法就是一个非常重要的工具，它可以帮助我们获取元素的大小及其相对于视口的位置。