首页
学习
活动
专区
圈层
工具
发布

JavaScript 常见面试题分析(三)

property 和 attribute 的区别 property修改对象属性,不会体现到 HTML 结构中;attribute修改 HTML 属性,会改变 HTML 结构,两者都有可能引起 DOM 重新渲染...每当引擎遇到一个函数调用,它会为该函数创建一个新的执行上下文并压入栈的顶部,因为不同的调用可能会有不同的参数 JS 引擎会执行那些执行上下文位于栈顶的函数,当该函数执行结束时,执行上下文从栈中弹出,控制流程到达当前栈中的下一个上下文...deepClone(obj[key]) : obj[key] } } return copy } JSON.parse(JSON.stringify(obj)) forEach() 和...map() 的区别 map()会分配内存空间存储新数组并返回,forEach()不会返回数据 forEach()允许callback更改原始数组的元素,map()返回新的数组 描述cookie localStorage...来修改,缺点:存储大小为 4 kb,HTTP 请求时需要发送到服务端,增加请求数据量 localStorage数据会永久存储,除非代码或手动删除;sessionStorage数据只存在于当前会话,浏览器关闭则清空

33920

分享 9 个实用的 JavaScript 技巧

在 React 中,此技巧通常用于在构建 UI 组件时从 props 接收多个值。 3. 浅复制对象或数组的几种方法 众所周知,JavaScript 中的对象和数组等非原始数据类型是通过引用传递的。...使用 JSON 技巧进行深度复制 要实现深度复制,一个流行的技巧是结合使用 JSON.stringify() 和 JSON.parse()。...: 使用 forEach() 方法 forEach 方法非常适合迭代数组的元素: const author = [ 'Y', 'a', 'n', 'g' ]; author.forEach((c)=>{...删除数组重复值的最快方法 ES6 为 JavaScrip 引入了一种新的数据结构——集合。集合是唯一的项目的集合。 由于集合的特性,它使得删除数组的重复值变得更加简单。...使用for循环一项一项地遍历项目并在此过程中对它们进行计数? 这是一个解决方案,但根本不是一个优雅的解决方案。

44930
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    给初学者:JavaScript 中数组操作注意点

    PS:你可能是想找for_of 不要用 JSON.parse(JSON.stringify()) 深拷贝数组 有人使用 JSON 中深拷贝对象或数组。...Date 对象转换为字符串 JSON 不支持对象类型,对于 JS 中 Date 对象的处理方式为转换为 ISO8601 格式的字符串。...如果你不用的返回值,那你就应当使用 补:forEach 与 break ES6 以前,遍历数组主要就是两种方法:手写循环用下标迭代,使用。...笔者个人是喜欢后者的:可以直接获取到迭代的下标和值,而且函数式风格(注意 FP 注重的是不可变数据结构,forEach 天生为副作用存在,所以只有 FP 的形而没有神)写起来爽快无比。但是!...不知各位同学注意过没有:forEach 一旦开始就停不下来了。。。 forEach 接受一个回调函数,你可以提前,相当于手写循环中的。但是你不能——因为回调函数中没有循环让你去: 解决方案还是有的。

    94160

    滴滴前端一面常考手写面试题整理_2023-03-01

    类数组转化为数组 类数组是具有length属性,但不具有数组原型上的方法。常见的类数组有arguments、DOM操作方法返回的结果。...后面的字符串取出来 const paramsArr = paramsStr.split('&'); // 将字符串以 & 分割后存到数组中 let paramsObj = {}; // 将...又过了 100ms,理论上又要往队列里推一个定时器代码,但由于此时 T2 还在队列中,所以 T3 不会被添加(T3 被跳过),结果就是此时被跳过;这里我们可以看到,T1 定时器执行结束后马上执行了 T2...JS原生的集合类型数据结构,只有Array(数组)和Object(对象);而ES6中,又新增了Map和Set。...ES6约定,任何数据结构只要具备Symbol.iterator属性(这个属性就是Iterator的具体实现,它本质上是当前数据结构默认的迭代器生成函数),就可以被遍历——准确地说,是被for...of.

    1.9K30

    前端-JSON知识详解

    JSON的两种结构 JSON有两种表示结构,对象和数组。 对象结构以”{”大括号开始,以”}”大括号结束。...比如在js中。 字符串:这个很好解释,指使用“”双引号或’’单引号包括的字符。...5,遍历JSON对象 可以使用for…in…循环来遍历JSON对象中的数据,比如我们要遍历输出obj对象的值,代码如下: function Traversal() {     for (var c in...1,通过序列化将.net对象转换为JSON字符串 在web开发过程中,我们经常需要将从数据库中查询到的数据(一般为一个集合,列表或数组等)转换为JSON格式字符串传回客户端,这就需要进行序列化,这里用到的是...2,使用LINQ to JSON定制JSON数据 使用JsonConvert对象的SerializeObject只是简单地将一个list或集合转换为json字符串。

    2.5K20

    【愚公系列】2022年10月 微信小程序-优购电商项目-自定义组件

    文章目录 前言 一、自定义组件 1.小程序中的组件 2.组件的定义 1.1 声明组件 1.2 使用组件 1.3 效果 前言 组件(Component)是对数据和方法的简单封装。.../Tabs.js Component({ /** * 里面存放的是 要从父组件中接收的数据 */ properties: { // 要接收的数据的名称 // aaa:...3 获取原数组 4 对数组循环 1 给每一个循环性 选中属性 改为 false 2 给 当前的索引的 项 添加激活选中效果就可以了!!!...this.triggerEvent("itemChange",{index}); // 3 获取data中的数组 // 解构 对 复杂类型进行结构的时候 复制了一份.../ 4 循环数组 // [].forEach 遍历数组 遍历数组的时候 修改了 v ,也会导致源数组被修改 // tabs.forEach((v,i)=>i===index?

    29520

    面试问题之:JSON是什么?

    因为XML虽然可以作为跨平台的数据交换格式,但是在JS(JavaScript的简写)中处理XML非常不方便,同时XML标记比数据多,增加了交换产生的流量,而JSON没有附加的任何标记,在JS中可作为对象处理...1,JSON的两种结构 2,认识JSON字符串 3,在JS中如何使用JSON 4,在.NET中如何使用JSON 5,总结 JSON的两种结构 JSON有两种表示结构,对象和数组。...5,遍历JSON对象 可以使用for…in…循环来遍历JSON对象中的数据,比如我们要遍历输出obj对象的值,代码如下: function Traversal() { for (...1,通过序列化将.net对象转换为JSON字符串 在web开发过程中,我们经常需要将从数据库中查询到的数据(一般为一个集合,列表或数组等)转换为JSON格式字符串传回客户端,这就需要进行序列化,这里用到的是...2,使用LINQ to JSON定制JSON数据 使用JsonConvert对象的SerializeObject只是简单地将一个list或集合转换为json字符串。

    2.1K20

    爆肝整理高频js手写题请查收

    数组去重实现的基本原理如下:① 初始化一个空数组② 将需要去重处理的数组中的第1项在初始化数组中查找,如果找不到(空数组中肯定找不到),就将该项添加到初始化数组中③ 将需要去重处理的数组中的第2项在初始化数组中查找...,如果找不到,就将该项继续添加到初始化数组中④ ……⑤ 将需要去重处理的数组中的第n项在初始化数组中查找,如果找不到,就将该项继续添加到初始化数组中⑥ 将这个初始化数组返回var newArr = arr.reduce...递归的渲染并返回渲染后的结构 } return template; // 如果模板没有模板字符串直接返回}实现一个迭代器生成函数ES6对迭代器的实现JS原生的集合类型数据结构,只有Array(数组...四种数据结构各自有着自己特别的内部实现,但我们仍期待以同样的一套规则去遍历它们,所以ES6在推出新数据结构的同时也推出了一套 统一的接口机制 ——迭代器(Iterator)。...ES6约定,任何数据结构只要具备Symbol.iterator属性(这个属性就是Iterator的具体实现,它本质上是当前数据结构默认的迭代器生成函数),就可以被遍历——准确地说,是被for...of.

    1.2K40

    前端面试被问到的js手写面试题汇总

    ('cxk', 'father');child.say() // father好,我是练习时长两年半的cxk实现一个迭代器生成函数ES6对迭代器的实现JS原生的集合类型数据结构,只有Array(数组)和...ES6约定,任何数据结构只要具备Symbol.iterator属性(这个属性就是Iterator的具体实现,它本质上是当前数据结构默认的迭代器生成函数),就可以被遍历——准确地说,是被for...of....我们这块存储空间里面存储的数据需要是有序的,因为我们必须要顺序来删除数据,所以可以考虑使用 Array、Map 数据结构来存储,不能使用 Object,因为它是无序的。...最主要的是我们需要使用什么数据结构来存储数据,因为 map 的存取非常快,所以我们采用了它,当然数组其实也可以实现的。还有一些小伙伴使用链表来实现 LRU,这当然也是可以的。...()JSON.parse(JSON.stringify(obj))是目前比较常用的深拷贝方法之一,它的原理就是利用JSON.stringify 将js对象序列化(JSON字符串),再使用JSON.parse

    61930

    前端高频手写面试题总结

    深拷贝对于一些对象可以使用 JSON 的两个函数来实现,但是由于 JSON 的对象格式比 js 的对象格式更加严格,所以如果属性值里边出现函数或者 Symbol 类型的值时,会转换失败(1)JSON.stringify...()JSON.parse(JSON.stringify(obj))是目前比较常用的深拷贝方法之一,它的原理就是利用JSON.stringify 将js对象序列化(JSON字符串),再使用JSON.parse...(6)正则和 JSON 方法 在第4种方法中已经使用 toString 方法,其中仍然采用了将 JSON.stringify 的方法先转换为字符串,然后通过正则表达式过滤掉字符串中的数组的方括号,最后再利用...100ms,理论上又要往队列里推一个定时器代码,但由于此时 T2 还在队列中,所以 T3 不会被添加(T3 被跳过),结果就是此时被跳过;这里我们可以看到,T1 定时器执行结束后马上执行了 T2 代码...这可以使用在一些点击请求的事件上,避免因为用户的多次点击向后端发送多次请求。

    2.3K20

    JS 原生方法原理探究(九):如何手写实现浅拷贝和深拷贝?

    存在循环引用的问题 上面的 obj 对象存在循环引用,也就是说,它是一个环状结构(非树状)的对象,这样的对象是无法转化为 JSON 的,因此会报错:can’t convert circular structure...假设深拷贝的目标是下面这样的对象: let obj = {} obj.a = obj 这样的对象,结构中存在回环,即存在循环引用:obj 通过属性 a 引用了自身,而 a 也一定会有一个属性 a 再次引用自身...而深拷贝的过程中因为用到了递归,无限嵌套的对象就会导致无限的递归,不断地压栈最终会导致堆栈溢出。 如何解决循环引用带来的爆栈问题呢?其实也很简单,只需要给递归创建一个出口即可。...始终记住,我们要处理的是三类目标: 基本数据类型:直接返回即可 可以继续遍历的引用数据类型:除了上面已经处理的对象字面量和数组,还有类数组对象、Set、Map 。...对于这样的目标,我们不能像基本数据类型那样直接返回,因为它们本质上也是对象,直接返回将返回相同的引用,并没有达到拷贝的目的。正确的做法,应该是拷贝一份副本再返回。 如何拷贝呢?这里又分为两种情况。

    1.3K31

    2022前端面试遇到的手写题总结

    Array.isArray(data)) { return result } // 使用map,将当前对象的id与当前对象对应存储起来 let map = {}; data.forEach...深拷贝对于一些对象可以使用 JSON 的两个函数来实现,但是由于 JSON 的对象格式比 js 的对象格式更加严格,所以如果属性值里边出现函数或者 Symbol 类型的值时,会转换失败(1)JSON.stringify...()JSON.parse(JSON.stringify(obj))是目前比较常用的深拷贝方法之一,它的原理就是利用JSON.stringify 将js对象序列化(JSON字符串),再使用JSON.parse...arr;}思想: 双重 for 循环是比较笨拙的方法,它实现的原理很简单:先定义一个包含原始数组第一个元素的数组,然后遍历原始数组,将原始数组中的每个元素与新数组中的每个元素进行比对,如果不重复则添加到新数组中...ES6 中的 Set 去重function distinct(array) { return Array.from(new Set(array));}思想: ES6 提供了新的数据结构 Set,Set

    77130

    JS快速入门(一)

    分支 基本语法结构 循环 for循环 for循环的使用方法 格式 示例 while循环 三元运算符 函数 function关键字 表达式定义函数 箭头定义函数 arguments属性 匿名函数 自执行函数...连接数组 .sort() 排序 .forEach() 将数组的每个元素传递给回调函数 .splice(a,b,c) 删除元素,并向数组添加新元素,a代表下标,b代表删除元素的个数,c代表新添加的元素 ....map() 返回一个数组元素调用函数处理后的值的新数组 indexOf(子元素) 从数组中查询子元素,返回下标,如果没有要查询的子元素返回-1 //forEach()示例,函数做参数称之为回调函数 arry.forEach...JS中常用的数据类型是数组(上面)和对象结构,对象结构类似python中的字典,也是以key:value展示 //定义 var info = { name:'Hammer', age...,比如python的数据类型和js的有区别,那么前后端交互就需要一个翻译官”json“,来做这个任务 # python中 import json json.dumps() # 序列化 json.loads

    2.8K30

    前端常见面试题总结_2023-02-23

    在前端通过将一个符合 JSON 格式的数据结构序列化为 JSON 字符串,然后将它传递到后端,后端通过 JSON 格式的字符串解析后生成对应的数据结构,以此来实现前后端数据的一个传递。...因为 JSON 的语法是基于 js 的,因此很容易将 JSON 和 js 中的对象弄混,但是应该注意的是 JSON 和 js 中的对象不是一回事,JSON 中对象格式更加严格,比如说在 JSON 中属性值不能为函数...在 js 中提供了两个函数来实现 js 数据结构和 JSON 格式的转换处理, JSON.stringify 函数,通过传入一个符合 JSON 格式的数据结构,将其转换为一个 JSON 字符串。...JSON.parse() 函数,这个函数用来将 JSON 格式的字符串转换为一个 js 数据结构,如果传入的字符串不是标准的 JSON 格式的字符串的话,将会抛出错误。...当从后端接收到 JSON 格式的字符串时,可以通过这个方法来将其解析为一个 js 数据结构,以此来进行数据的访问。

    84010

    JS遍历循环方法性能对比:forwhilefor infor ofmapforeachevery

    循环将遍历对象本身的所有可枚举属性,以及对象从其构造函数原型中继承的属性(更接近原型链中对象的属性覆盖原型属性)。...,并为每个不同属性的值执行语句 什么数据可以for of遍历 一个数据结构只要部署了 Symbol.iterator 属性, 就被视为具有 iterator接口, 就可以使用 for of循环。...些数据结构部署了 Symbol.iteratoer属性了呢? 只要有 iterator 接口的数据结构,都可以使用 for of循环。...凡是部署了 iterator 接口的数据结构也都可以使用数组的 扩展运算符(...)、和解构赋值等操作。...forEach 不支持在循环中添加删除操作,因为在使用 forEach 循环的时候数组(集合)就已经被锁定不能被修改。

    4.1K20

    Web前端基础知识整理

    基于事件的逐行扫描文档,边扫描边解析,只在读时检查数据,不需要把全数据加载到内存中,对于大型文档解析有优势 2、DOM(Document Object Model) - 文档对象模型 数据全部存到内存中解析...(i)+","+s[i]); JSON与字符串直接转换 java向js传输的是json格式的字符串,要转换成json对象才能被js使用 代码: str=eval(str);//str是传来的字符串...代码,相当于servlet的service()方法 结构或jsp内置元素 %> 如果想在jsp中写html部分,需要用将jsp语句隔开 jsp内置元素 全局声明 语法:...、jstl(jsp标准标签库语言) 目的是减少jsp上小脚本的数量,作为sun公司推出的jsp辅助技术 分类: 核心库:控制程序流程,存储变量的使用和输出 jstl sql库:直接在页面上使用sql...var,表示当次循环对象的引用 items,使用EL表达式在四个存储范围加载集合对象 forEach var="op" items="${ss }"> ${pageScope.op.sname

    2.2K10

    2020年前端面试题及答案_结构化面试题库及答案

    forEach循环——不能遍历对象,不可以使用continue、break跳出循环,且使用return是跳出本次循环。 10、map与forEach的区别?...forEach是最基本的循环,默认有三个参数:array、item、index; map的用法和forEach基本一致,不同的是它会返回一个数组,所以callback需要有return值,如果没有,会返回...26、eval是做什么的? eval可以把字符串解析成JS代码并运行; 避免使用eval,不安全,非常消耗性能; 把JSON字符串传换成JSON对象时可以使用eval。...JSON是一种轻量级的数据交换格式; 基于javascript的一个子库,数据格式简单,易于读写,占用带宽小; JSON字符串可以转换成JSON对象; JSON对象可以转换成JSON字符串。...44、防抖、节流的理解? 防抖:当滚动事件中需要进行复杂计算或实现一个按钮的防二次点击操作,可以通过函数防抖来实现; 节流:节流与防抖的本质上不一样。

    2.7K20

    前端知识点总结js篇(中)

    , 循环的是key // 速度最慢 // for(item in str) { //    console.log(item) // } // forEach  循环遍历数组 // arr.forEach...JS中的原型链的理解 这篇文章讲解的很详细:juejin.cn/post/693449… * 原型:js中每个对象都有一个与它关联的对象,叫做原型对象。...使用call、apply、bind,this指向参数中创建的类实例 。...* 深拷贝:(基本数据类型基本都是深拷贝),深拷贝的对象与原来的对象是完全隔离的,一个对象的修改不会影响另外一个对象。 * 实现浅拷贝的方式 。 ...结构 。...新建一个空数组,遍历需要去重的数组,将数组元素存入新数组中,存放前判断数组中是否已经含有当前元素,没有则存入。此方法也无法对NaN去重。

    34020
    领券