08 2019 档案
摘要：什么是数据劫持 Object数据劫持实现原理 Array数据劫持的实现原理 Proxy、Reflect 一、什么是数据劫持 定义：访问或者修改对象的某个属性时，在访问和修改属性值时，除了执行基本的数据获取和修改操作以外，还基于数据的操作行为，以数据为基础去执行额外的操作。 当前最经典的数据劫持应用就
阅读全文
摘要：基本语法 继承 私有属性与方法、静态属性与方法 修饰器（Decorator） 一、基本语法 将ES6的class类示例用ES5语法实现： 1.1Class简单说明： Class声明的类本质上还是一个函数： 类虽然是函数，但是不能直接被调用执行，必须使用new指令执行构造行为： constructor
阅读全文
摘要：JavaScript基于原型的对象机制 JavaScript原型上的哪些事 一、JavaScript基于原型的对象机制 JavaScript对象是基于原型的面向对象机制。在一定程度上js基于原型的对象机制依然维持了类的基本特征：抽象、封装、继承、多态。面向类的设计模式：实例化、继承、多态，这些无法直
阅读全文
摘要：JavaScript对象语法、类型、属性 属性描述符（getOwnPropertyDescriptor()、defineProperty()） [[Get]]、[[Put]]、Getter、Setter 有必要了解Ojbect原型上的那些方法 一、JavaScript对象语法、类型、属性、方法 1.
阅读全文
摘要：什么是函数尾调用和尾递归 函数尾调用与尾递归的应用 一、什么是函数的尾调用和尾递归 函数尾调用就是指函数的最后一步是调用另一个函数。 调用最后一步和最后一行代码的区别，最后一步的代码并不一定会在最后一行，比如示例二。还有下面这一种不能叫做函数尾调用： 为什么这种情况不叫作函数的尾调用呢？原因很简单，
阅读全文
摘要：柯里化原理 如何实现柯里化 柯里化的应用 一、柯里化原理 柯里化：在数学和计算机科学中，柯里化是一种使用多个参数的一个函数转换成一系列使用一个参数的函数的技术。 前端使用柯里化的用途主要就应该是简化代码结构，提高系统的维护性，一个方法，只有一个参数，强制了功能的单一性，很自然就做到了功能内聚，降低耦
阅读全文
摘要：纯函数 一、纯函数 定义：纯函数是指不依赖并且不修改其作用域之外的函数。通过以下几个示例来认识纯函数： 给函数传入参数时，函数是通过自身的形参变量接收这个参数的值（栈内存），因为上面示例传入的是一个原始值类型的参数，所以函数不会依赖外部参数a。但是要注意的是如果函数执行时传入的是一个引用值类型的参数
阅读全文
摘要：箭头函数的基本用法与特点 函数与ES6新语法 一、箭头函数的基本用法与特点 声明箭头函数采用声明变量和常量的关键字：var、let、const 箭头函数的参数：没有参数用"()"空括号表示、一个参数可以不写括号、多个参数用"(a,b,c)"括号包裹 使用箭头“=>”连接参数与执行块"{}"。 如果执
阅读全文
摘要：简洁属性与简洁方法 计算属性名与[[prototype]] super对象（暂时保留解析） 模板字面量（模板字符串） 一、简洁属性与简洁方法 ES6中为了不断优化代码，减低代码的耦合度在语法上下了很大的功夫，上一篇博客解构就是其中一种，在对象属性和方法名称上也有所优化，也就是这篇博客要解析的简洁属性
阅读全文
摘要：数组解构 对象解构 声明与解构相关的问题 解构与重复赋值 按需解构 默认值赋值 解构参数 解构（destructuring）：结构化赋值 解构通常被看作ES6的一个结构化赋值方法，可以通过解构将数组元素或者对象属性拆分出来，成为单个变量。并且在命名相同的情况下可以实现名称复用，以达到减少代码量的目的
阅读全文
摘要：默认值 默认值表达式 需要注意的是，这种默认值和默认表达式在IE的最新版本中仍然没有得到兼容，只能通过编译转码的方式降级到ES5使用。 一、默认值 在函数声明时可以给形参赋默认值，当调用函数时不传入或者传入undefined的时候，函数会使用默认值进行计算。 示例： ES5编译结果： 二、默认值表达
阅读全文
摘要：let声明 const声明 块级作用域 spread/rest 一、let声明与块作用域 在ES6之前，JavaScript中的作用域基本单元就是function。现在有了let就可以创建任意块的声明，也被称为作用域块。这意味者只需要“{}”就可以创建一个作用域。不再像var声明变量那样总归属于包含
阅读全文
摘要：初步了解严格模式 一个用心良苦的语言模式设计 一、初步了解严格模式 ECMAScript 5的严格模式是采用具有限制性JavaScript变体的一种方式，从而使代码显示地“脱离马虎模式/稀松模式/懒散“模式。 为什么这么说呢？有时候忘记在作用域链上是否存在某个变量了，或者忘记在那一层作用域，但是当前
阅读全文
摘要：with的基本使用 尴尬的with关键字 一、with的基本使用 with是用来扩展语句作用域的，什么意思呢？先来看看语法和示例： 语法： expression：将给定的表达式添加到评估语句时使用的作用域上。 statement：任何语句。 示例： 描述： with语句可以形成作用域，并且将传入的对
阅读全文
摘要：ES6简介 Babel转码器 Nodejs中使用ES6 WebPack中使用ES6及Babel转码插件 一、ES6简介与转码 1.1一个常见的问题，ECMAScript和JavaScript到底是什么关系？ 1996年11月，JavaScript的创造者——Netscape公司，决定将JavaScr
阅读全文
摘要：初识websocket websocket的应用：构造函数、常量、属性、方法 websocket应用示例 一、初识websocket 1.1Websocket是一种网络协议，是在HTTP基础上做出一些优化的协议，与HTTP无直接关系。WebSocket是HTML5开始提供的一种在单个TCP连接上进行
阅读全文
摘要：fileReader的方法与事件 fileReade实现图片预加载 fileReade实现文件读取进度条 fileReade的与file.s实现文件切片读取 一、fileReader的方法与事件 1.方法 FileReader.abort()：终止读取操作。返回时，readyState属性为DONE
阅读全文
摘要：worker概述 worker基本使用 window下的postMessage worker多线程的应用 一、worker概述 web worker实际上是开启js异步执行的一种方式。在html5之前有事件、定时器、http请求三种异步机制，js本身并不能主动将一块代码使用异步的方式执行，worke
阅读全文
摘要：history hashchange与popstate 一、history history.back()：加载history列表中的前一个URL history.forward()：加载history列表中的下一个URL history.go(n)：加载history列表中的某一个具体页面 hist
阅读全文
摘要：关于客户端存储技术 storage 一、关于客户端(浏览器)存储技术 浏览器的存储技术第一个能想到的应该就是cookie，关于cookie本身出现的初衷是为了解决客户端识别，可存储信息量小（4k左右），并且每次网络请求都会被请求协议携带发送到服务器，这在一定程度上是比较浪费网络资源，损耗性能。 在H
阅读全文
摘要：定时器setInterval实现的匀速动画为什么不是匀速？ window.requestAnimationFrame() 一、定时器setInterval实现的匀速动画为什么不是匀速？ 以上提问并非通过计算时间戳来计算每帧运动，而是直接使用定时器按照既定的间隔时间叠加每次运动距离的方式，这里主要意在
阅读全文
摘要：SVG简介 SVG画线与矩形 SVG画圆、椭圆、折线 SVG画多边形和文本 SVG透明度与线条样式 SVG的Path标签 SVG线性渐变、放射性渐变 SVG高斯模糊 SVG虚线以及简单的动画 SVG的viewbox（比例尺） 一、SVG简介 SVG全称Scalable Vector Graphics
阅读全文
摘要：canvas简介 画线 画矩形 画圆 canvas与贝塞尔曲线 坐标平移旋转与缩放 canvas的save与restore 背景填充 线性渐变 辐射渐变（径向渐变） 阴影 渲染文字 线端样式 一、canvas简介 最早在apple的safari 1.3中引入，ie9之前的浏览器不支持canvas，相
阅读全文
