JavaScript高级核心
文章平均质量分 93
介绍JavaScript高级核心
爱吃牛肉的大老虎
学无止境,既要有深度又要有广度地学习
展开
-
Javascript之V8内存和垃圾回收讲解
V8是一款主流的JavaScript执行引擎V8采用即时编译(一般的JS引擎源代码- 字节码才会执行,而V8会直接翻译成机器码)V8内存设有上限的(64位 ≤ 1.5G;32位 ≤ 800M )原创 2023-03-26 13:53:33 · 878 阅读 · 1 评论 -
ES7-ES12知识点
文章目录1 ES2016(ES7)1.1 Array.prototype.includes()1.1.1 语法1.1.2 示例1.1.3 注意点1.2 幂运算符 **1.2.1 一般写法1.2.2 幂运算符 **1.2.3 注意点2 ES2017(ES8)2.1 Object.values()2.2 Object.entries()2.3 Object.getOwnPropertyDescriptors()2.4 String.prototype.padStart2.4.1 语法2.4.2 示例和场景2.5转载 2022-03-25 11:21:04 · 209 阅读 · 0 评论 -
JavaScript高级语法之异步Promise(1:入门)
文章目录1 callback hell(回调地狱)2 Promise函数2.1 创建一个Promise容器2.2 then方法2.3 then方法链式操作2.4 then方法链式操作的异常处理1 callback hell(回调地狱)层层嵌套回调函数,最直观的就是如下图所示,不利于代码的维护和美观,不过在回调中 可以确保代码的执行顺序:2 Promise函数为了解决上述代码带来问题,而在...原创 2019-10-20 10:34:17 · 454 阅读 · 2 评论 -
JavaScriptAPI之文件与二进制数据的操作
目录1 Blob对象1.1 Blob构造函数1.2 Blob对象的slice方法1.3 Blob对象的属性2 FileList对象3 File API3.1File对象的属性4 FileReader API5 综合实例:显示用户选取的本地图片6 URL对象ECMAScript 5引入了Blob对象,允许直接操作二进制数据。Blob对象是一个代表二进...原创 2019-05-11 16:53:26 · 683 阅读 · 0 评论 -
JavaScript浏览器对象之浏览器的通知接口(Notification API)
目录1 Notification API概述2 Notification对象的属性和方法2.1 Notification.permission2.2 Notification.requestPermission()3 Notification实例对象3.1 Notification构造函数3.2 实例对象的事件3.3 close方法1 Notification ...原创 2019-05-09 16:00:52 · 2881 阅读 · 7 评论 -
JavaScript浏览器对象之浏览器端数据库(IndexedDB)
目录1 浏览器端数据库概述1.1 IndexedDB具有以下特点1.1.1 键值对储存1.1.2 异步1.1.3 支持事务1.1.4 同域限制1.1.5 储存空间大1.1.6 支持二进制储存2 indexedDB.open方法3 indexedDB实例对象的方法3.1 createObjectStore方法3.2 objectStoreNames...原创 2019-05-09 13:59:22 · 3161 阅读 · 3 评论 -
JavaScript浏览器对象之history对象
目录1 history对象概述1.1 属性说明1.2 方法说明2 history.pushState(),history.replaceState()3 history.state属性4 popstate事件1 history对象概述浏览器窗口有一个history对象,用来保存浏览历史。比如,该窗口先后访问了三个地址,那么history对象就包括三项,len...原创 2019-05-06 18:21:45 · 2855 阅读 · 0 评论 -
JavaScript浏览器对象之浏览器端数据存储机制
1 数据存储机制概述这个API的作用是,使得网页可以在浏览器端储存数据。它分成两类:sessionStorage和localStorage。sessionStorage保存的数据用于浏览器的一次会话,当会话结束(通常是该窗口关闭),数据被清空;localStorage保存的数据长期存在,下一次访问该网站的时候,网页可以直接读取以前保存的数据。除了保存期限的长短不同,这两个对象的属性和方法完...转载 2019-05-09 11:38:11 · 496 阅读 · 0 评论 -
JavaScript浏览器对象之window对象详解
目录1 window对象概述2 window对象的属性2.1 window.name属性2.2 window.innerHeight属性,window.innerWidth属性2.3 window.pageXOffset属性,window.pageYOffset属性2.4 iframe元素2.5 Navigator对象2.5.1 Navigator.userAgen...原创 2019-05-06 18:04:20 · 8194 阅读 · 0 评论 -
JavaScript浏览器对象之定时器
目录1 setTimeout()2 setInterval()3 clearTimeout(),clearInterval()4 运行机制5 setTimeout(f,0)5.1 含义5.2 应用6 正常任务与微任务JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()和setInterval()这两个函数来完成。它...原创 2019-05-06 17:07:02 · 970 阅读 · 0 评论 -
JavaScript高级语法之异步(Fetch API)
目录1 Fetch API1.1 基本用法1.2 fetch()1.2.1 CORS机制下发出跨域请求1.2.2 发出POST请求1.3 Headers对象1.4 Request对象1.5 Response对象1.6 body属性1 Fetch API1.1 基本用法Ajax操作所用的XMLHttpRequest对象,已经有十多年的历史,它的API设...转载 2019-05-09 09:50:59 · 729 阅读 · 0 评论 -
JavaScript浏览器对象之精确度量、控制、增强性能(Performance API)
目录1 performance.timing对象2 performance.now()3 performance.mark()3.1clearMarks()4 performance.getEntries()5 performance.navigation对象5.1 performance.navigation.type5.2 performance.naviga...原创 2019-05-09 17:34:49 · 606 阅读 · 0 评论 -
JavaScriptAPI之Canvas API
目录1 Canvas概述2 绘图方法2.1 绘制路径2.2 绘制矩形2.3 绘制文本2.4 绘制圆形和扇形2.5 设置渐变色2.6 设置阴影3 图像处理方法3.1 drawImage方法3.2 getImageData方法,putImageData方法3.3 toDataURL方法3.4 save方法,restore方法4 动画5 ...原创 2019-05-10 13:54:05 · 1288 阅读 · 0 评论 -
JavaScriptAPI之SVG图像
目录1 插入SVG文件2 svg格式3 SVG文件的JavaScript操作3.1 获取SVG DOM3.2 读取svg源码3.3 将svg图像转为canvas图像4 实例SVG是“可缩放矢量图”(Scalable Vector Graphics)的缩写,是一种描述向量图形的XML格式的标记化语言。也就是说,SVG本质上是文本文件,格式采用XML,可以在浏览器中显示...原创 2019-05-11 16:07:07 · 944 阅读 · 0 评论 -
JavaScriptAPI之线程(web worker)
目录1 Web Worker概述1.1 新建和启动子线程1.2 子线程的事件监听1.3主线程的事件监听1.4 错误处理1.5 关闭子线程2 主线程与子线程的数据通信3 同页面的Web Worker4 Service Worker4.1 首先,需要向浏览器登记Service Worker4.2 安装和激活,主要通过事件来判断1 Web Worker概...转载 2019-05-11 17:21:39 · 449 阅读 · 0 评论 -
JavaScriptAPI之服务器发送事件(SSE)
目录1 服务器发送事件(SSE)概述2 客户端代码2.1 概述2.2 建立连接2.3 open事件2.4 message事件2.5 error事件2.6 自定义事件2.7 close方法3 数据格式3.1 概述3.2 data:数据栏3.3 id:数据标识符3.4 event栏:自定义信息类型3.5 retry:最大间隔时间4 服务器...转载 2019-05-11 17:35:11 · 2421 阅读 · 0 评论 -
JavaScriptAPI之网页是否可见(PageVisibility),全屏(requestFullscreen),语言(Speech)
目录1PageVisibility1.2 属性1.3 VisibilityChange事件2 全屏操作2.1 方法2.1.1 requestFullscreen()2.1.2 exitFullscreen()2.2 属性2.2.1 document.fullscreenElement2.2.2 document.fullscreenEnabled2.3...原创 2019-05-11 17:58:10 · 273 阅读 · 0 评论 -
JavaScriptAPI之定时循环接口(requestAnimationFrame)
目录1 requestAnimationFrame概述2 cancelAnimationFrame方法3 实例1 requestAnimationFrame概述requestAnimationFrame是浏览器用于定时循环操作的一个接口,类似于setTimeout,主要用途是按帧对网页进行重绘。设置这个API的目的是为了让各种网页动画效果(DOM动画、Canvas动画、SV...原创 2019-05-11 18:16:21 · 1675 阅读 · 0 评论 -
JavaScriptAPI之WebSocket协议
目录1 WebSocket协议概述2 客户端2.1 建立连接和断开连接2.2 发送数据和接收数据2.3 处理错误3 服务器端1 WebSocket协议概述HTTP协议是一种无状态协议,服务器端本身不具有识别客户端的能力,必须借助外部机制,比如session和cookie,才能与特定客户端保持对话。这多多少少带来一些不便,尤其在服务器端与客户端需要持续交换数据的场合(...转载 2019-05-11 18:29:29 · 1178 阅读 · 0 评论 -
JavaScriptAPI之网络实时通信(WebRTC)
目录1 网络实时通信概述2 getUserMedia2.1 概述2.2 范例:获取摄像头2.3 范例:捕获麦克风声音2.4 捕获的限定条件2.5 MediaStreamTrack.getSources()3 RTCPeerConnectionl,RTCDataChannel3.1 RTCPeerConnectionl3.2 RTCDataChannel3...转载 2019-05-11 18:52:17 · 2576 阅读 · 0 评论 -
JavaScriptAPI之模块(component)
目录1 模块(component)概述1.1 管理和使用非常容易1.2 定制非常容易1.3 组件是模块化编程思想的体现,非常有利于代码的重用1.4 代码隔离2 template标签2.1 基本用法2.2 document.importNode()3 CustomElement(自定义HTML元素)3.1 document.registerElement()...转载 2019-05-11 23:38:47 · 3283 阅读 · 0 评论 -
JavaScript核心之Document对象概述(document的属性,方法,事件)
目录1 document对象的属性1.1 readState状态可取值2 document对象的方法3 document对象的事件文档对象(document)代表浏览器窗口中的文档,该对象是window的子对象,由于window对象是dom对象模型中的默认对象,因此window对象中的方法和子对象不需要使用window来引用。1 document对象的属性属性 说...原创 2019-05-01 14:52:55 · 1506 阅读 · 0 评论 -
JavaScript浏览器对象之JavaScript引擎
目录1 JavaScript代码嵌入网页的方法1.1 直接添加代码块1.2 加载外部脚本1.3 行内代码2 script标签的工作原理2.1 defer属性2.2 async属性3 重流和重绘4 脚本的动态嵌入5 加载使用的协议6 JavaScript虚拟机7 单线程模型8 Event Loop9 任务队列浏览器的核心是两部分:渲染引擎和...原创 2019-05-06 15:18:40 · 680 阅读 · 0 评论 -
JavaScript高级语法之异步Promise(2:深入)
目录1 JavaScript的异步执行1.1 概述1.2 回调函数1.3 事件监听1.4 发布/订阅1.5 异步操作的流程控制1.6 串行执行1.7 并行执行1.8 并行与串行的结合2 Promise对象2.1 简介2.2 Promise接口2.2.1 Promise对象的生成2.2.2 then方法2.3 用法辨析3 Promise...原创 2019-05-04 20:28:38 · 514 阅读 · 0 评论 -
JavaScript浏览器对象之Console对象
目录1 浏览器实现2 console对象的方法2.1 log(),info(),debug()2.2 warn(),error()2.3 table()2.4 count()2.5 dir()2.6 assert()2.7 time(),timeEnd()2.8 timeline(),timelineEnd(),timeStamp()2.9 profil...原创 2019-05-04 15:16:23 · 1067 阅读 · 0 评论 -
JavaScript核心之变动观察器(Mutation Observer)
目录1 变动观察器(mutation observer)概述2 MutationObserver构造函数3 Mutation Observer实例的方法3.1 observe()3.2 disconnect(),takeRecords()3.3 MutationRecord对象4 应用示例4.1 子元素的变动4.2 属性的变动4.3 取代DOMContent...原创 2019-05-03 21:19:34 · 7564 阅读 · 0 评论 -
JavaScript核心之事件详解(表单,文档,自定义事件)
目录1 表单事件1.1 Input事件,select事件,change事件1.1.1 input事件1.1.2 select事件1.1.3 Change事件1.2 reset事件,submit事件1.2.1 reset事件1.2.2 submit事件2 文档事件2.1 beforeunload事件,unload事件,load事件,error事件,pagesh...原创 2019-05-03 15:05:58 · 463 阅读 · 0 评论 -
JavaScript核心之事件详解(鼠标,键盘,进度,拖拉)
目录1 鼠标事件1.1 事件种类1.1.1 click事件1.1.2 dblclick事件1.1.3 mouseup事件,mousedown事件1.1.4 mousemove事件1.1.5 mouseover事件,mouseenter事件1.1.6 mouseout事件,mouseleave事件1.1.7 contextmenu1.2 MouseEvent对...原创 2019-05-03 14:27:52 · 1573 阅读 · 2 评论 -
JavaScript核心之事件详解(EventTarget接口,js事件传播,Event对象)
目录1 EventTarget接口1.1 addEventListener()1.1.1 addEventListenerthis对象的指向1.2 removeEventListener()1.3 dispatchEvent()2 监听函数2.1 HTML标签的on-属性2.2 Element节点的事件属性2.3addEventListener方法3 事件...原创 2019-05-03 13:25:20 · 4220 阅读 · 0 评论 -
JavaScript核心之Element节点
目录1 Element节点概述2 属性2.1 attributes,id,tagName2.1.1 attributes2.1.2 id属性2.1.3 tagName属性2.2 innerHTML,outerHTML2.2.1 innerHTML2.2.2 outerHTML2.3 children,childElementCount,firstElemen...原创 2019-05-03 00:31:35 · 558 阅读 · 0 评论 -
JavaScript核心之Text节点和DocumentFragment节点
目录1 Text节点的概念1.1 Text构造函数1.2 Text节点的属性1.2.1 data属性1.2.2 wholeText1.2.3 length1.2.4 nextElementSibling1.2.5 previousElementSibling1.3 Text节点的方法1.3.1 appendData(),deleteData(),insert...原创 2019-05-02 23:46:39 · 452 阅读 · 0 评论 -
JavaScript核心之DOM概述
目录1DOM概念1.1 Document(文档)1.2 Object(对象)1.3 Model(模型)2 DOM分层以及图示2.1各个节点的介绍2.1.1 根节点2.1.2 父节点2.1.3 子节点2.1.4 兄弟节点2.1.5 后代2.1.6 叶子节点2.2 节点类型2.2.1 元素节点2.2.2 文本节点2.2.3 属性节点...原创 2019-05-02 23:22:23 · 552 阅读 · 0 评论 -
JavaScript高级语法之有限状态机
有限状态机的概述有限状态机(Finite-state machine)是一个非常有用的模型,可以模拟世界上大部分事物。简单说,它有三个特征:状态总数(state)是有限的。 任一时刻,只处在一种状态之中。 某种条件下,会从一种状态转变(transition)到另一种状态。它对JavaScript的意义在于,很多对象可以写成有限状态机。举例来说:网页上有一个菜单元素。鼠标点击,...原创 2019-05-04 20:41:56 · 1266 阅读 · 0 评论 -
JavaScript高级语法之严格模式
目录1 严格模式的概述1.1 针对整个脚本文件1.2 针对单个函数1.3 脚本文件的变通写法2 显式报错2.1 字符串的length属性不可写2.2 eval、arguments不可用作函数名2.3 只读属性不可写2.4 只设置了赋值器的属性不可写2.5 禁止扩展的对象不可扩展2.6 禁止删除不可删除的属性2.7 函数不能有重名的参数2.8 禁...原创 2019-05-04 21:03:12 · 348 阅读 · 0 评论 -
JavaScript核心之Document对象详解(document属性,方法)
目录1 Document节点概述2 document节点的属性2.1 doctype,documentElement,defaultView,body,head,activeElement2.1.1 doctype2.1.2 documentElement2.1.3 defaultView2.1.4 body2.1.5 head2.1.6 activeEleme...原创 2019-04-30 18:23:36 · 23164 阅读 · 4 评论 -
JavaScript核心之Cookie详解
目录1 cookie1.1 cookie概述1.1.1 cookie的工作原理1.1.2 cookie的工作流程1.2 cookie的属性1.2.1 HTTP-Only cookie1.3 cookie的限制1.4 Cookie的设置1.4.1 在浏览器中的设置1.4.2 在注册表中的设置1 cookie1.1 cookie概述cookie是服务...原创 2019-04-30 17:17:27 · 570 阅读 · 0 评论 -
JavaScript高级语法之异步(XMLHttpRequest)
目录1 XMLHttpRequest对象2 XMLHttpRequest实例的属性2.1 readyState2.2 onreadystatechange2.3 response2.4 responseType2.5 responseText2.6 responseXML2.7 status2.8 statusText2.9 timeout2.10 ...转载 2019-05-09 09:53:28 · 2560 阅读 · 0 评论 -
JavaScript高级语法之跨域(postMessage,CORS,JSONP)
目录1 postMessage概述1.1 iframe与主页面的通信2 CORS2.1 发送请求,“预检”机制2.2 收到响应3 JSONP1 postMessage概述所谓“同域限制”指的是,出于安全考虑,浏览器只允许脚本与同样协议、同样端口、同样域名的地址进行通信。比如,www1.example.com页面上面的脚本,只能与该域名(相同协议、相同端口)进行通信,...原创 2019-05-08 18:40:11 · 2795 阅读 · 0 评论 -
JavaScript高级语法之Form
目录1 FormData类型2 文件上传2.1 使用POST方法,将enctype属性设为application/x-www-form-urlencoded2.2 使用POST方法,将enctype属性设为text/plain。2.3 使用POST方法,将enctype属性设为multipart/form-data。2.4 使用GET方法,enctype属性将被忽略。...原创 2019-05-08 18:08:33 · 1613 阅读 · 0 评论 -
JavaScript核心之DOM中Node节点中的接口方法
目录1 NodeList接口,HTMLCollection接口1.1 NodeList接口1.2 HTMLCollection接口2 ParentNode接口,ChildNode接口2.1 ParentNode接口2.1.1 children2.1.2 firstElementChild2.1.3 lastElementChild2.1.4 childEleme...原创 2019-04-30 16:28:41 · 470 阅读 · 0 评论