随笔分类 - JavaScript
摘要：防抖节流 一、演示卡顿现象 正常：事件触发非常频繁，而且每一次的触发，回调函数都要去执行（如果时间很短，而且回调内部有计算，那么很有可能出现浏览器卡顿） 二、防抖 在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时。(你触发完事件 n 秒内不再触发事件，我才执行) /** * 防抖 正
阅读全文
摘要：1、数组去重 //普通方法 function uniqueArr(arr){ let result=arr.filter((item,index,arrs)=>{ return arrs.indexOf(item)==index }) return result; } function unique
阅读全文
摘要：内存泄露 一、4种常见的内存泄露 浏览器垃圾回收机制，但并不是说我们就可以完全不用关心垃圾回收这块了，我们的代码中依然要主动避免一些不利于引擎做垃圾回收操作，因为不是所有无用对象内存都可以被回收的，那当不再用到的内存，没有及时回收时，我们叫它 内存泄漏 1.1.意外的全局变量 未声明的变量-wind
阅读全文
摘要：闭包 一、变量的作用域 函数内部可以直接读取全局变量 function f1(){ console.log(n); } var n=999; f1(); // 999 在函数外部无法读取函数内的局部变量 function f1(){ var n=999; } console.log(n); // e
阅读全文
摘要：解决JavaScript数字精度丢失问题的方法 一、JS数字精度丢失的一些典型问题 1. 大整数运算 9999999999999999==10000000000000001 //true 2. 两个简单的浮点数相加 0.1 + 0.2 != 0.3//false ///相减、相乘 0.18-1 //
阅读全文
摘要：call()、apply()、bind() var name='HJJ'; var obj = { name:"HHH", age:18, myFun:function(){ console.log(this) console.log(this.name+'年龄'+this.age); } } ob
阅读全文
摘要：requestAnimationFrame 帧动画 1、与 setTimeout、setInterval的优势主要有两点： 每一帧中的所有DOM操作集中起来，在一次重绘或回流中就完成，并且重绘或回流的时间间隔紧紧跟随浏览器的刷新频率，一般来说，这个频率为每秒60帧。 在隐藏或不可见的元素中，requ
阅读全文
摘要：封装-时间 一、创建多个倒计时 封装 /** * 倒计时,支持多个倒计时的创建 */ export class Timer { constructor(initObj) { initObj = initObj || {}; this.intervalTimer = initObj.intervalT
阅读全文
摘要：监听鼠标滚轮滚动事件 IE/Opera/Chrome 滚轮事件：onmousewheel（firefox不支持） 值：e.wheelDelta， e.wheelDelta>0，向上滚，150 e.wheelDelta<0，向下滚，-150 火狐 滚轮事件：DOMMouseScroll（仅firefo
阅读全文
摘要：json 是一种用于数据交换的文本格式 键值对的方式，属性必须加双引号。 JSON.parse(string) ：接受一个 JSON 字符串并将其转换成一个JS对象。 JSON.stringify(obj) ：接受一个 JavaScript 对象并将其转换为一个 JSON 字符串。 //对象==>J
阅读全文
摘要：解构赋值 左右两个边结构必须一样 //1、数组 let [a, b, c] = [1, 2, 3, 4] console.log(a, b, c)//1 2 3 let [a, ...b] = [1, 2, 3]; console.log(a, b)//a=>1,b=[2,3] //2、对象 let
阅读全文
摘要：es6 对象 一、对象字面量 更简洁的写法 属性名表达式：允许用表达式作为属性名，但是一定要将表达式放在方括号[]内 const age = 12; const name = "Amy"; const person = { age, name, sayHi(){ }, ["he"+"llo"](){
阅读全文
摘要：js面向对象 一、概念 什么是对象： 现实生活中：万物皆对象，对象是一个具体的事物，一个具体的事物就会有行为和特征。 JS中的对象：键值对，带有属性和方法的特殊数据类型。 编程思想： 面向过程：所有的事情都是亲力亲为，注重的是过程 面向对象：提出需求,找对象，对象解决，注重的是结果 面向对象的特性：
阅读全文
摘要：一、分支结构 1.1.switch语句 基本语法: switch (expression) { case 常量1: 语句; break; … case 常量n: 语句; break; default: 语句; break; } 注： break：可以省略，如果省略，代码会继续执行下一个case。 d
阅读全文
摘要：['1', '2', '3'].map(parseInt) what & why ? 早在 2013年, 有人在微博上发布了以下代码段: ['10','10','10','10','10'].map(parseInt); // [10, NaN, 2, 3, 4] parseInt parseInt
阅读全文
摘要：前端模块化 一、为什么要使用模块化 简单写js代码带来的问题 全局变量同名问题，使用匿名函数可解决变量同名问题，但是闭包又引起代码不可复用问题 匿名函数引起代码不可复用问题 (function(){ var flag=true })() console.log(flag);//报错 //flag是个
阅读全文
摘要：Symbol 基本使用 ES6 数据类型除了 Number 、 String 、 Boolean 、 Object、 null 和 undefined ，还新增了 Symbol 表示独一无二的值，最大的用法是用来定义对象的唯一属性名。 //调用Symbol()函数来创建一个Symbol实例： let
阅读全文
摘要：深拷贝和浅拷贝 值类型的拷贝的是拷贝值的副本，都互不影响。 深拷贝和浅拷贝是针对引用类型（如数组、对象）的拷贝。 一、浅拷贝 引用类型拷贝的是“引用“（即指针），之后一方改变都会影响到到另一方。 两种情况 情况一：直接赋值，直接拷贝源的是对象（数组）的引用，相互影响。 情况二：不是直接赋值（拷贝源对
阅读全文
摘要：一、Set集合 一种新的数据结构 , 类似于数组。但成员是唯一的无序，没有重复的值 let arr = [1, 3,4, 2, 2, 1, 1] let set=new Set(arr)// Set(4) {1, 3, 4, 2} 1.1.基本操作 遍历操作 let s1 = new Set([1,
阅读全文
