Qu'est-ce que l'aplatissement du tableau js ? Implémentation de l'aplatissement du tableau js (avec code)

Cet article vous explique qu'est-ce que l'aplatissement des tableaux js ? L'implémentation de l'aplatissement du tableau js (avec code) a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer, j'espère que cela vous sera utile.

1. Qu'est-ce que l'aplatissement des tableaux

1. Le flatlining, comme son nom l'indique, consiste à réduire la complexité de décoration et faciliter la tâche. C'est plus concis et simple, mettant en valeur le thème.

2. L'aplatissement des tableaux, comme vous le savez déjà d'après ce qui précède, consiste à transformer un tableau multicouche complexe imbriqué couche par couche en un tableau avec moins de niveaux ou un seul tableau de couches.

Ps : flatten peut aplatir le tableau, l'effet sera le suivant :

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr)); // [1, 2, 3, 4]

Comme on peut le voir, en utilisant flatten Le tableau traité n'a qu'une seule couche, essayons de l'implémenter ci-dessous.

2. Implémentation simple

2.1 Récursion ordinaire

• Ceci C’est la méthode la plus simple à imaginer, simple et claire !

/* ES6 */
const flatten = (arr) => {
  let result = [];
  arr.forEach((item, i, arr) => {
    if (Array.isArray(item)) {
      result = result.concat(flatten(item));
    } else {
      result.push(arr[i])
    }
  })
  return result;
};

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

/* ES5 */
function flatten(arr) {
  var result = [];
  for (var i = 0, len = arr.length; i < len; i++) {
    if (Array.isArray(arr[i])) {
      result = result.concat(flatten(arr[i]))
    }
    else {
      result.push(arr[i])
    }
  }
  return result;
}

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

2.2 toString()

• Cette méthode utilise toString pour modifier le tableau into dans une chaîne séparée par des virgules, puis parcourez le tableau et reconvertissez chaque élément dans son type d'origine.

Regardons d'abord comment toString transforme un tableau en chaîne

[1, [2, 3, [4]]].toString()
// "1,2,3,4"

Affichage complet

/* ES6 */
const flatten = (arr) => arr.toString().split(',').map((item) => +item);

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

/* ES5 */
function flatten(arr) {
  return arr.toString().split(',').map(function(item){
    return +item;
  });
}

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

Le les scénarios utilisés par cette méthode sont très limités. Tous les éléments du tableau doivent être des nombres.
Ils peuvent également être uniquement des chaînes, et vous pouvez réaliser vous-même l'implémentation spécifique.

2.3 [].concat.apply + some

• Utilisez arr.some pour déterminer s'il y a un tableau dans le tableau et appelez Fonction plate (utilisant flatten aplatissement), connectée à [].concat.apply, renvoie finalement concat;arr

/* ES6 */
const flatten = (arr) => {
  while (arr.some(item => Array.isArray(item))){
    arr = [].concat.apply([], arr);
  }
  return arr;
}

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

/* ES5 */
/**
* 封装Array.some
* @param {function} callback    - 回调函数
* @param {any}      currentThis - 回调函数中this指向
*/
Array.prototype.some = function (callback, currentThis){
  let context = this;
  let flag = false;
  currentThis = currentThis || this;
  for (var i = 0, len = context.length; i < len; i++) {
    const res = callback.call(currentThis, context[i], i, context);
    if (res) {
      flag = true;
    } else if (!flag) {
      flag = false;
    }
  }
  return flag;
}

function flatten(arr){
  while(arr.some(item => Array.isArray(item))){
    arr = [].concat.apply([], arr);
  }
  return arr;
}

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

2.4 réduire

• lui-même est un boucleur itératif, généralement utilisé pour l'accumulation, donc sur la base de cette fonctionnalité, il y a les éléments suivants : reduce

function flatten(arr){
  return arr.reduce(function(prev, cur){
    return prev.concat(Array.isArray(cur) ? flatten(cur) : cur)
  }, [])
}

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

2.5 L'opérateur de déstructuration dans ES6...

• ne peut étendre que le tableau le plus externe à chaque fois. ... Aplatissez-le une fois. [].concatarr

Articles connexes recommandés :

function flatten(arr){
  while(arr.some(item => Array.isArray(item))){
    arr = [].concat(...arr);
  }
  return arr;
}

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

Utiliser javascript pour écrire quatre analyses lexicales du compilateur arithmétique

Comment implémenter le clic de défilement js pour charger plus de code de données ?

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!