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

温泉里挣扎的set()方法

一直以来,JS 只能使用数组和对象来保存多个数据,缺乏像其他语言那样拥有丰富的集合类型。因此,ES6 新增了两种集合类型 set 和 map,用于在不同的场景中发挥作用。...set 使用Object.is的方式判断两个数据是否相同,而不是用===严格相等,但是,针对+0 和-0,set 认为它们是相等的,什么意思呢?...,第三个参数是数组本身,而第二个参数却不是下标,那为什么不是下标呢?...因此在 set 集合中是不可能获取下标的,那自然而然不可能用普通 for 循环去循环它的下标,如果说一定要用下标的话,可以先把 set 集合转换为数组再使用它的下标。...「set 集合中不存在下标,因此 forEach 中的回调的第二个参数和第一个参数是一致的,均表示 set 中的每一项。」

95810

别误会,Map不只是地图

上集说到ES6中set方法,在ES6中除了增加set方法之外,还考虑到一种场景——键值对的存储,而map集合就是专门存储多个键值对(key value pair)的数据。...在map出现之前,我们使用的是对象的方式来存储键值对,键是属性名,值是属性值。键值对数据结合的特点就是:键不可重复。...如果用对象来存储键值对在某些场景下不太如意: 键名只能是字符串或者符号,这就给它的使用带来很大的限制 获取数据的数量不方便,如果想知道对象中存了多少个数据,就必须先拿到所有的键名,然后通过求数组的长度才能知道对象中有多少个属性...: 从结果看:有5个值,对象是引用值,它们的地址不同,所以不会覆盖,而a的原值1会被abc覆盖掉。...: 使用forEach遍历 参数1:每一项的值 参数2:每一项的键 参数3:map本身 例:forEach const mp = new Map([["a",1],["b",2],["c",3]]

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

    Javascript Array常见方法说明

    ES5中新增了写数组方法,如下: forEach (js v1.6) map (js v1.6) filter (js v1.6) some (js v1.6) every (js v1.6) indexOf...因此,我们有:[].forEach(function(value, index, array) { // … });对比jQuery中的$.each方法:$.each([], function(...this ); // 结果: // 你好,张含韵 // 抱歉,江一燕,你不是本家人 // 抱歉,李小璐,你不是本家如果这第2个可选参数不指定,则使用全局对象代替(在浏览器是为window),严格模式下甚至是...undefined: 在实际使用的时候,我们可以利用map方法方便获得对象数组中的特定属性值们。...:array.lastIndexOf(searchElement[, fromIndex])只是lastIndexOf是从字符串的末尾开始查找,而不是从开头。

    1K20

    nextjs 写 css loader 处理多地区不同基础变量的方法

    由于项目在多地区进行发布,为了复用,主工程使用同一个,但是这样会带来一个问题,由于地区的设备分布不同,以及当地的字体选择不一样,从而导致了 global 中的一些熟悉无法复用,而且必须配置两套,那么如何来解决这个问题呢...在 Webpack 运行的生命周期中会广播出许多事件,Plugin 可以监听这些事件,在合适的时机通过 Webpack 提供的 API 改变输出结果。...用法不同 Loader在module.rules中配置,也就是说作为模块的解析规则而存在。...类型为数组,每一项都是一个Object,里面描述了对于什么类型的文件(test),使用什么加载(loader)和使用的参数(options) Plugin在plugins中单独配置。...遍历 rules ,rules 中 oneOf 非数组的不处理,数组的则进行遍历,判断 rule 下的 use 是否为数组,如果不是数组,说明是单个 loader ,那么先转化为数组,然后添加该 loader

    1.8K20

    探究JavaScript前端热点面试题(三):让你在面试中游刃有余!

    客户端抵御 XSRF 攻击 • fetch: 不是基于 ajax 的封装,而是原生 js, 没有使用 XMLHttpRequests 对象 • 优点: • 缺点: 1....默认不携带 cookie, 不支持超时控制,使用 setTimeout 及 Promise.reject 的实现的超时控制并不能阻止请求过程继续在后台运行,造成了流量的浪费 3..../index.js'; console.log(num); // 0 add(); console.log(num); // 1 num = 10; // 抛出错误 // ESM 中的 import 在文件最顶部...可动态加载,代码发生在运行时 2. 可混合导出 3. 导出的值是拷贝,可修改导出的值。 6. forEach 与 map 方法的区别? • 相同点: 1. 都是用来遍历数组的 2....都支持三个参数: item 当前每一项, index 索引值, arr 原数组 • 不同点: 1. forEach 对每一个元素都执行操作,会改变原数组,没有返回值 2. map 不改变原数组,返回一个新数组

    30210

    ajax使用案例

    而想要实现ajax的请求是放在.ajax({})里面的。ajax是jQuery的方法,需要导入jQuery库文件。刚才犯了个错误,没有放到 下面就是代码执行后获取到的这个api的数据对象。...所有数据是res返回数据中的data,res.data获取;对象获取其中的属性值,由于不是方法,无需加(),直接对象.属性,属性可以是很多类型的数据,而不只是数字字符串,也可以是数组,对象等; 这里data...这个表又关联了一张表 2能看出来 下面红框就是又关联的另一张表: 关联的另一张表是在也面这里进行展示的: 注意res返回的数据中有data属性和data方法,我们使用数据用的是data属性,直接...这里的res.data是个数组,循环数组元素要res.data.forEach(function(item,index){}) 然后要做的是生成子追加到父;子是生成子标签,子标签要用到反引号,子中要用到变量使用...$(父选择器).on(‘事件’,‘标签’,匿名函数) //错选择的是li而不是ul标签。

    12.3K20

    为什么 Vue2 this 能够直接获取到 data 和 methods ? 源码揭秘!

    而 jQuery 源码的就是内部 new ,对于使用者来说就是无new构造。...其实 jQuery 也是可以 new 的。和不用 new 是一个效果。 如果不明白 new 操作符的用处,可以看我之前的文章。面试官问:能否模拟实现JS的new操作符 调试:继续在this....判断 methods 中的每一项是不是函数,如果不是警告。 判断 methods 中的每一项是不是和 props 冲突了,如果是,警告。...判断 methods 中的每一项是不是已经在 new Vue实例 vm 上存在,而且是方法名是保留的 _ $ (在JS中一般指内部变量标识)开头,如果是警告。...如果对于call、apply、bind的用法和实现不熟悉,可以查看我在面试官问系列中写的面试官问:能否模拟实现JS的call和apply方法面试官问:能否模拟实现JS的bind方法 调试:看完了initMethods

    96830

    带你探究webpack究竟是如何解析打包模块语法的

    /','join.js')); fs fs模块可以对文件进行一些读写操作 我们在webpack 中由于要转义语法,所以对文件的读写必不可少,使用方式也非常简单 //引入模块 const fs = require...接下来你会发现一个醒目的value是不是找到了我们的依赖关系,而下面这个就是我们的console这个表达式了 接下来我们就要去拿到依赖关系了,应该怎么处理呢?...是不是很像我们平常使用webpack打包之后的代码了,至于中间的这些传参,在开始时我已经介绍过了,这样一来我们简单的打包其实就已经可以使用了,但是,模块间依赖的代码应该怎么处理呢?...如上图,这样就和我们webpack中的形式一样了 3、打包生成合并依赖图谱,合并成浏览器可运行的代码 在上面两个步骤中,我们我们通过两个方法,拿到了最终左右的解析后的代码,我们在来一个方法,去初期最终生成的代码...上图的代码中我们是不是就发现和webpack导出的代码非常像啊,接下来我们给我们调用fs的写入文件方法,给代码写入js文件中即可,我们便不再赘述。

    95740

    如何理解JavaScript中的this

    希望通过我的理解能够对正在处于对this困惑的你指引方法,让你再也不用怕JavaScript中的this了,让你明白在各种情况下使用this。...说的极端点,如果你编写的 JS 采用函数式写法,而不是面向对象式,你所有的代码里 this 会少很多,甚至没有。...对象而data是user对象的属性 this.data.forEach (function (person) { //但在这个匿名函数(作为forEach方法的参数...//当执行showUserData()函数时,控制台输出的值来自全局的data数组,而不是user对象的data数组 showUserData (); // Samantha 12 (来自全局的data...call/apply 是 JS 里动态语言特性的表征。动态语言通俗的定义 程序在运行时可以改变其结构,新的函数可以被引进,已有的函数可以被删除,即程序在运行时可以发生结构上的变化。

    4.8K21

    2022高频前端面试题合集之JavaScript篇(中)

    在实际业务中没有很大的数组时,for 和 forEach 的性能差距其实很小,forEach 甚至会优于 for 的时间,且更加简洁,可读性也更高,一般也会优先使用 forEach 方法来进行数组的循环处理...参考答案: 在 ES6 中,可以书写 class。因为在 ES6 规范中,引入了 class 的概念。使得 JS 开发者终于告别了直接使用原型对象模仿面向对象中的类和类继承时代。...每当 Javascript 代码在运行的时候,它都是在执行上下文中运行。 「执行上下文的类型」 JavaScript 中有三种执行上下文类型。...任何被这个函数调用的函数会进一步添加到调用栈中,并且运行到它们被上个程序调用的位置。 当函数运行结束后,解释器将它从堆栈中取出,并在主代码列表中继续执行代码。...在 JS 中,可以通过在函数内容判断形参的类型或个数来执行不同的代码块,从而达到模拟函数重载的效果。 173.

    2.7K10

    如何做到 jQuery-free?

    jQuery是现在最流行的JavaScript工具库。 据统计,目前全世界57.3%的网站使用它。也就是说,10个网站里面,有6个使用jQuery。...开发者直接使用JavScript标准语法,就能同时在各大浏览器运行,不再需要通过jQuery获取兼容性。...length属性),但不是数组,不能使用pop、push等数组特有方法。...其中,最有名的是zepto.js。它的设计目标是以最小的体积,做到最大兼容jQuery的API。zepto.js 1.0版的原始大小是55KB,优化后是29KB,gzip压缩后为10KB。...如果不求最大兼容,只希望模拟jQuery的基本功能,那么,min.js优化后只有200字节,而dolla优化后是1.7KB。 此外,jQuery本身采用模块设计,可以只选择使用自己需要的模块。

    1.6K40

    JavaScript百炼成仙读书笔记

    for循环和while循环语法 for循环: for(语句1; 语句2; 语句3){ 被执行的代码块 } 语句1:在循环(代码块)开始前执行 语句2:定于运行循环(代码块)的条件...arr5 = arr4.slice(1,3) // 118,4 var arr6 = arr4.slice(1) // [118, 4, 3, 2, 1] map方法:映射---指数组中的每一项运行给定函数...return x*0.9; }) console.log(arr8) // [0.9, 1.8, 2.7, 3.6, 4.5] filter方法:过滤---数组中的每一项运行给定函数...方法:对数组进行遍历循环,对数组中的每一项运行给定函数。...箭头函数中this的指向是定 义时所在的作用域,而不是执行时的作用域 只要使用了箭头函数,就不要管这个函数本身了,在外面寻找最近的大括号,然后看这个大括号处在怎样的环境中, this就指向它!

    63830

    【操作系统】考研408操作系统核心考点:进程控制机制与原语实现深度解析​

    --->PCB7 在操作系统中,进程会根据自己此时所处的状态而进入相应的队列中,而判断进程相应状态的方式,我们可以通过变量 state 来实现,如: state == 1 表示该进程处于运行态 state...2.2 关中断与开中断 在操作系统中存在着两条特权指令——关中断与开中断。...end g[中断信号]--->c 上图所示的就是在操作系统的内核中执行的一个程序。...当这个程序正常执行时,其执行的顺序为: 指令1--->关中断--->指令2--->指令3--->开中断--->指令4 从图中我们可以看到,在执行完关中断后,执行指令2之前存在一条中断信号,如果在正常的执行逻辑下...,CPU会执行以下操作: 检测到中断信号 处理中断信号 继续回到发生中断的点,继续向后执行 但是,在检测到该中断信号之前,CPU执行了关中断指令,这时 CPU 会直接忽略该信号,而继续往下执行,并且在执行开中断之前

    27510

    JS箭头函数三连问:为何用、怎么用、何时用

    例如在Vue.js中,有一种通用模式,就是使用mapState将Vuex存储的各个部分,直接包含到Vue组件中。...,它虽然不是Counter的上下文中,它仍旧可以访问实例的数据,这种方式的缺点不言而喻。...简单的理由跟匿名函数一样,堆栈的追踪很复杂。 如果你的函数仅仅在一层之下,而不是深层的迭代,这倒不是什么问题。...一些典型的例子: 事件的调用函数,this指向当前的目标属性 在jquery中,大多数时候this指向的是当前被选择的元素 在vue中,methods和computed中的this指向的是vue的组件。...因此我们使用它应该仅仅是作为一种工具,而不是无脑的简单的全部替换为箭头函数。

    3.1K20

    JS几种数组遍历方式总结

    实际性能要比普通foreach弱 第六种:forin循环 代码如下: for(j in arr) { } 简要说明: 这个循环很多人爱用,但实际上,经分析测试,在众多的循环遍历方式中 它的效率是最低的...分析结果1 以下截图中的数据是,在chrome (支持es6)中运行了100次后得出的结论(每次运行10次,一共10个循环,得到的分析结果) 可以看出,forin循环最慢。...优化后的普通for循环最快 分析结果2 以下截图数据是,在chrome (支持es6)中运行了1000次后得出的结论(每次运行100次,一共10个循环,得到的分析结果) 1. javascript...(arr)时 alert(arr);//输出[1, 2, 3, 4, 5, 6] 而当我们使用for of 时: var arr=[1,2,3,4,5,6]; arr.value='val'; //在使用...jQuery的$.each jQuery的遍历方法通常被用来遍历DOM元素,用于数组和对象的是$.each()方法,它接受三个参数,分别指代数组索引/元素/数组本身(跟forEach相比,第1

    2.2K21

    基于Webpack, KnockoutJs,esyui,koeasyui实现类vue-cli生成的模板框架

    的想法。有了想法就要开撸,终于在今年5月份完成了koeasyui的alpha版本(博客地址:https://www.cnblogs.com/cqhaibin/p/9064803.html )。...的形式。其koeayui是组合knockoutjs和easyui而形成一套UI框架的能力。...但回头一起,webpack不是万能的嘛,肯定可以导入html,js文件,然后进行组装啊,果不其然。所以我们的组件模式如下: ?...三、easyui组件的引入 引入easyui非常方便,首先需要装koeasyui相关组件都注册到内存中,代码如下: //注册easyui window.koeasyui.use(ko); 然后在需要要位置进行组件引入...四、总结       您可以在gitee上获取本模板框架的源码,然后直接npm install, 再npm run dev运行开模式,用npm run build进行发布和打包。

    1.4K20

    JavaScript异步编程设计快速响应的网络应用

    * 第二,只触发jQuery对象集合中第一个元素的事件处理函数。 * 第三,这个方法的返回的是事件处理函数的返回值,而不是据有可链性的jQuery对象。...在JavaScript中我们可以利用worker单开一个单独的线程,其交互方式类似于I/O操作。 注意:同一个进程内的多个线程之间可以分享状态,而彼此独立的进程之间则不能。 1....六、异步的脚本加载 js"> 在文档 上述加载js为同步阻塞加载(脚本下载完毕并运行之后,浏览器才会加载后续资源),为了避免一些不必要的问题...脚本的异步运行 js"> 脚本会以任意次序运行,而且只要JavaScript引擎可用就会立即运行,而不论文档就绪与否。...注意: (1)在同时支持这两个属性的浏览器中使用,async会覆盖掉defer。 (2)使用异步或延迟加载的脚本中,不能使用document.write,其会表现出不可预知的行为。 3.

    2.4K31
    领券