随笔分类 - JavaScript
JavaScript工作学习记录
摘要：要求：把数组arr=[12,34,[122,324],[222,[333]];扁平化 思路：创建一个新数组，循环原数组判断每一项是否是数组是的话先递归，在调用const或push方法，不是直接const或push。 方法一：使用数组的concat方法（concat可以传入数组或值，合并到一个新的数组
阅读全文
摘要：常用七种ES5继承方案和ES6的类继承共八种继承方法。 1、原型继承 把子类的原型指向要继承的父类 //父类 function ParentClass(name) { this.name = name } ParentClass.prototype.eatName = 'xx'; ParentCla
阅读全文
摘要：需求：用 JS 实现数字千分位格式化，每个三位添加一个逗号 方法一：利用字符串str.slice（-3）是取最后三位数字，并在前面添加‘，’号，再通过strNum.slice(0,str.length-3)(是取从字符串开始到后三位截止)来改变原字符串的位数，然后循环即可。 function for
阅读全文
摘要：最近项目有个需求根据后端提供的图片旋转角度在页面上显示正确方向的图片，(手机端拍摄的图片会带个角度，这个角度pc浏览器无法识别,图片就无法显示正确的图片方向,需要自己手动控制旋转)，要求宽度是固定的高度自适应并且保证图片不能变形，一开始采用的是img的形式,img旋转之后不但坐标会混乱处理着麻烦，而
阅读全文
摘要：函数是有Function构建出来的，它本身是内有bind函数的。我们不能影响原有的bind，需要重新在原型上定义一个bind 一、首先在Function.prototype写个custBind函数，它有二个参数，一个用来接收this,一个用rest参数来接收剩余所有的参数 Function.prot
阅读全文
摘要：javascript是按值类传递的，引用类型也是值传递，传递的就是当前变量的值。而引用类型变量的值，就是一个内存的地址。即，把这个内存地址，值传递给参数。如果直接复制给新的变量，那么新的变量和原变量还是引用一个地址，如果修改其中一个值另一个也会改变。为了不相互干扰一般都用深拷贝类解决这个问题。这里主
阅读全文
摘要：效果：鼠标在底部滑块上按下按住不松拖动可以移动滑块，上面大图里面带有小图背景的滑块也会跟随移动，移动到大图背景缺少区域即可完成验证。以上效果要实现，需要鼠标按下（mousedown事件），鼠标松开（mouseup事件），鼠标移动（mousemove事件）这几个事件。 先制作html部分实现静态效果，
阅读全文
摘要：原理：需要一个新的数组存储合并后的对象，因为原对象数组中存储的有相似的对象，新数组是存储对的是对原数组合并后的对象，索引它们的索引是对不上的，这里就需要一个新数组进行标记，对已经加入到新数组的对象进行标示，再用includes()和indexOf()等方法进行判断是否已经合并过了，没合并过的直接按照
阅读全文
摘要：要实现的效果：鼠标放到小图片上小图片上方会出现一个小块，这个小块里面的区域会放大显示到右边大图里面（如下图所示） 这个效果主要用到的是：鼠标的坐标e.clientX，e.clientY,偏移量offsetLeft，offsetTop,offsetWidth,sffsetHeight等属性。 HTML
阅读全文
摘要：js日历插件 实现思路：获取每个月的第一天是星期几，然后把前面的天数填充为空，在获取每个月有多少天，循环填充，判断并给给当前时间添加单独样式，点击上一月，和下一月时改变月份。 获取当前月第一天：返回值是 0（周日） 到 6（周六） 之间的一个整数 var date = new Date(); var
阅读全文
摘要：contentDocument 可以获得iframe子窗口的document对象,兼容ie8+ contentWindow 这是个只读属性，返回指定的iframe的窗口对象。 在iframe加载完毕之后通过contentDocument 或者 contentWindow 这二个对象来获取iframe
阅读全文
摘要：父页面调用子页面 获取父页面的ifram的id或calss之后可以通过contentWindow这个对象获取子页面的元素和方法.父页面调用子页面的元素和方法时,必须要等iframe加载完毕,或者在onload 方法里执行,不然是获取不到的! contentWindow 可取得子窗口的 window
阅读全文
摘要：数组的增删改操作 对数组的增删改操作进行总结,下面(一,二,三)是对数组的增加,修改,删除操作都会改变原来的数组. (一)增加 向末尾增加 push() 返回新增后的数组长度 arr[arr.length] 通过arr.length来向数组末尾增加 push方法 var arr=[11,12,13,
阅读全文
摘要：js在做加法运算时会隐式调用Number()方法 一:基本类型 字符串 把字符串转换为数字,只要字符串中包含任意一个非有效数字字符(第一个点除外)结果都是NaN,空字符串会变为数字零 console.log(Number("12.5")); //12.5 console.log(Number("12
阅读全文
摘要：分组引用 在正则里面类似于这种的"\1"是对前面分组的引用.在replace这类方法中引用前面正则中的分组就要用"$1"这种来引用("\1和$1"都是对第一个分组引用,第二个就是"\2,$2") ‘2019-08-25‘.match(/(\d{4})-(\d{2})-\2/) // null ‘20
阅读全文
摘要：History 对象包含用户（在浏览器窗口中）访问过的 URL。 浏览器在默认情况下会缓存input输入框的值，autocomplete="on" 默认有这个属性， 只有使用Ctrl+F5强制刷新，或者a标签重新跳转才可以清除缓存记录。 <input type="text" autocomplete
阅读全文
摘要：前端上传图片的原理是：运用input type=“file”的标签获取图片，再使用FileReader这个对象 new 一个实例，通过这个对象的readAsDataURL()方法读取file标签获取的图片并转换为base64格式，完成之后通过ajax之类的方式传到后台。 HTML 需要一个input
阅读全文
摘要：昨天学习群里有人遇到这样的问题，要取api/后面不是/v1的路径，这样的正则改怎么写。要解决这个问题就用到了正则中的负向前瞻。前瞻向后看后面的是否匹配，匹配的话就通过，负向前瞻就是看后面的是否不匹配，不匹配就通过，还有一个与之相反的向前看叫后顾。 正则表达式是从文本头部向尾部解析”。这就像在走路，没
阅读全文
摘要：isPrototypeOf 作用：检测一个对象是否是另一个对象的原型。或者说一个对象是否被包含在另一个对象的原型链中 instanceof 作用：检测一个对象是否是另一个对象的实例。 hasOwnProperty 作用：对象的hasOwnProperty()方法用来检测给定的属性是否是对象的自由属性
阅读全文
摘要：前端有时候会遇到JSON数据的缓存，后台给我们JSON数据是一个对象，直接缓存起来它存的是字符串 "[object Object]"。这是因为在缓存时会隐式调用toString方法来转为字符串，而JSON对象是普通对象用toString转换之后就变成了字符串"[object Object]",普通对
阅读全文
