javascript
文章平均质量分 61
mn_front
这个作者很懒,什么都没留下…
展开
-
数组的reduce方法
打印结果可以看到, reduce 就是对 arr 从左到右进行累加求和, 如果没有传入函数迭代的初始值, 初始值默认是数组第一位 , prev 就是计算结束后的返回值。除了平时我们可以用它去求一个数组的和,又或者是乘积,我们还可以拿他去做很多很多的事情,比如 计算数组中每个元素出现的次数,数组去重,扁平数组等等。打印结果可以看到,我们传入函数迭代的初始值之后,也就是让 prev 从10开始累加,然后接着迭代累加 prev。要执行的函数,要执行的函数中也可以传入参数,如下。arr:被遍历的数组。转载 2022-09-09 16:37:20 · 250 阅读 · 0 评论 -
getBoundingClientRect() 与 offset
offset 的方向值需要考虑到父级,如果父级是定位元素,那么子元素的offset值相对于父元素,如果父元素不是定位元素,那么子元素的offset值相对于 可视区窗口。原文链接:https://blog.csdn.net/itSeven7/article/details/78855223。Element.getBoundingClientRect()方法返回元素的大小及其相对于视口的位置。right 方向的值是基于 元素右侧边框到可视区左边的距离。bottom方向的值是基于 元素底部到可视区顶部的距离。..转载 2022-08-11 13:49:19 · 439 阅读 · 0 评论 -
e.preventDefault()与e.stopPropagation()的区别
e.stopPropagation()阻止事件冒泡<table border='1'> <tr> <td><span>冒泡事件测试</span></td> <td><span>冒泡事件测试2</span></td> </tr></table>我们先看这段js代码:<script> $('ta...转载 2021-05-21 17:28:26 · 862 阅读 · 0 评论 -
typeof与instanceof区别
typeof用于判断数据类型,返回值为6个字符串,分别为string、Boolean、number、function、object、undefined。 var a = [34,4,3,54], b = 34, c = 'adsfas', d = function(){console.log('我是函数')}, e = true, f = null, g; console.lo.转载 2021-05-19 17:09:01 · 3838 阅读 · 0 评论 -
搞清clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop
转载自:https://www.imooc.com/article/17571网页可见区域高:document.body.clientHeight网页正文全文高:document.body.scrollHeight网页可见区域高(包括边线的高):document.body.offsetHeight网页被卷去的高:document.body.scrollTop屏幕分辨率高:window.screen.height每个HTML元素都具有clientHeight offsetHei..转载 2021-03-24 11:26:55 · 142 阅读 · 0 评论 -
扩展运算符和解构赋值总结
扩展运算符扩展运算符用三个点号表示,功能是把数组或类数组对象展开成一系列用逗号隔开的值var foo = function(a, b, c) { console.log(a); console.log(b); console.log(c);}var arr = [1, 2, 3];//传统写法foo(arr[0], arr[1], arr[2]);//使用扩展运算符foo(...arr);//1//2//3特殊应用场景://数组深拷贝转载 2020-12-31 14:10:03 · 222 阅读 · 0 评论 -
ES6的扩展运算符 [...arr]
ES6的扩展运算符可以说是非常使用的,在给多参数函数传参,替代Apply,合并数组,和解构配合进行赋值方面提供了很好的便利性。数组去重var arr = [1,2,3,4,5,2,3,1];var set =new Set(arr);var newArr = [...set ];最终得到的newArr就是一个去了重的数组扩展运算符就是三个点“...”,就是将实现了Iterator 接口的对象中的每个元素都一个个的迭代并取出来变成单独的被使用。看这个例子:? 1 .转载 2020-12-31 11:23:44 · 457 阅读 · 0 评论 -
JavaScript 中 call()、apply()、bind() 的用法
其实是一个很简单的东西,认真看十分钟就从一脸懵B 到完全 理解!先看明白下面:例 1obj.objAge; // 17obj.myFun() // 小张年龄 undefined例 2shows() // 盲僧 比较一下这两者 this 的差别,第一个打印里面的 this 指向 obj,第二个全局声明的 shows() 函数 this 是 window ;1,call()、apply()、bind() 都是用来重定义 this 这个对象的!如:ob转载 2020-12-30 17:51:13 · 62 阅读 · 0 评论 -
js数组对象过滤——filter,find,some,every
1、filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。 原数组不变 不会对空数组进行检测let arr1 = [1,2,3,4]let arr2 = arr1.filter(item=>item===1)console.log(arr1, 'arr1') // [1,2,3,4] arr1console.log(arr2, 'arr2') // [1] arr2 let arr3 = [{ id:1,...转载 2020-11-03 09:59:09 · 528 阅读 · 0 评论 -
什么是闭包?
看了阮一峰的文章通俗易懂:http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现。下面就是我的学习笔记,对于Javascript初学者应该是很有用的。一、变量的作用域要理解闭包,首先必须理解Javas...转载 2020-04-21 11:13:48 · 246 阅读 · 1 评论 -
JS中的call()方法和apply()方法用法总结
最近又遇到了JacvaScript中的call()方法和apply()方法,而在某些时候这两个方法还确实是十分重要的,那么就让我总结这两个方法的使用和区别吧。每个函数都包含两个非继承而来的方法:call()方法和apply()方法。相同点:这两个方法的作用是一样的。都是在特定的作用域中调用函数,等于设置函数体内this对象的值,以扩充函数赖以运行的作用域。一般来说,this总是指向调用...转载 2020-04-13 15:52:30 · 129 阅读 · 0 评论 -
漫谈promise使用场景
深入理解promise对于现在的前端同学来说你不同promise你都不好意思出门了。对于前端同学来说promise已经成为了我们的必备技能。那么,下面我们就来说一说promise是什么,它能帮助我们解决什么问题,我们应该如何使用它?这是我个人对promise的理解。欢迎吐槽 :)Promise是什么promise的意思是承诺,有的人翻译为许愿,但它们代表的都是未实现的东西,等待我们接下来...转载 2020-04-09 17:43:34 · 266 阅读 · 0 评论 -
forEach、for、$.each()跳出循环比较
1、for 循环先上例子,思考输出结果,体会 break 与 continue 的不同。按 Ctrl+C 复制代码var arr = [1,2,3,4,5,6]var arrySpecial = new Array();for (var i = 0; i < arr.length; i++){ if(arr[i]%2==0) { ...转载 2020-04-08 16:36:15 · 168 阅读 · 0 评论 -
获取文件大小、字节转换
// 获取文件大小function fileSelected() { var addimg=$("#fileToUpload").prop("files"); var fileSize=0; var maxSize=5242880; var ToSize=bytesToSize(maxSize); for(var i=0; i原创 2017-08-10 10:10:39 · 1540 阅读 · 0 评论 -
跨域资源共享 CORS 详解
CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resource sharing)。它允许浏览器向跨源服务器,发出XMLHttpRequest请求,从而克服了AJAX只能同源使用的限制。本文详细介绍CORS的内部机制。(图片说明:摄于阿联酋艾因(Al Ain)的绿洲公园)一、简介CORS需要浏览器和服务器同时支持。目前,所转载 2017-06-27 14:49:47 · 339 阅读 · 0 评论 -
日期转换
Date.prototype.format =function(format){var o = {"M+" : this.getMonth()+1, //month"d+" : this.getDate(), //day"h+" : this.getHours(), //hour"m+" : this.getMinutes(), //minute"s+" : this.转载 2017-04-17 18:08:59 · 248 阅读 · 0 评论 -
Javascript:history.go()和history…
;" />简单的说就是:go(-1): 返回上一页,原页面表单中的内容会丢失;back():返回上一页,原页表表单中的内容会保留。 history.go(-1):后退+刷新 history.back():后退 之所以注意到这个区别,是因为不同的浏览器的后退行为也是有区别的,而区别就跟;" />chrome和ff浏览器后退页面,会刷新后退的页面,若有数据请原创 2017-03-18 16:33:13 · 501 阅读 · 0 评论