🔜
Sechs, ES6. Sieben, einige Fragen
const unique = (arr)=>{ for(let i = 0; i { var arr = [1, '1', '1', 1, 2, true, false, true, 3, 2, 2, 1]; var newArr = []; for(let i = 0; i <img src="https://img.php.cn/upload/article/202103/03/2021030310181952664.jpg" alt="JavaScript-Thema 2: Array-Deduplizierung" >Kernpunkt:<p><strong></strong></p>Zeitkomplexität: <code>O(n^2)</code>
splice
verwenden, um indexOf zu entfernen, wenn die Methode <code>indexOf
ein doppeltes Element findet (ungleich). die Position, an der es zum ersten Mal erschien. Code>: Gibt den ersten Index
zurück, an dem ein bestimmtes Element im Array gefunden werden kann, oder -1, wenn es nicht existiert. indexOf(ele, fromIndex)
const unique = (arr) => { var res = []; for (let i = 0; i <h5>2.2 enthält eine vereinfachte einstufige Schleifenbeurteilung</h5><p><a href="//m.sbmmt.com/course/list/17.html" target="_blank" textvalue="javascript视频教程">Kernpunkt: </a></p><p><img src="https://img.php.cn/upload/article/000/000/052/87e1933471f3a5888c03aeb3f63d42fb-0.jpg" alt="JavaScript-Thema 2: Array-Deduplizierung">Sie können es selbst kombinieren, ob Sie das ursprüngliche Array zurückgeben möchten oder ein neues Array~</p><p><code> Includes</code>: Wird verwendet, um zu bestimmen, ob ein Array einen angegebenen Wert enthält. Geben Sie je nach Situation <code>true</code> zurück, andernfalls geben Sie <code> zurück false</code><strong></strong><code>includes (ele, fromIndex)</code> </p><p>ele: Das zu findende Element <strong></strong>fromIndex: Suche am angegebenen Index starten. Der Standardwert ist 0. Wenn er negativ ist, wird der Absolutwertindex von <code>fromIndex</code> vom Ende nach vorne gesprungen. . </p>
O(n^2)
二、indexOf和includes
核心点:
indexOf
方法找到重复项时(不等于它首次出现的位置)时利用splice
移除indexOf
:返回在数组中可以找到一个给定元素的第一个索引
,如果不存在,则返回-1。indexOf(ele, fromIndex)
代码:
const unique = (arr) => { var res = []; for (let i = 0; i <h5>2.2 includes简化一层循环判断</h5><p><strong>核心点:</strong></p>
includes
:用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true
,否则返回false
includes(ele, fromIndex)
fromIndex
的绝对值个索引。。代码:
if(res.indexOf(arr[i]) !== -1 ){ todo }// orif(res.includes(arr[i])){ todo }
在这里我们推荐使用includes来查找元素:
返回值可以直接作为if的条件语句,简洁
var arr = [NaN, NaN];arr.indexOf(NaN); // -1arr.includes(NaN); // true
识别NaN
如果数组中有NaN
,你又正好需要判断数组是否有存在NaN
,这时你使用indexOf
是无法判断的,你必须使用includes
这个方法。
var arr = new Array(3);console.log(arr.indexOf(undefined)); //-1console.log(arr.includes(undefined)) //true
识别undefined
如果数组中有undefined
值,includes
会认为空的值是undefined,而indexOf
不会。
var arr = [1, 1, '1'];function unique(arr) { var res = []; var sortedArr = arr.concat().sort(); var last; for (var i = 0; i <p><strong>三、排序去重</strong></p><p><strong>核心点:</strong></p>
字符串的各个字符的Unicode位点
进行排序。所以很难保证它的准确性;代码:
var arr = [1, 2, 1, 1, '1'];const unique = function (arr) { var res = arr.filter(function(item, index, arr){ return arr.indexOf(item) === index; }) return res;}console.log(unique(arr)); // [ 1, 2, '1' ]
四、filter
核心点:
函数实现的测试
的所有元素(返回测试函数成立的元素)filter(callback, thisArg)
:代码:
var arr = [1, 2, 1, 1, '1'];const unique = function (arr) { return arr.concat().sort().filter(function(item, index, arr){ return !index || item !== arr[index - 1] })}console.log(unique(arr));
结合排序的思路:
var arr = [1, 2, 1, 1, '1', 3, 3];const unique = function(arr) { var obj = {}; var res = []; arr.forEach(item => { if (!obj[item]) { obj[item] = true; res.push(item); } }); return res;}console.log(unique(arr)); // [1, 2, 3]
五、键值对(key-value)
前面提到的几种方式总结下来大致分为
我们再提出一种方式,利用Object对象 key-value的方式,来统计数组中元素出现的个数,初步判断逻辑也有两种
拿[1,1,1,2,2,3,'3']
var arr = [1, 2, 1, 1, '1'];const unique = function(arr) { var obj = {}; return arr.filter(function(item, index, arr){ return obj.hasOwnProperty(item) ? false : (obj[item] = true) })}console.log(unique(arr)); // [1, 2]
var arr = [1, 2, 1, 1, '1', 3, 3, '2'];const unique = function(arr) { var obj = {}; var res = []; arr.forEach(item => { if (!obj[typeof item + item]) { obj[typeof item + item] = true; res.push(item); } }); return res;}console.log(unique(arr)); // [ 1, 2, '1', 3, '2' ]
NaN
🎜🎜🎜Wenn das Array NaN
enthält, müssen Sie es nur tun Bestimmen Sie, ob das Array vorhanden ist NaN
, dann ist es unmöglich festzustellen, ob Sie indexOf
verwenden. Sie müssen die Methode includes
verwenden. 🎜var arr = [1, 2, 1, '1', '2'];const unique = function(arr) { return Array.from(new Set(arr));}console.log(unique(arr)); // [ 1, 2, '1', '2' ]
undefiniert
🎜🎜🎜Wenn das Array einen undefinierten
-Wert enthält, betrachtet includes
den 🎜leeren Wert als undefiniert 🎜, und indexOf nicht. 🎜function unique(array) { return [...new Set(array)];}
-Zeichenfolge
Zum Sortieren. Daher ist es schwierig, die Genauigkeit zu garantieren. 🎜🎜🎜🎜Code: 🎜🎜var unique = (a) => [...new Set(a)]
enthält Alle Elemente des Tests
, die von der Funktion implementiert werden (gibt das Element zurück, für das die Testfunktion erstellt wird) 🎜🎜filter(callback, thisArg)
: 🎜🎜callback akzeptiert drei Parameter: element - das aktuell verarbeitete Element, index – der aktuelle Elementindex, array – das Array selbst, in dem der Filter aufgerufen wurde 🎜🎜thisArg: der dafür verwendete Wert beim Ausführen des Rückrufs. function unique (arr) { const newMap = new Map() return arr.filter((a) => !newMap.has(a) && newMap.set(a, 1));}
[1,1,1,2,2,3,'3']Beispiel: 🎜<ol>
<li>统计每个元素出现的次数,obj:{1: 3, 2: 2, 3: 3}, 返回这个<code>obj
的key
而不管他们的value
var arr = [1, 2, 1, 1, '1', 3, 3];const unique = function(arr) { var obj = {}; var res = []; arr.forEach(item => { if (!obj[item]) { obj[item] = true; res.push(item); } }); return res;}console.log(unique(arr)); // [1, 2, 3]
var arr = [1, 2, 1, 1, '1'];const unique = function(arr) { var obj = {}; return arr.filter(function(item, index, arr){ return obj.hasOwnProperty(item) ? false : (obj[item] = true) })}console.log(unique(arr)); // [1, 2]
对象的属性是字符串类型的,即本身数字1
和字符串‘1’
是不同的,但保存到对象中时会发生隐式类型转换,导致去重存在一定的隐患。
考虑到string和number的区别(typeof 1 === ‘number’, typeof ‘1’ === ‘string’),
所以我们可以使用 typeof item + item
拼成字符串作为 key 值来避免这个问题:
var arr = [1, 2, 1, 1, '1', 3, 3, '2'];const unique = function(arr) { var obj = {}; var res = []; arr.forEach(item => { if (!obj[typeof item + item]) { obj[typeof item + item] = true; res.push(item); } }); return res;}console.log(unique(arr)); // [ 1, 2, '1', 3, '2' ]
六、ES6
随着 ES6 的到来,去重的方法又有了进展,比如我们可以使用 Set 和 Map 数据结构。
Set:它允许你存储任何类型的唯一值,无论是原始值或者是对象引用
代码:
var arr = [1, 2, 1, '1', '2'];const unique = function(arr) { return Array.from(new Set(arr));}console.log(unique(arr)); // [ 1, 2, '1', '2' ]
简化1:
function unique(array) { return [...new Set(array)];}
简化2:
var unique = (a) => [...new Set(a)]
Map 对象保存键值对,并且能够记住键的原始插入顺序。任何值(对象或者原始值) 都可以作为一个键或一个值。
function unique (arr) { const newMap = new Map() return arr.filter((a) => !newMap.has(a) && newMap.set(a, 1));}
写到这里比较常规的数组去重方法就总结的差不多了,如果需要更强大的去重方法,我们需要对他们进行组合,而且因为场景的不同,我们所实现的方法并不一定能涵盖到
相关免费学习推荐:javascript(视频)
Das obige ist der detaillierte Inhalt vonJavaScript-Thema 2: Array-Deduplizierung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!