
【JavaScript】学习
文章平均质量分 87
【JavaScript】学习
江湖人称菠萝包
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-附录D-JavaScript 工具
Emscripten 与 LLVM。构建工具、自动化系统和任务运行器。编译/转译工具及静态类型系统。JavaScript 工具。原创 2025-03-07 00:00:00 · 949 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-附录C-JavaScript 库和框架
JavaScript 库和框架。原创 2025-03-06 00:00:00 · 759 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-附录B-严格模式
eval 与 arguments。原创 2025-03-05 00:00:00 · 763 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-附录A-ES2018 和 ES2019
处理异步迭代器的 reject()对象字面量的剩余操作符和扩展操作符。ES2018 和 ES2019。使用 next()手动异步迭代。Unicode 属性转义。可选的 catch 绑定。创建并使用异步迭代器。原创 2025-03-04 00:00:00 · 794 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter28-最佳实践
这里有 6 次属性查找:3 次是为查找 window.location.href.substring(),3 次是为查找window.location.href.indexOf()。第一次仍然要用 O(n)的复杂度去访问这个属性,但后续每次访问就都是 O(1),这样就是质的提升了。另外,如果实现某个需求既可以使用数组的数值索引,又可以使用命名属性(比如 NodeList 对象),那就都应该使用数值索引。常量值或 O(1),指字面量和保存在变量中的值,表示读取常量值所需的时间不会因值的多少而变化。原创 2025-03-03 00:00:00 · 981 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter27-工作者线程
建立的连接会在页面的生命周期内持续存在,只有当页面销毁且没有连接时,浏览器才会终止共享线程。在共享线程端口(稍后讨论)上调用 close()时,只要还有一个端口连接到该线程就不会真的终止线程。如上表所示,标签页 2 和标签页 3 再次调用 new SharedWorker()会连接到已有线程。随着连接的增加和移除,浏览器会记录连接总数。共享工作者线程的生命周期具有与专用工作者线程相同的阶段的特性。不同之处在于,专用工作者线程只跟一个页面绑定,而共享工作者线程只要还有一个上下文连接就会持续存在。原创 2025-03-02 00:00:00 · 1382 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter26-模块
使用 ES6 之前的模块加载器。原创 2025-03-01 00:00:00 · 733 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter25-客户端存储
JavaScript 中的 cookie。sessionStorage 对象。使用 cookie 的注意事项。localStorage 对象。cookie 的构成。Storage 类型。原创 2025-02-28 00:00:00 · 908 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter24-网络请求与远程资源
Response 类还有两个用于生成 Response 对象的静态方法:Response.redirect()和 Response.error()。大多数情况下,产生 Response 对象的主要方式是调用 fetch(),它返回一个最后会解决为Response 对象的期约,这个 Response 对象代表实际的 HTTP 响应。另一个静态方法 Response.error()用于产生表示网络错误的 Response 对象(网络错误会导致fetch()期约被拒绝)。创建 Response 对象。原创 2025-02-27 00:00:00 · 970 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter23-JSON
toJSON()方法。原创 2025-02-26 00:00:00 · 811 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter22-处理 XML
浏览器对 XML DOM 的支持。XMLSerializer 类型。XSLTProcessor 类型。浏览器对 XPath 的支持。浏览器对 XSLT 的支持。DOMParser 类型。原创 2025-02-25 00:00:00 · 970 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter21-错误处理与调试
所有现代桌面浏览器都会通过控制台暴露错误。这些错误可以显示在开发者工具内嵌的控制台中。在前面提到的所有浏览器中,访问开发者工具的路径是相似的。可能最简单的查看错误的方式就是在页面上单击鼠标右键,然后在上下文菜单中选择 Inspect(检查)或 Inspect Element(检查元素),然后再单击 Console(控制台)选项卡。要直接进入控制台,不同操作系统和浏览器支持不同的快捷键,如下表所示。结果就是在页面的一个小区域内显示日志信息。抛出错误与 try/catch。finally 子句。原创 2025-02-24 00:00:00 · 884 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter20-JavaScript API
这些事件被设计得尽可能具体,以便 Web 开发者能够使用较少的 HTML 和 JavaScript 创建自定义的音频/视频播放器(而不是创建新 Flash 影片)。除了有很多属性,媒体元素还有很多事件。这些事件会监控由于媒体回放或用户交互导致的不同属性的变化。下表列出了这些事件。这两个元素有很多共有属性,可以用于确定媒体的当前状态,如下表所示。File API 与 Blob API。FileReaderSync 类型。FileReader 类型。对象 URL 与 Blob。CryptoKey 与算法。原创 2025-02-23 00:00:00 · 568 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter19-表单脚本
document.execCommand()可以接收 3 个参数:要执行的命令、表示浏览器是否为命令提供用户界面的布尔值和执行命令必需的值(如果不需要则为 null)。最后一个方法是 queryCommandValue(),此方法可以返回执行命令时使用的值(即前面示例的execCommand()中的第三个参数)。虽然这些命令并不都可以通过 document.execCommand()使用,但相应的键盘快捷键都是可以用的。注意,即使命令是所有浏览器都支持的,命令生成的 HTML 通常差别也很大。原创 2025-02-22 00:00:00 · 541 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter18-动画与 Canvas 图形
通过 requestAnimationFrame 节流。使用 requestAnimationFrame。GLSL 100 升级到 GLSL 300。WebGL1 与 WebGL2。动画与 Canvas 图形。原创 2025-02-21 00:00:00 · 791 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter17-事件
事件处理程序的名字以"on"开头,因此 click 事件的处理程序叫作 onclick,而 load 事件的处理程序叫作 onload。这个对象包含了一些基本信息,比如导致事件的元素、发生的事件类型,以及可能与特定事件相关的任何其他数据。通过在按钮的 onclick 事件处理程序中将 cancelBubble 设置为 true,可以阻止事件冒泡到document.body,也就阻止了调用注册在它上面的事件处理程序。与 DOM 事件对象不同, IE 事件对象可以基于事件处理程序被指定的方式以不同方式来访问。原创 2025-02-20 00:00:00 · 1006 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter16-DOM2 和 DOM3
任何支持 style 属性的 HTML 元素在 JavaScript 中都会有一个对应的 style 属性。这个 style 属性是 CSSStyleDeclaration 类型的实例,其中包含通过 HTML style 属性为元素设置的所有样式信息,但不包含通过层叠机制从文档样式和外部样式中继承来的样式。HTML style 属性中的 CSS 属性在 JavaScript style 对象中都有对应的属性。本节介绍的属性和方法并不是 DOM2 Style 规范中定义的,但与 HTML 元素的样式有关。原创 2025-02-19 00:00:00 · 699 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter15-DOM 扩展
IE9 之前的版本与其他浏览器在处理空白文本节点上的差异导致了 children 属性的出现。children 属性是一个 HTMLCollection,只包含元素的 Element 类型的子节点。如果元素的子节点类型全部是元素类型,那 children 和 childNodes 中包含的节点应该是一样的。自然地,JavaScript 与 CSS 类的交互就增多了,包括动态修改类名,以及根据给定的一个或一组类名查询元素,等等。contains()方法应该在要搜索的祖先元素上调用,参数是待确定的目标节点。原创 2025-02-18 00:00:00 · 1576 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter14-DOM
注意,在调用 observe()时,MutationObserverInit 对象中的 attribute、characterData和 childList 属性必须至少有一项为 true(无论是直接设置这几个属性,还是通过设置attributeOldValue 等属性间接导致它们的值转换为 true)。因为回调执行之前可能同时发生多个满足观察条件的事件,所以每次执行回调都会传入一个包含按顺序入队的 MutationRecord 实例的数组。所有这些都可以用来获取对应的属性值,也可以用来修改相应的值。原创 2025-02-17 00:00:00 · 985 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter13-客户端检测
注意,强烈建议在使用这些 API 之前先检测它们是否存在,因为其中多数都不是强制性的,且很多浏览器没有支持。另外,本节介绍的特性有时候不一定可靠。使用能力检测而非用户代理检测的优点在于,伪造用户代理字符串很简单,而伪造能够欺骗能力检测的浏览器特性却很难。如果你的应用程序需要使用特定的浏览器能力,那么最好集中检测所有能力,而不是等到用的时候再重复检测。这种方式不要求事先知道特定浏览器的信息,只需检测自己关心的能力是否存在即可。能力检测最有效的场景是检测能力是否存在的同时,验证其是否能够展现出预期的行为。原创 2025-02-16 00:00:00 · 760 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter12-BOM
这个对象独特的地方在于,它既是 window 的属性,也是 document 的属性。这个对象中保存的纯粹是客户端能力信息,也就是浏览器窗口外面的客户端显示器的信息,比如像素宽度和像素高度。跟使用任何 window 对象一样,可以使用这个对象操纵新打开的窗口。在这些浏览器中,可以将新打开的标签页的 opener 属性设置为 null,表示新打开的标签页可以运行在独立的进程中。这个属性只在弹出窗口的最上层 window 对象(top)有定义,是指向调用 window.open()打开它的窗口或窗格的指针。原创 2025-02-15 00:00:00 · 942 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter11-期约与异步函数
期约实例的方法是连接外部同步代码与内部异步代码之间的桥梁。这些方法可以访问异步操作返回的数据,处理期约成功和失败的结果,连续对期约求值,或者添加只有期约进入终止状态时才会执行的代码。ECMAScript 6 新增了正式的 Promise(期约)引用类型,支持优雅地定义和组织异步逻辑。前者就是一个期约接一个期约地拼接,后者则是将多个期约组合为一个期约。ES6 期约实现是很可靠的,但它也有不足之处。比如,很多第三方期约库实现中具备而 ECMAScript规范却未涉及的两个特性:期约取消和进度追踪。原创 2025-02-14 00:00:00 · 805 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter10-函数
caller。原创 2025-02-13 00:00:00 · 1219 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter9-代理与反射
通过捕获 get、set 和 has 等操作,可以知道对象属性什么时候被访问、被查询。代理可以拦截反射 API 的操作,而这意味着完全可以创建一个代理,通过它去代理另一个代理。ECMAScript 6 新增的代理和反射为开发者提供了拦截并向基本操作嵌入额外行为的能力。代理的内部实现对外部代码是不可见的,因此要隐藏目标对象上的属性也轻而易举。使用代理可以在代码中实现一些有用的编程模式。捕获器参数和反射 API。函数与构造函数参数验证。代理捕获器与反射方法。数据绑定与可观察对象。原创 2025-02-12 00:00:00 · 651 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter8-对象、类与面向对象编程
读取属性的特性。原创 2025-02-11 00:00:00 · 745 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter7-迭代器与生成器
生成器基础。原创 2025-02-10 00:00:00 · 1035 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter6-集合引用类型
ECMAScript 6 新增的“弱映射”(WeakMap)是一种新的集合类型,为这门语言带来了增强的键/值对存储机制。WeakMap 中的“weak”(弱),描述的是 JavaScript 垃圾回收程序对待“弱映射”中键的方式。ECMAScript 6 新增的“弱集合”(WeakSet)是一种新的集合类型,为这门语言带来了集合数据结构。WeakSet 中的“weak”(弱),描述的是 JavaScript 垃圾回收程序对待“弱集合”中值的方式。“字节序”指的是计算系统维护的一种字节顺序的约定。原创 2025-02-09 00:00:00 · 740 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter5-基本引用类型
这个方法接收两个参数,第一个参数可以是一个 RegExp 对象或一个字符串(这个字符串不会转换为正则表达式),第二个参数可以是一个字符串或一个函数。两者的区别在于,indexOf()方法从字符串开头开始查找子字符串,而 lastIndexOf()方法从字符串末尾开始查找子字符串。字符串的 HTML 方法。match()方法接收一个参数,可以是一个正则表达式字符串,也可以是一个 RegExp 对象。replace()方法第二个参数是字符串的情况下,有几个特殊的字符序列,可以用来插入正则表达式操作的值。原创 2025-02-08 00:00:00 · 814 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter4-变量、作用域与内存
这意味着函数外的值会被复制到函数内部的参数中,就像从一个变量复制到另一个变量一样。如果是原始值,那么就跟原始值变量的复制一样,如果是引用值,那么就跟引用值变量的复制一样。正如 ECMA-262 所规定的,JavaScript 变量是松散类型的,而且变量不过就是特定时间点一个特定值的名称而已。原始值(primitive value)就是最简单的数据,引用值(reference value)则是由多个值构成的对象。原始值和引用值的定义方式很类似,都是创建一个变量,然后给它赋一个值。原创 2025-02-07 00:00:00 · 543 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter3-语言基础
其中,var 在 ECMAScript 的所有版本中都可以使用,而 const 和 let 只能在 ECMAScript 6 及更晚的版本中使用。严格模式是一种不同的 JavaScript 解析和执行模型,ECMAScript 3 的一些不规范写法在这种模式下会被处理,对于不安全的活动将抛出错误。ECMAScript 中的操作符是独特的,因为它们可用于各种值,包括字符串、数值、布尔值,甚至还有对象。ECMAScript 中的字符串是不可变的(immutable),意思是一旦创建,它们的值就不能变了。原创 2025-02-06 00:00:00 · 688 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter2-HTML 中的 JavaScript
这就为使用服务器端脚本语言动态生成 JavaScript 代码,或者在浏览器中将 JavaScript扩展语言(如TypeScript,或React的 JSX)转译为JavaScript提供了可能性。虽然可以直接在 HTML 文件中嵌入 JavaScript 代码,但通常认为最佳实践是尽可能将 JavaScript 代码放在外部文件中。这个属性表示脚本在执行的时候不会改变页面的结构。的方式有两种:通过它直接在网页中嵌入 JavaScript 代码,以及通过它在网页中包含外部 JavaScript 文件。原创 2025-02-05 00:00:00 · 1783 阅读 · 0 评论 -
【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter1-什么是 JavaScript
虽然 JavaScript 和 ECMAScript(发音为“ek-ma-script”) 基本上是同义词,但 JavaScript 远远不限于 ECMA-262 所定义的那样。没错,完整的 JavaScript 实现包含以下几个部分。核心(ECMAScript)文档对象模型(DOM)浏览器对象模型(BOM)文档对象模型(DOM,Document Object Model)是一个应用编程接口(API),用于在 HTML 中使用扩展的 XML。DOM 将整个页面抽象为一组分层节点。原创 2025-02-04 11:48:21 · 488 阅读 · 0 评论 -
【JS】Chapter15-高阶技巧
相同点:都可以改变函数内部的this指向.区别点:call 和 apply 会调用函数, 并且改变函数内部this指向.call 和 apply 传递的参数不一样, call 传递参数 aru1, aru2…形式,apply 必须数组形式[arg]bind 不会调用函数, 可以改变函数内部this指向.主要应用场景:call 调用函数并且可以传递参数apply 经常跟数组有关系. 比如借助于数学对象实现数组最大值最小值。原创 2023-11-22 23:00:00 · 660 阅读 · 0 评论 -
【JS】Chapter14-深入面向对象
面向过程就是分析出解决问题所需要的步骤,然后用函数把这些步骤一步一步实现,使用的时候再一个一个的依次调用就可以了。面向过程,就是按照我们分析好了的步骤,按照步骤解决问题。面向对象是把事务分解成为一个个对象,然后由对象之间分工与合作。面向对象是以对象功能来划分问题,而不是步骤。在面向对象程序开发思想中,每一个对象都是功能中心,具有明确分工。面向对象编程具有灵活、代码可复用、容易维护和开发的优点,更适合多人合作的大型软件项目。面向对象的特性:封装性继承性多态性。原创 2023-11-21 23:00:00 · 509 阅读 · 0 评论 -
【JS】Chapter13-构造函数&数据常用函数
推荐使用字面量方式声明对象,而不是 Object 构造函数。Object.keys 静态方法获取对象中所有属性(键)Object.values 静态方法获取对象中所有属性值。Object. assign 静态方法常用于对象拷贝。Object 是内置的构造函数,用于创建普通对象。原创 2023-11-20 23:00:00 · 665 阅读 · 0 评论 -
【JS】Chapter12-作用域&解构&箭头函数
垃圾回收机制(Garbage Collection) 简称 GCJS中内存的分配和回收都是自动完成的,内存在不使用的时候会被垃圾回收器自动回收。正因为垃圾回收器的存在,许多人认为JS不用太关心内存管理的问题但如果不了解JS的内存管理机制,我们同样非常容易成内存泄漏(内存无法被回收)的情况不再用到的内存,没有及时释放,就叫做内存泄漏。原创 2023-11-10 23:00:00 · 379 阅读 · 0 评论 -
【JS】Chapter11-正则&阶段案例
正则表达式(Regular Expression)是用于匹配字符串中字符组合的模式。在 JavaScript 中,正则表达式也是对象。通常用来查找、替换那些符合正则表达式的文本。正则表达式在 JavaScript 中的使用场景:例如验证表单:用户名表单只能输入英文字母、数字或者下划线,昵称输入框中可以输入中文(匹配)比如用户名要求用户小写英文字母,数字,下划线或者短横线组成,并且用户名长度为 3~16位:过滤掉页面内容中的一些敏感词(替换),或从字符串中获取我们想要的特定部分(提取)等。原创 2023-11-09 23:00:00 · 1153 阅读 · 0 评论 -
【JS】Chapter10-Bom 操作
为了满足各种各样的需求,会经常性在本地存储大量的数据,HTML5规范提出了相关解决方案。- 数据存储在用户浏览器中- 设置、读取方便、甚至页面刷新不丢失数据- 容量较大,sessionStorage和localStorage约 5M 左右- 常见的使用场景:- https://todomvc.com/examples/vanilla-es6/ 页面刷新数据不丢失。原创 2023-11-08 23:00:00 · 317 阅读 · 0 评论 -
【JS】Chapter9-Dom 节点&移动端滑动
touch 对象代表一个触摸点。触摸点可能是一根手指,也可能是一根触摸笔。触屏事件可响应用户手指(或触控笔)对屏幕或者触控板操作。移动端也有自己独特的地方。比如触屏事件 touch(也称触摸事件),Android 和 IOS 都有。使用场景:如果计算倒计时效果,前面方法无法直接计算,需要借助于时间戳完成。原创 2023-11-07 23:00:00 · 268 阅读 · 0 评论 -
【JS】Chapter8-Dom 事件进阶
页面加载事件有哪两个?如何添加?load 事件监听整个页面资源给 window 加给 document 加无需等待样式表、图像等完全加。原创 2023-11-06 23:00:00 · 260 阅读 · 0 评论