JavaScript
文章平均质量分 79
JavaScript(简称“JS”)是一种具有函数优先的轻量级,解释型或即时编译型的编程语言。它是前端的基础,本专栏将会系统性的介绍为以后前端学习之路奠定基础。
好久不见的流星
一入外包深似海,从此大厂是路人。
展开
-
【JavaScript】异步加载脚本
异步加载脚本是提高Web应用性能的一种重要手段。通过了解异步加载脚本的原理、优势,并运用一些实用的技巧,我们可以更好地利用这一特性来优化页面加载速度,提升用户体验。希望通过本篇博客,你对JavaScript异步加载脚本有了更深入的了解,并能够在实际项目中巧妙地运用异步加载脚本来提高性能。原创 2024-02-26 00:15:00 · 2091 阅读 · 0 评论 -
【JavaScript】合理使用缓存
合理使用缓存是提高Web应用性能的有效手段。通过了解HTTP缓存、本地存储、Service Worker缓存等机制,以及在实际项目中的应用实践,我们可以更好地优化Web应用的性能,提升用户体验。希望通过本篇博客,你对缓存的概念和应用有了更清晰的认识,并能够在项目中巧妙地利用缓存来优化性能。原创 2024-02-26 00:00:00 · 980 阅读 · 0 评论 -
【JavaScript】减少 DOM 操作
减少DOM操作是提高Web应用性能的有效途径之一。通过使用文档片段、事件委托、缓存选择器、缓存计算值等技巧,可以有效降低浏览器的重排和重绘次数,提高页面性能。在编写JavaScript代码时,要时刻关注DOM操作的影响,并选择最优的方案。希望通过本篇博客,你对如何减少DOM操作有了更清晰的认识,并能够在实际项目中应用这些技巧。原创 2024-02-25 00:15:00 · 1731 阅读 · 0 评论 -
【JavaScript】CORS(跨源资源共享)
CORS是现代跨域解决方案的核心,通过在服务端设置响应头,实现了在浏览器中安全、可控地进行跨域请求。了解CORS的原理和使用步骤,对于处理跨域问题至关重要。在使用CORS时,注意设置合适的CORS头,处理带凭据的请求,以及对预检请求的正确响应。希望通过本篇博客,你对CORS有了更深入的了解,并能够在实际项目中应用这一现代跨域解决方案。原创 2024-02-25 00:00:00 · 1937 阅读 · 0 评论 -
【JavaScript】JSONP
在前端页面中预定义一个回调函数,该函数将在服务端返回数据时被调用。JSONP 作为一种简单而又实用的跨域数据获取技术,广泛应用于 Web 开发中。通过动态创建script标签,JSONP 绕过了同源策略的限制,实现了在前端页面中获取跨域数据的目的。在使用 JSONP 时,需要注意安全性问题和服务端的支持。希望通过本篇博客,你对 JSONP 的原理和使用有了更深入的了解,并能够在实际项目中灵活应用这一跨域数据获取的神奇利器。原创 2024-02-24 00:15:00 · 1376 阅读 · 0 评论 -
【JavaScript】使用浏览器提供的 API
浏览器 API 为 Web 开发者提供了丰富的功能,Geolocation API、Canvas API、Web Audio API 等都是强大的工具,可以在 Web 应用中实现地理位置获取、图形绘制和音频处理等功能。通过合理运用这些 API,你可以打造出更加丰富、交互性强的 Web 应用。希望通过本篇博客,你对这些浏览器 API 有了更深入的了解,并能够在实际项目中巧妙地应用它们。原创 2024-02-24 00:00:00 · 1147 阅读 · 0 评论 -
【JavaScript】事件循环机制
事件循环是 JavaScript 运行时的基础,它是一个持续运行的进程,负责处理消息队列中的任务。事件循环使得 JavaScript 在等待 I/O 操作、定时器和其他异步任务时,仍然能够继续执行其他同步任务,保持程序的响应性。JavaScript 的事件循环机制是异步编程的基础,通过合理使用宏任务和微任务, JavaScript 能够保持程序的响应性,处理大量的异步任务。理解事件循环机制有助于更好地编写异步代码,避免陷入回调地狱,提高代码的可维护性。原创 2024-02-23 00:15:00 · 1012 阅读 · 0 评论 -
【JavaScript】JavaScript 的单线程执行
单线程意味着 JavaScript 代码在执行时只有一个主线程,按照代码的书写顺序依次执行。这一设计决策是为了简化语言的复杂性,避免多线程并发带来的复杂性和不确定性。JavaScript 的单线程执行模型通过异步编程的机制,在面对大量 I/O 操作时依然能够高效运行。通过事件循环和回调函数的结合,JavaScript 实现了异步非阻塞的特性,使得程序具有更好的响应性和用户体验。希望通过本篇博客,你对 JavaScript 的单线程执行模型和异步编程有了更深入的了解,并能够在实际项目中灵活运用这些特性。原创 2024-02-23 00:00:00 · 935 阅读 · 0 评论 -
【JavaScript】字符串的正则匹配和替换
字符串的正则匹配和替换是 JavaScript 中常见而强大的操作,通过合理运用正则表达式,你可以轻松实现字符串的处理和转换。本篇博客深入讨论了字符串的正则匹配和替换的基本方法,包括test()match()replace()等,以及一些常见应用场景。希望通过本篇博客,你对 JavaScript 中字符串的正则匹配和替换有了更深入的了解,并能在实际项目中灵活应用这些技巧。原创 2024-02-22 00:15:00 · 2273 阅读 · 0 评论 -
【JavaScript】正则表达式的基本语法
正则表达式是 JavaScript 中强大的模式匹配工具,通过学习正则表达式的基本语法,你可以更灵活地处理字符串。本篇博客深入讨论了正则表达式的创建、基本匹配规则、字符类和范围、量词、转义字符等内容,并通过实例演示了常见正则表达式的应用。希望通过本篇博客,你对 JavaScript 中正则表达式有了更深入的了解,并能更自信地运用正则表达式处理字符串。原创 2024-02-22 00:00:00 · 434 阅读 · 0 评论 -
【JavaScript】模块的导入和导出
JavaScript 中的模块化编程通过导入和导出的方式,使得代码结构更加清晰、可维护性更高。通过命名导出和默认导出,可以在项目中实现不同的导入方式。模块的使用不仅有助于团队协作,而且有助于项目结构的组织。希望通过本篇博客,你对 JavaScript 中模块的导入和导出有了更深入的了解,并能在实际项目中灵活运用。原创 2024-02-21 00:15:00 · 1158 阅读 · 0 评论 -
【JavaScript】CommonJS 和 ES6 模块
CommonJS 和 ES6 模块是 JavaScript 中两种不同的模块化系统,各自在不同的项目环境中发挥着重要作用。CommonJS 主要用于服务器端开发,而 ES6 模块更适用于现代的 Web 前端开发。在实际项目中,选择合适的模块化系统取决于项目的需求、环境以及开发团队的偏好。希望通过本篇博客,你对 CommonJS 和 ES6 模块有了更深入的了解,并能在实际项目中灵活运用。原创 2024-02-21 00:00:00 · 966 阅读 · 0 评论 -
【JavaScript】try-catch 语句
在代码中使用变量前,可以通过try-catch来捕获未定义变量引发的异常,从而避免程序崩溃。let value;try {// 抛出 TypeError: Cannot read property 'toUpperCase' of undefined// 输出:TypeError: Cannot read property 'toUpperCase' of undefinedtry-catch。原创 2024-02-20 00:15:00 · 527 阅读 · 0 评论 -
【JavaScript】异常和错误对象
异常和错误是编程中不可避免的一部分,了解如何处理异常以及使用错误对象是编写健壮和可维护代码的关键。JavaScript 中的try-catch语句、finally块和throw语句为开发者提供了灵活的错误处理机制。通过合理的错误处理,可以提高程序的稳定性和可靠性。希望通过本篇博客,你对 JavaScript 中的异常、错误对象以及错误处理技术有了更深入的了解。原创 2024-02-20 00:00:00 · 580 阅读 · 0 评论 -
【JavaScript】ES6 中的类和模块
ES6 中引入的类和模块为 JavaScript 提供了现代化的编程方式,使得面向对象和模块化编程更加直观和易用。类提供了更简洁的语法和更灵活的继承方式,而模块则使得代码更易于组织和复用。在实际项目中,使用 ES6 的类和模块有助于提高代码的可读性、可维护性和可扩展性。希望通过本篇博客,你对 ES6 中的类和模块有了更深入的了解。原创 2024-02-19 00:15:00 · 752 阅读 · 0 评论 -
【JavaScript】原型链和继承
原型链和继承是 JavaScript 中重要的概念,它们构建了对象之间的关系,使得代码更具结构和可维护性。通过原型链,对象可以共享属性和方法,实现了灵活的对象结构。继承则使得对象可以基于现有的对象构建,并在此基础上进行扩展。在实际开发中,根据需求选择适当的继承方式,可以提高代码的复用性和可读性。希望通过本篇博客,你对原型链和继承的概念、构建方式、实现方式以及最佳实践有了更深入的了解。原创 2024-02-19 00:00:00 · 1003 阅读 · 0 评论 -
【JavaScript】创建和使用构造函数
构造函数是 JavaScript 中用于创建对象的一种重要方式。通过构造函数,你可以定义自己的对象类型,并在创建对象时进行一些初始化操作。构造函数中可以包含属性和方法,并通过原型链来实现方法的共享。在实际开发中,构造函数是创建可重复使用的对象的有力工具,为代码提供了更好的结构和可维护性。希望通过本篇博客,你对构造函数的概念、创建方式、使用方法以及一些最佳实践有了更深入的了解。原创 2024-02-18 00:15:00 · 1303 阅读 · 0 评论 -
【JavaScript】IndexedDB
IndexedDB 是一种在浏览器中存储和检索大量结构化数据的强大工具。通过异步操作、事务、索引等特性,它提供了高性能的数据存储和检索方式。IndexedDB 适用于需要大容量、高性能存储的应用场景,如离线应用、大型数据管理等。希望通过本篇博客,你对IndexedDB的概念、基本用法以及适用场景有了更深入的了解。原创 2024-02-18 00:00:00 · 1855 阅读 · 0 评论 -
【JavaScript】localStorage 和 sessionStorage
localStorage和sessionStorage是前端常用的本地存储方式,它们提供了简单的API来存储和检索数据。localStorage适用于长期存储,而sessionStorage适用于短期存储。根据应用场景和数据生命周期的需求,选择合适的存储方式是非常重要的。希望通过本篇博客,你对localStorage和sessionStorage的概念、使用方式以及适用场景有了更深入的了解。原创 2024-02-17 00:15:00 · 1443 阅读 · 0 评论 -
【JavaScript】Cookies
Cookies 是存储在用户计算机上的小型文本文件,由浏览器保存。它们包含了一些与特定站点或用户相关的信息,用于在用户访问同一站点时传递和存储数据。Cookies 是 Web 开发中常用的数据存储和传递方式,通过 JavaScript 可以方便地进行 Cookies 的设置、读取和删除。Cookies 广泛应用于记住用户登录状态、存储用户偏好设置等场景。但在使用 Cookies 时,需要注意安全性和隐私保护,避免存储敏感信息,并根据需要设置安全标志和 HttpOnly 标志。原创 2024-02-17 00:00:00 · 664 阅读 · 0 评论 -
【JavaScript】处理响应数据
通过本篇博客,你深入了解了在 JavaScript 中如何处理不同类型的 HTTP 响应数据。使用 Fetch API 的方式更为现代和灵活,提供了对 JSON、文本、二进制、FormData 等多种响应数据类型的处理方法。根据项目需求和数据格式,选择适当的处理方式是非常重要的。希望本篇博客能够帮助你更好地处理和利用 HTTP 请求的响应数据。原创 2024-02-16 00:15:00 · 894 阅读 · 0 评论 -
【JavaScript】使用 XMLHttpRequest 和 Fetch API
老式API:XMLHttpRequest 是较老的 API,虽然在现代浏览器中仍然可用,但 Fetch API 更加现代且易用繁琐的用法:相对于 Fetch API,XMLHttpRequest 的用法相对繁琐,需要多个步骤配置和处理根据项目的需求和个人喜好,选择合适的 HTTP 请求方式是很重要的。XMLHttpRequest 适用于更古老的项目或需要与较老系统交互的场景,而 Fetch API 更适合现代化的项目,提供了更直观和简单的 API。原创 2024-02-16 00:00:00 · 851 阅读 · 0 评论 -
【JavaScript】发送HTTP请求
在 JavaScript 中,发送 HTTP 请求的方式有多种,选择适合自己项目需求的方式是很重要的。XMLHttpRequest 提供了基本的功能,Fetch API 提供了更现代的 API,而 Axios 则是一个流行的第三方库,提供了更多便捷的特性。根据项目的需求和个人偏好选择适合的方式进行 HTTP 请求。希望通过本篇博客,你对 JavaScript 中发送 HTTP 请求的几种方式有了更深入的了解。原创 2024-02-15 00:15:00 · 1436 阅读 · 0 评论 -
【JavaScript】async 和 await
是 ECMAScript 2017 标准中引入的新特性,用于简化 Promise 的使用和处理异步代码。async用于定义一个返回 Promise 的异步函数,而await用于暂停异步函数的执行,等待 Promise 解决。try {在上述例子中,通过async关键字定义了一个异步函数,其中使用了await关键字等待fetchData函数的 Promise 解决。这种写法让异步代码看起来更像同步代码,提高了可读性。是 JavaScript 中处理异步操作的一种现代、直观的方式。通过async。原创 2024-02-15 00:00:00 · 357 阅读 · 0 评论 -
【JavaScript】Promise 和异步操作
Promise 是一种表示异步操作最终完成或失败的对象。pending(等待中)、fulfilled(已成功)、rejected(已失败)。一旦状态发生变化,就会触发相应的回调函数。// 异步操作,例如网络请求或定时器");} else {");}, 1000);});在上述例子中,通过创建了一个 Promise 对象,它表示一个异步操作。在 Promise 内部,通过resolve和reject回调函数来改变 Promise 的状态。原创 2024-02-14 00:15:00 · 968 阅读 · 0 评论 -
【JavaScript】回调函数
回调函数是在一个函数执行完毕后,通过参数传递给另一个函数并在后者执行的函数。通常,回调函数用于处理异步操作、事件处理、定时器等场景。// 模拟异步操作}, 1000);在上述例子中,fetchData函数模拟了一个异步操作,它接受一个回调函数作为参数。当异步操作完成后,回调函数被调用并处理了获取到的数据。回调函数是 JavaScript 中异步编程的基础,它允许我们在一个操作完成后执行特定的逻辑。无论是作为函数参数还是匿名函数,回调函数在处理事件、定时器、异步请求等场景中都发挥着关键作用。原创 2024-02-14 00:00:00 · 1804 阅读 · 0 评论 -
【JavaScript】事件处理(添加事件监听器、事件对象)
添加事件监听器和使用事件对象是 JavaScript 中事件处理的两个关键方面。通过方法,你可以动态地为元素添加不同类型的事件监听器,实现更丰富的用户交互。事件对象则提供了事件发生时的详细信息,帮助你更精确地处理事件。希望通过本篇博客,你对 JavaScript 事件处理的添加事件监听器与事件对象有了更深入的理解。原创 2024-02-13 00:15:00 · 625 阅读 · 0 评论 -
【JavaScript】操作 HTML 和 CSS
通过 JavaScript 操作 HTML 文档和 CSS 样式是前端开发中常见的任务。通过获取和修改元素内容、添加和删除元素、修改样式等操作,你可以实现更丰富的用户交互体验。同时,通过事件处理,你可以响应用户的操作并进行相应的处理。希望通过本篇博客,你对通过 JavaScript 操作 HTML 和 CSS 有了更全面的认识。原创 2024-02-13 00:00:00 · 550 阅读 · 0 评论 -
【JavaScript】文档对象模型(DOM)的基本概念
DOM 是一种用于表示和操作文档结构的树状模型。它将 HTML 或 XML 文档中的每个元素、属性、文本等都视为一个对象,通过这些对象,你可以使用 JavaScript 来操纵文档的内容、结构和样式。文档对象模型(DOM)是 JavaScript 中用于操作 HTML 和 XML 文档的重要概念。它以树状结构表示文档的层次关系,通过提供各种方法和属性,使开发者能够轻松地获取、修改和创建文档中的元素。DOM 也支持事件处理,使得用户交互可以通过 JavaScript 来响应和控制。原创 2024-02-12 00:15:00 · 395 阅读 · 0 评论 -
【JavaScript】遍历对象和数组
遍历是 JavaScript 中常见的操作,通过for...in循环、for循环、forEach()方法和for...of循环等方法,你可以方便地遍历对象和数组中的元素。对于多维数组,可以使用嵌套的循环进行遍历。希望通过本篇博客,你对 JavaScript 中对象和数组的遍历有了更深入的理解。原创 2024-02-12 00:00:00 · 756 阅读 · 0 评论 -
【JavaScript】数组的创建和操作
数组是 JavaScript 中常用的数据结构,通过字面量表示法、构造函数、索引访问和各种数组方法,你可以方便地创建、修改和操作数组。数组的遍历可以通过for循环和数组方法(如forEach())实现,多维数组则提供了更复杂的数据结构。希望通过本篇博客,你对 JavaScript 中数组的创建和操作有了更深入的理解。原创 2024-02-11 00:15:00 · 456 阅读 · 0 评论 -
【JavaScript】对象的属性和方法
对象的属性和方法是 JavaScript 中非常重要的概念,通过字面量表示法、计算属性名、嵌套属性等方式,你能够创建灵活多样的对象。属性和方法的访问可以使用点表示法和方括号表示法,根据不同的需求选择不同的方式。删除属性和方法可以使用delete关键字,遍历属性可以使用for...in循环和方法。希望通过本篇博客,你对 JavaScript 中对象的属性和方法有了更深入的理解。原创 2024-02-11 00:00:00 · 684 阅读 · 0 评论 -
【JavaScript】创建和访问对象
对象是 JavaScript 中非常重要的数据结构,可以用于组织和存储复杂的数据。通过字面量表示法、构造函数和方法,你可以灵活地创建对象。对象的访问可以使用点表示法、方括号表示法和this关键字,根据不同的需求选择不同的方式。同时,通过for...in循环、和方法,你能够方便地遍历对象的属性。希望通过本篇博客,你对 JavaScript 中对象的创建和访问有了更深入的理解。原创 2024-02-11 00:15:00 · 631 阅读 · 0 评论 -
【JavaScript】匿名函数和箭头函数
匿名函数和箭头函数都是 JavaScript 中常见的函数表达式形式,各有各的用途和特点。匿名函数通过函数表达式的方式定义,可用于自执行等场景;而箭头函数提供了更简洁的语法和特有的this继承机制,适用于简单的函数定义和解决this指向问题。希望通过本篇博客,你对 JavaScript 中的匿名函数和箭头函数有了更深入的理解。原创 2024-02-11 00:00:00 · 651 阅读 · 0 评论 -
【JavaScript】作用域和闭包
作用域和闭包是 JavaScript 中的两个基础概念,深刻理解它们对于编写可维护、高效的代码至关重要。作用域定义了变量的可访问范围,而闭包则允许函数访问外部作用域的变量。通过合理运用作用域和闭包,可以实现更灵活、模块化的代码结构。希望通过本篇博客,你对 JavaScript 中的作用域和闭包有了更深入的理解。原创 2024-02-10 08:00:00 · 468 阅读 · 0 评论 -
【JavaScript】参数和返回值
参数和返回值是 JavaScript 函数的核心概念之一。通过了解如何传递参数、使用默认参数、返回值和返回对象等概念,你能够更灵活地设计和使用函数。函数的参数和返回值的设计不仅能够提高代码的复用性,还能使代码更加清晰和易于理解。希望通过本篇博客,你对 JavaScript 中的函数参数和返回值有了更深入的理解。原创 2024-02-09 00:30:00 · 731 阅读 · 0 评论 -
【JavaScript】函数声明和调用
函数是 JavaScript 中组织和重用代码的重要手段。通过函数声明和调用,你能够将代码模块化,提高代码的可读性和维护性。了解如何声明函数、调用函数、返回值、使用函数表达式和箭头函数等概念,是成为JavaScript开发者的基础。希望通过本篇博客,你对 JavaScript 中的函数声明和调用有了更深入的理解。原创 2024-02-09 00:00:00 · 533 阅读 · 0 评论 -
【JavaScript】switch 语句
switch语句是 JavaScript 中用于多个条件判断的一种有效工具。通过清晰的结构和简单的语法,你可以更好地组织代码,提高代码的可读性。在使用switch语句时,记得使用break来防止执行多个case。希望通过本篇博客,你对 JavaScript 中的switch语句有了更深入的理解。原创 2024-02-08 00:15:00 · 1789 阅读 · 0 评论 -
【JavaScript】循环语句
循环语句是 JavaScript 中非常重要的控制结构,能够在不同的情况下灵活运用。通过forwhile和do-while循环,你可以实现代码的重复执行。在编写循环时,确保你清晰地了解循环的终止条件,避免陷入无限循环。希望通过本篇博客,你对 JavaScript 中的循环语句有了更深入的理解。原创 2024-02-08 00:00:00 · 434 阅读 · 0 评论 -
【JavaScript】条件语句
条件语句在 JavaScript 中是控制程序流程的关键,它允许你根据不同的条件选择执行不同的代码块。通过ifelse ifelse的组合,以及switch语句,你可以更灵活地处理不同情况的逻辑。在编写代码时,合理运用条件语句,确保代码的可读性和逻辑清晰性是非常重要的。希望通过本篇博客,你对 JavaScript 中的条件语句有了更深入的理解。原创 2024-02-07 00:15:00 · 623 阅读 · 0 评论