![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
js
文章平均质量分 53
平平无奇小码农qwq
这个作者很懒,什么都没留下…
展开
-
格式化数字金额,每三位加逗号
格式化金额,例如把数字 98765432 格式化为:¥987,654.32。¥符号可以换成别的,也可以去掉。原创 2024-06-13 11:33:49 · 248 阅读 · 0 评论 -
js之多维数组扁平化
目录1、flat()2、reduce()1、flat()Array的prototype上有个flat方法,flat() 方法会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。不会改变原数组可以指定要提取嵌套数组的结构深度,默认值为 1(使用 Infinity,可展开任意深度的嵌套数组)flat() 方法会移除数组中的空项示例:var arr = [1, 2, 3, [4, 5], [6, 7]];arr.flat(); // [1, 2, 3原创 2022-05-25 16:49:43 · 398 阅读 · 0 评论 -
js var a = {n:1} var b = a a.x = a = {n:2} console.log(a.x) console.log(b.x)
js中很经典的一道题,特此记录一下var a = {n:1}var b = aa.x = a = {n:2}console.log(a.x)console.log(b.x)输出结果为: undefined, {n: 2}为什么呢?接下来我们来分析一下。1、首先我们要知道,b = a 是浅拷贝,所以在堆栈中引用的是一个对象地址,b和a指向同一个对象:2、赋值操作是从右向左进行 var a = 1, b = 2, c = 3; a = b = c;最后的a,b,c都是3。那么 a原创 2022-03-07 16:06:47 · 1331 阅读 · 0 评论 -
js之for...of...循环遍历可迭代对象
不会吧不会吧,我不会是最后一个知道for of不能遍历普通对象的叭接下来咱们就好好扒一扒这个 for of循环:for…of 语句在可迭代对象(包括 Array,Map,Set,String,TypedArray,arguments 对象等等)上创建一个迭代循环,调用自定义迭代钩子,并为每个不同属性的值执行语句。(来自MDN解释)。我们最常见的就是用for of 去遍历数组:let arr = ['tom', 'jerry']for(item of arr) { console.log(原创 2021-12-08 15:31:11 · 1347 阅读 · 0 评论 -
js 格式化日期 yyyy-MM-dd等其他多种格式
前端开发的时候,我们总会对日期进行格式化,变成我们所需要的格式,下面封装了一个方法,直接拿来用就行,不管你想要什么样的格式,都是适合的。具体看示例/** * 格式化函数 , 给日期格式化 * date为 new Date()对象, fmt为 'yyyy-MM-dd hh:mm:ss'的格式 */function formatDate(date, fmt) { //获取年份 if (/(y+)/.test(fmt)) { // 把数字变成字符串 let dateY = dat原创 2021-12-08 13:42:09 · 12510 阅读 · 2 评论 -
前端遍历文件对象
我们发现,打印的file是个对象,但是调用Object的三个方法,keys,getOwnPropertyNames,getOwnPropertySymbols发现结果都是空数组,原因是:我们再看用for...in...来遍历 file:而for…in…:所以我们可以得知,上述中我们所看到的对象file中的属性并不是他本身所有的属性,而是从原型上继承而来的。所以调用Object的方法结果会返回空数组。 如果调用for...of...方法:结果: 报错,说明file不是一...原创 2021-12-07 10:51:52 · 558 阅读 · 0 评论 -
js多个网络请求都完成后再对数据进行处理
目录前言1、变量判断2、Promise.all()前言在开发中,我们可能碰到这样的需求,必须等多个网络请求都请求完毕以后,再对他们的返回数据进行处理,这个时候我们应该怎么做呢?1、变量判断let isResult1 = false;let isResult1 = false;// 请求一$ajax({ url: '', success() { isResult1 = true; handleResult(); }})// 请求二$ajax({ url: '',原创 2021-12-04 21:44:54 · 3834 阅读 · 0 评论 -
ES6 Promise
目录1、Promise介绍1.1 什么情况下会用到Promise2、resolve是成功时调用,reject是失败时调用2.1 另一种方式(写法)3、Promise简写方式4、Promise.all()1、Promise介绍Promise 是异步编程的一种解决方案,接下来我会用延迟函数来模拟网络请求(异步操作)。Promise是个对象,我们用他的时候是要new的,在new这个Promise的时候是要求传入参数的:new Promise(参数)而这个参数本身又是一个函数。也就是说,这个Promi原创 2021-12-04 21:44:28 · 577 阅读 · 0 评论 -
js中call方法的原理
内部实现:Function.prototype.myCall = function(param) { // 这个this就是调用myCall函数的,在这里是fun函数 if(typeof this !== 'function'){ return new TypeError('Not a Function'); } param = param || window; param.fn = this; // arguments是类数组,用Array.from()转一下 let arg原创 2021-09-14 19:31:59 · 205 阅读 · 0 评论 -
js之new一个函数时发生了什么
new一个函数时发生了什么var myNew = function (fn) { // 1、新建一个空对象 let obj = {}; // 2、实例对象的__proto__等于构造函数的prototype obj.__proto__ = fn.prototype; // 3、改变this指向,指向obj let arg = Array.from(arguments).slice(1); // result是fn的返回值 let result = fn.apply(ob原创 2021-09-27 19:11:24 · 376 阅读 · 0 评论 -
js之立即执行函数
首先我们知道,函数定义有两种常见的方式,函数声明和函数表达式。// 函数声明function fun() { console.log(123);}// 函数表达式var f = function() { console.log(456);}函数声明可以进行函数提升,函数表达式不可以。接下来说一下立即调用的事。看以下代码:// 代码一:function fun() { console.log(123);}fun();// 代码二:var a = function() {原创 2021-09-27 17:11:51 · 210 阅读 · 0 评论 -
JS判断数据类型的几种方法
目录typeofQ:为什么typeof null 值为 object?instanceofinstanceof 原理constructorObject.prototype.toString.call()typeof缺点: 无法区分 null 还是 object,因为 typeof null 的值为 objecttypeof undefined // 'undefined'typeof '10' // 'string'typeof 10 // 'number'typeof false // 'bo原创 2021-09-23 15:55:03 · 133 阅读 · 0 评论 -
es6 类
constructor 关键字用于在类定义块内部创建类的构造函数。方法名constructor 会告诉解释器在使用new 操作符创建类的新实例时,应该调用这个函数。构造函数的定义不是必需的,不定义构造函数相当于将构造函数定义为空函数。使用new 调用类的构造函数会执行如下操作。(1) 在内存中创建一个新对象。(2) 这个新对象内部的[[Prototype]]指针被赋值为构造函数的prototype 属性。(3) 构造函数内部的this 被赋值为这个新对象(即this 指向新对象)。(4) 执行原创 2021-08-17 17:57:16 · 149 阅读 · 0 评论 -
js判断一个字符串在另一个字符串中出现的次数
字符串 str = ‘aaadtbbbdtcccdt’,字符串 str2 = ‘dt’判断字符串 str2在字符串 str中出现的次数1、分割 splitlet str = 'aaadtbbbdtcccdt';let str2 = 'dt';str.split(str2).length -1; // 32、利用正则表达式 matchlet str = 'aaadtbbbdtcccdt';str.match(/dt/g).length; // 3...原创 2021-07-22 12:00:49 · 1189 阅读 · 0 评论 -
js Date获取当前日期的具体时间
前言关于Date日期的一篇笔记1.如果就是普通的获取当前时间就普通的new Date() 就好。new Date(); // Wed Jan 13 2021 14:11:47 GMT+0800 (中国标准时间)2.指定具体日期2021年1月13日new Date(2021, 0, 13) // Wed Jan 13 2021 00:00:00 GMT+0800 (中国标准时间)注意: 这里的1月要传入0, 月份从0开始算起。0代表1月,1代表2月…以此类推3.指定具体日期的具体时原创 2021-01-13 14:27:02 · 1835 阅读 · 0 评论 -
普通函数与箭头函数的this指向问题
之前看了一个关于普通函数和箭头函数this指向的例子,感觉不太容易懂,就随笔记了下来// 普通函数var a = 11function test1() { this.a = 22 let b = function(){ console.log(this.a); } b()}var x = new test1() // 11// 箭头函数var b = 11function test2(){ this.b = 22 let c = ()=> { c原创 2020-07-17 17:58:49 · 436 阅读 · 0 评论 -
JS遍历数组的几种方法
JS遍历数组的几种方法1. forEachforEach函数接受的参数是个函数,函数里面有几个参数,第一个必选,是每一项的值。二三是可选,分别为下标和当前遍历的数组let arr = ["hello", "world", "!!!"];arr.forEach(function (item, index, arr) { console.log(item + "---" + index + "---" + arr);});/* * 输出: * hello---0---hello,world原创 2020-09-09 15:43:38 · 636 阅读 · 0 评论 -
原型与原型链
显式原型,隐式原型,原型链文章目录显式原型,隐式原型,原型链一、问题思考二、基础知识三、原型链四、原型链继承(对问题1的解答)一、问题思考首先看一个例子:function A() { }function B() { }var a = new A();a.__protp__ = B.prototype;这样写以后a是否可以调用B的属性和方法?答案是:不能。a不能调用B上的方法和属性,但可以调用B原型对象上的方法和属性function A(){ this.name = '我的名字是原创 2020-09-22 16:58:54 · 160 阅读 · 0 评论 -
分别用apply()和递归来求数组最大值
定义一个数组arr = [2, 4, 5, 8, 9, 4, 3, 1];求数组最大值1、 apply()实现Math.max.apply(null, arr); // 92、递归实现function max(n) { if(n == 0) { return arr[0]; } else if(max(n-1) > arr[n]) { return max(n-1) } else { return arr[n]; }}max(arr.length-1); // 9原创 2021-02-04 09:54:33 · 116 阅读 · 0 评论 -
详解call()和apply()方法
文章目录call和apply是什么1、apply、call示例2、apply实现求数组最大值原理call和apply是什么call 和 apply 在日常开发中经常用到,他们的作用都是改变this的指向,或者说是借用方法。形式:func.call(thisArg,param1,param2…)func.apply(thisArg,[param1,param2…])参数:thisArg(可选):func的this将指向thisArg;非严格模式下若thisArg指定为null或是undefin原创 2021-02-04 10:47:14 · 1061 阅读 · 1 评论 -
对数组中重复的值进行重命名
对数组中重复的值进行重命名把:arr = [ {name: '张三'}, {name: '李四'}, {name: '王五'}, {name: '张三'}, {name: '李四'}, {name: '张三'}, ]变成:arr = [ {name: '张三'}, {name: '李四'}, {name: '王五'}, {name: '张三1'}, {name: '李四1'}, {name: '张三2'}, ]function rename(ar原创 2021-03-09 09:22:45 · 756 阅读 · 0 评论 -
a标签链接及其默认行为
文章目录1、 href属性2、阻止a标签的默认行为2.1、href="javascript:void(0);"2.2、2.3、1、 href属性<a href=" ">我是a标签</a>href 包含超链接指向的 URL 或 URL 片段。URL 片段是哈希标记(#)前面的名称,哈希标记指定当前文档中的内部目标位置(HTML 元素的 ID)。URL 不限于基于 Web(HTTP)的文档,也可以使用浏览器支持的任何协议。例如,在大多数浏览器中正常工作的file:、ftp:和m原创 2021-03-18 11:46:46 · 2628 阅读 · 0 评论 -
自定义ctrl+鼠标滚轮事件
mousewheel事件<!-- html里我用的 angular写的,也可以直接在js中监听 mousewheel 方法 --><div class="thumbnail-content scroll-bar" (mousewheel)="mousewheel($event)" (DOMMouseScroll)="mousewheel($event)"></div>注意: 鼠标滚轮滚动事件 mousewheel()。但是火狐浏览器不兼容此方原创 2021-03-23 15:12:12 · 2928 阅读 · 0 评论 -
js浅拷贝与深拷贝
目录1、数据类型1.1 基本数据类型1.2 引用数据类型2、浅拷贝与深拷贝3、实现浅拷贝3.1 Array.prototype.concat() 方法3.2 Array.prototype.slice()方法3.3 Object.assign()方法1、数据类型1.1 基本数据类型特点:直接存储在栈(stack)中的数据var a = 1;b = a; // 栈内存会开辟一个新的内存空间,此时b和a都是相互独立的b = 2;console.log(a); // 1此时b和a是相互独立的,原创 2021-03-29 10:08:23 · 105 阅读 · 0 评论 -
正则表达式之贪婪匹配和懒惰匹配
例子:匹配 HTML 标签贪婪匹配: <.+>懒惰匹配: <.+?>我们发现第二种 懒惰匹配才是我们想要的结果字符" ? " : 如果紧跟在任何量词 *、 +、? 或 {} 的后面,将会使量词变为非贪婪(懒惰匹配,匹配尽量少的字符),和缺省使用的贪婪模式(匹配尽可能多的字符)正好相反。例如,对 “123abc” 使用 /\d+/ 将会匹配 “123”,而使用 /\d+?/ 则只会匹配到 “1”。分析匹配 HTML 标签的例子:贪婪匹配:<.+> 表示匹配原创 2021-04-19 11:01:03 · 3970 阅读 · 0 评论 -
箭头函数的this指向问题
首先看一个例子:const obj = { aaa() setTimeout(function () { console.log(this); }, 0); setTimeout(() => { console.log(this); }, 0); },};obj.aaa();结果:第一个setTimeout函数里面写的普通函数打印的this指向的是window,第二个setTimeout里面写的箭头函数指向的是obj,这原创 2021-04-27 21:09:48 · 370 阅读 · 0 评论 -
数组的sort()排序
目录1、 sort函数的基本用法2、sort函数接受一个函数作为参数3、数组中包含对象进行排序1、 sort函数的基本用法数组的sort方法,默认按照字母顺序升序排序,更准确地说是按照ASCII码顺序排序;let arr1 = ['b', 'g', 'a', 'd', 'c'];console.log(arr1.sort()); // ["a", "b", "c", "d", "g"]let arr2 = [5, 1, 8, 3];console.log(arr2.sort()); // [1原创 2021-06-21 15:50:40 · 6930 阅读 · 2 评论 -
JS预编译及全局对象GO和活动对象AO
全局预编译1、流程(1)查找变量声明,作为GO对象的属性名,值为undefined(2)查找函数声明,作为GO对象的属性名,值为function变量声明:通过var关键字声明变量var a; // 变量声明var a = 111; // 变量声明+变量赋值函数声明:通过function关键字声明函数function a() {} // 函数声明vat a = function() {} // 函数表达式,不是函数声明看一个例子:console.log(a);var a =原创 2021-06-25 15:15:30 · 411 阅读 · 0 评论 -
js之作用域与作用域链,闭包
作用域与作用域链概念1、域2、作用域链概念1、域在js中,作用域分为全局作用域与局部作用域全局作用域:由<script>标签产生的区域,从计算机的角度可以理解为window对象局部作用域:有函数产生的区域,从计算机的角度可以理解为该函数的AO对象注意:在ES6之前,只有函数可以产生作用域,是没有块级作用域这一说的2、作用域链在js中,函数存在一个内部隐式属性[[scopes]],这个属性用来保存当前函数在执行时的环境(上下文),由于在数据结构上是链式的,也被称为作用域链,原创 2021-07-01 11:25:43 · 367 阅读 · 0 评论 -
js闭包应用之防抖与节流
前言防抖和节流严格算起来应该属于性能优化的知识,但实际上遇到的频率相当高,处理不当或者放任不管就容易引起浏览器卡死。所以还是很有必要早点掌握的。(信我,你看完肯定就懂了)从滚动条监听的例子说起先说一个常见的功能,很多网站会提供这么一个按钮:用于返回顶部。这个按钮只会在滚动到距离顶部一定位置之后才出现,那么我们现在抽象出这个功能需求-- 监听浏览器滚动事件,返回当前滚条与顶部的距离这个需求很简单,直接写:function showTop () { var scrollTop = do转载 2021-07-01 11:59:44 · 299 阅读 · 0 评论