javascript
文章平均质量分 60
javascript
coding苏
这个作者很懒,什么都没留下…
展开
-
Js中forEach map无法跳出循环问题以及forEach会不会修改原数组
for循环里要跳出整个循环是使用break,但在数组中用forEach循环或者map如要退出整个循环使用break会报错,使用return也不能跳出循环,原创 2022-07-06 17:26:19 · 1826 阅读 · 0 评论 -
js递归及其应用
递归的概念函数内部不断调用自身。递归函数的使用要注意函数终止条件避免死循环(一般都要写一个结束的条件); //在递归的过程中会出错// Maximum call stack size exceeded// 内存溢出:超过了最大的堆栈大小递归两个要素1.递归的边界——找到出口,在什么情况下跳出递归2.递归的逻辑——找到入口,什么情况下重复调用自己,调用自己做什么递归应用场景: 深拷贝 菜单树 遍历 DOM 树1.经典案例1 : 求和求 1-100 的和function sum(n)原创 2022-05-26 10:24:48 · 1438 阅读 · 2 评论 -
js中箭头函数和普通函数区别
一.箭头函数和普通函数箭头函数相当于匿名函数,并且简化了函数定义。箭头函数有两种格式,一种只包含一个表达式,连{ … }和return都省略掉了。还有一种可以包含多条语句,这时候就不能省略{ … }和return。let fun = () => { console.log('111');}function fun() { //普通函数 console.log('123');}二、箭头函数和普通函数的区别1. 箭头函数不能作为构造函数,而普通函数可以:箭头函原创 2022-05-25 12:03:01 · 4507 阅读 · 1 评论 -
js从数组中提取自己所需的数据
1.人员选择问题,2.配置化选择数据原创 2022-05-19 10:32:29 · 5490 阅读 · 0 评论 -
前端常见面试题
HTML和CSS部分1.对BFC规范(块级格式化上下文)的理解BFC 块级格式化上下文 一块独立的区域,有自己的规则,bfc中的元素与外界的元素互不影响BFC是一块用来独立的布局环境,保护其中内部元素不受外部影响,也不影响外部。怎么触发BFCfloat的值left或rightoverflow的值不为visible(默认)display的值为inline-block、table-cell、table-captionposition的值为absolute(绝对定位)或fixed原创 2022-03-06 22:36:46 · 534 阅读 · 0 评论 -
ES6常见用法
ES6, 全称 ECMAScript 6.0.一.var、let、const之间的区别let 用来声明变量,类似于变量,但是所声明的变量,只在let命令所在的代码块内有效需要注意的地方:1.不存在变量提升,未声明直接报错2.暂时性死区3.for循环具有两个作用域,外面的变量和里面的变量互不干扰const 用来声明一个只读的常量,一旦声明,常量的值就不可以改变了,而且声明的时候必须赋值var声明变量可以重复声明,而let不可以重复声明var是不受限于块级的,而let是受限于块级var会与w原创 2022-03-06 10:48:32 · 663 阅读 · 0 评论 -
前端性能优化(重点)
1.减少重绘重排:用 JavaScript 修改样式时,最好不要直接写样式,而是替换 class 来改变样式。如果要对 DOM 元素执行一系列操作,可以将 DOM 元素脱离文档流,修改完成后,再将它带回文档。推荐使用隐藏元素(display:none)或文档碎片(DocumentFragement),都能很好的实现这个方案2.图片懒加载3.使用字体图标 iconfont 代替图片图标4.利用CDN5.减少 HTTP 请求6.使用服务端渲染7.防抖(debounce)/节流(throttle)原创 2022-02-28 15:50:31 · 2463 阅读 · 3 评论 -
Js数组常见用法及面试题
一.判断是否为数组1.1 instanceof操作符这个操作符是检测对象的原型链是否指向构造函数的prototype对象的。var arr = [1,2,3];console.log(arr instanceof Array)1.2 ES6方法 Array.isArrayvar arr = [12,32,3];console.log(Array.isArray(arr));二.数组的去重2.1 使用ES6的Set高阶函数var arr = [1, 2, 3, 4, 3, 7, 7];原创 2022-02-24 18:06:15 · 1271 阅读 · 0 评论 -
在浏览器输入URL回车之后发生了什么?(面试题)
大致流程:1.URL 解析2.DNS查询3.TCP连接4.处理请求5.接受相应6.渲染页面原创 2022-02-23 17:20:45 · 585 阅读 · 0 评论 -
浏览器渲染页面的流程
一.浏览器渲染页面的原理及流程浏览器的核心部分是渲染引擎,也称为浏览器的内核,负责对网页语法(如HTML、CSS、JavaScript等)的解释并显示网页。Firefox使用Geoko——Mozilla自主研发的渲染引擎,Safari和Chrome使用webkit内核。webkit引擎渲染流程大概可以划分成以下几个步骤:(0)渲染引擎首先通过网络获得所请求文档的内容(1)解析HTML文件,构建 DOM Tree(2)解析CSS,构建 CSSOM Tree(CSS规则树)(3)将 DOM Tr原创 2022-02-23 16:15:29 · 10509 阅读 · 0 评论 -
cookie、session、localStorage 和 sessionStorage 区别及应用场景
1.概念理解Cookie它的主要用途有保存登录信息,比如你登录某个网站市场可以看到“记住密码”,这通常就是通过在 Cookie 中存入一段辨别用户身份的数据来实现的。localStorage 是 HTML5 标准中新加入的技术,localStorage的生命周期是永久性的。假若使用localStorage存储数据,即使关闭浏览器,也不会让数据消失,除非主动的去删除数据。sessionStorage 与 localStorage 的接口类似,相较cookie一般存储大一些的数据,但保存数据的生命周期与原创 2022-02-23 15:15:02 · 3535 阅读 · 0 评论 -
HTTP协议解释
一.HTTP协议简介1.1什么是通信通信,就是信息的传递和交换。通信三要素:通信的主体 – 通信的内容 – 通信的方式1.2 什么是通信协议客户端与服务器之间要实现网页内容的传输,则通信的双方必须遵守网页内容的传输协议网页内容又叫做超文本,因此网页内容的传输协议又叫做超文本传输协议(HyperText Transfer Protocol) ,简称 HTTP 协议。1.3 什么是通信协议......原创 2022-02-21 22:08:07 · 2356 阅读 · 0 评论 -
js防抖(debounce) 和 节流(throttling)
一.防抖(debounce)1.1 防抖策略(debounce)是当事件被触发后,延迟 n 秒后再执行回调,如果在这 n 秒内事件又被触发,则重新计时。1.2 防抖的应用场景用户在输入框中连续输入一串字符时,可以通过防抖策略,只在输入完后,才执行查询的请求,这样可以有效减少请求次数,节约请求资源;1.3实现输入框的防抖var timer = null // 1. 防抖动的 timer function debounceSearch(keywords) {原创 2022-02-21 17:14:17 · 1366 阅读 · 0 评论 -
什么是跨域及解决跨域都有哪些方法?
1.同源策略浏览器为了隔离潜在的恶意文件,使用同源策略,限制从一个源加载的文档或脚本和另一个源的资源进行交互(不同源之间的文档,资源的交互)同源是指“协议+端口+域名”三者相同所谓同源(即指在同一个域)就是两个页面的协议(protocol),主机(host)和端口号(port)”三者相同,注意:跨域限制访问,其实是浏览器的限制。2.什么是跨域当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域。.........原创 2022-02-21 10:56:13 · 3007 阅读 · 0 评论 -
call、apply和bind的区别及如何手写
三者的相同点:都是用来改变this的指向1.call()和apply()的区别:都是调用一个对象的一个方法,用另一个对象替换当前对象(功能相同)B.call(A, args1,args2);即A对象调用B对象的方法F.apply(G, arguments);即G对象应用F对象的方法相同点:第一个参数是this要指向的对象,当第一个参数为null、undefined时,默认指向window;不同点:apply()第二个参数是数组,call()是参数列表...原创 2022-02-18 15:01:34 · 409 阅读 · 0 评论 -
js三座大山原型原型链
1.原型eg class Student { constructor(name,score){ this.name = name; this.score =score; } introduce(){ console.log(`我是${this.name},分数${this.score}`) } } const student = new Student('张三',99) conso原创 2022-02-18 10:36:48 · 210 阅读 · 0 评论 -
js三座大山作用域闭包
1.什么是闭包能够读取其他函数内部变量的函数。2.js的作用域js的作用域分两种,全局和局部,基于我们所熟悉的作用域链相关知识,我们知道在js作用域环境中访问变量的权利是由内向外的,内部作用域可以获得当前作用域下的变量并且可以获得当前包含当前作用域的外层作用域下的变量,反之则不能,也就是说在外层作用域下无法获取内层作用域下的变量,同样在不同的函数作用域中也是不能相互访问彼此变量的;那么我们想在一个函数内部也有限权访问另一个函数内部的变量该怎么办呢?闭包就是用来解决这一需求的,闭包的本质就是在一个函数原创 2022-02-17 16:15:51 · 288 阅读 · 0 评论 -
前端同异步EventLoop及宏任务和微任务
1.EventLoop1.1 JavaScript 是单线程的语言1.2 同步任务和异步任务1.3 同步任务和异步任务的执行过程1.4 EventLoop 的基本概念1.5 结合 EventLoop 分析输出的顺序2.宏任务和微任务原创 2022-02-10 21:49:35 · 568 阅读 · 0 评论 -
Promise手写与async/await
1.回调地狱多层回调函数的相互嵌套,就形成了回调地狱。回调地狱的缺点:1.代码耦合性太强,牵一发而动全身,难以维护2.大量冗余的代码相互嵌套,代码的可读性变差如何解决回调地狱的问题:为了解决回调地狱的问题,ES6(ECMAScript 2015)中新增了 Promise 的概念。2.Promise 的基本概念.........原创 2022-02-10 21:39:58 · 496 阅读 · 0 评论 -
ES6模块化和CommonJS模块化
1.回顾:node.js 中如何实现模块化node.js 遵循了 CommonJS 的模块化规范。其中:导入其它模块使用 require() 方法模块对外共享成员使用 module.exports 对象模块化的好处:大家都遵守同样的模块化规范写代码,降低了沟通的成本,极大方便了各个模块之间的相互调用,利人利己。2.前端模块化规范的分类在 ES6 模块化规范诞生之前,JavaScript 社区已经尝试并提出了 AMD、CMD、CommonJS 等模块化规范。但是,这些由社区提出的模块化标准,还原创 2022-02-09 18:31:10 · 471 阅读 · 0 评论 -
ESLint使用
1.ESLint常见的语法规则2.ESLint配置原创 2022-01-28 11:19:17 · 870 阅读 · 0 评论 -
js中常见的报错
1.SyntaxError:语法错误2.Uncaught ReferenceError:引用错误原创 2022-01-08 18:06:27 · 447 阅读 · 0 评论 -
解析url参数为对象
解析url参数为对象,用于提取url数据 let url = 'http://www.runoob.com/jquery/misc-trim.html?channelid=12333&name=xiaoming&age=23' // 自己写的 function myUrl (ref){ var str = ref.split('?')[1] var arr = str.split('&') var obj = {};原创 2021-12-30 17:11:41 · 1150 阅读 · 0 评论 -
js数组的常用方法(经常要看)
不会改变原数组的方法:会改变原数组的方法:concatconcat()可以连接两个或多个数组,并将新的数组返回该方法不会对原数组产生影响 var arr = ["孙悟空","猪八戒","沙和尚"]; var arr2 = ["白骨精","玉兔精","蜘蛛精"]; var arr3 = ["二郎神","太上老君","玉皇大帝"]; var result = arr.concat(arr2); console.log(result); console.log(arr);...原创 2021-12-30 16:17:14 · 373 阅读 · 0 评论 -
js 数组及对象数组去重
一. 对象数组去重1.es6方法 new Map()function quChong() { let arr = [ { id: 1, name: '111' }, { id: 1, name: '111' }, { id: 2, name: '222' }, { id: 3, name: '333' }原创 2021-12-15 17:26:31 · 588 阅读 · 0 评论 -
JS大坑之17位(含)以后的Number类型数值精度丢失问题
1.JS大坑之17位(含)以后的Number类型数值精度丢失问题 console.log("1318855614830125158") console.log(Number("1318855614830125158")) console.log(parseInt("1318855614830125458")) console.log(String(1318855614830125358)) console.log(1318855614830125458)...原创 2021-12-15 17:21:04 · 1436 阅读 · 0 评论 -
js代码优化
1.避免多条件并列let status = 'process';let arr = ['process', 'wait', 'fail']if (arr.includes(status)) { console.log('避免多条件并列--2'); }原创 2021-12-15 17:08:50 · 316 阅读 · 0 评论