Pages

đŸȘ›DM

 /**

*
 * @param {String} start The first letter
 * @param {String} end The last letter
 * @param {Number} step The step between letter
 * @returns {Array} Return a new array of charCode between start and end
 */
function codeRange(start, end, step = 1) {
  return new Array(Math.ceil((end.charCodeAt(0) - start.charCodeAt(0)) / step))
    .fill(start.charCodeAt(0))
    .map((x, i) => i * step + start.charCodeAt(0));
}

/**
 * A specialized version of `_.map` for arrays without support for callback
 * shorthands and `this` binding.
 *
 * @private
 * @param {Array} array The array to iterate over.
 * @param {Function} iteratee The function invoked per iteration.
 * @returns {Array} Returns the new mapped array.
 */
function arrayMap(array, iteratee) {
  var index = -1,
    length = array.length,
    result = Array(length);

  while (++index < length) {
    result[index] = iteratee(array[index], index, array);
  }
  return result;
}

const codes = codeRange("A", "H", 2);
// find the iteratee code to map string from charCode
const Letters = arrayMap(codes, --?--);

console.table(Letters);
┌─────────┬────────┐ │ (index) │ Values │ ├─────────┼────────┤ │ 0 │ 'A' │ │ 1 │ 'C' │ │ 2 │ 'E' │ │ 3 │ 'G' │ └─────────┴────────┘

Bravo !





Vous avez ecrit en TD, une fonction incroyable, vous pouvez ĂȘtre fier de vous

/**
 *
 * @param {Array} array The array to iterate over
 * @param {Function} transform The function invoked per iteration
 * @returns {Array} Returns The new mapped array.
 */
function map(array, transform) {
  const mapped = [];
  for (let i = 0; i < array.length; i++)
    mapped.push(transform(array[i]));
  return mapped;
}


đŸ„·Voici une bibliothĂšque qui implĂ©mente map https://lodash.com/docs#map

Le code de la fonction est un peu plus compliquĂ©, mais le principe est lĂ  ! 

https://github.com/lodash/lodash/blob/3.10.1/lodash.src.js#L6864

đŸ„‡On peut dĂ©couvrir que la fonction peut dans le cas d'un tableau appeler la fonction arrayMap. cette fonction ressemble Ă  notre fonction.


 : https://github.com/lodash/lodash/blob/3.10.1/lodash.src.js#L1531


Bilan sur les fonctions avec des tableaux


Rappels sur les Tableaux.


đŸ„·Simulez les mĂ©thodes


đŸȘ›Exemples de code

const pers = [
  {
    nom: "Dupont",
    ville: "Evry",
    sex: "f",
  },
  {
    nom: "Brusel",
    ville: "Belfort",
    sex: "h",
  },

  {
    nom: "Dupont",
    ville: "PARIS",
    sex: "f",
  },
  {
    nom: "Durant",
    ville: "Paris",
    sex: "h",
  },
];

// have fun with for of
function affiche(tab, callback) {
  for (let [i, ele] of Object.entries(tab)) {
    console.log(callback ? callback(ele, i) : `${i}->${ele.nom}`);
  }
}

affiche(pers);
affiche(pers, ({ nom: name, ville: town }) => `${name} lives in ${town}`);

function afficheVille({ ville }, i) {
  return `${i} : ${ville}`;
}

affiche(pers, afficheVille);

// transforme
function transf(array, fx) {
  let passed = [];

  for (let v of array) passed.push(fx(v));

  return passed;
}

//
function civilite({ nom, sex }) {
  return sex == "h" ? `Monsieur ${nom}` : `Madame ${nom}`;
}

const newT = transf(pers, civilite);
console.log(newT);

//
function normalise(pers) {
  return (pers.ville = pers.ville.toUpperCase());
}
transf(pers, normalise);
console.table(pers);

DOM express


See the Pen arbre généalogique 1 by dupont (@dupontcodepen) on CodePen.

le DOM est de retour

 https://dupontdom.blogspot.com/



Le code HTML

<body>
  <p class="premier">Para 1</p>
  <p><em>second </em> Para 2</p>
  <p id="dernier"> dernier Para</p>
  <!-- je suis un commentaire -->
</body>

La reprĂ©sentation 


La structuration


On peut retrouver une représentation suivante !

 

Tableau

Nous allons nous intéresser à un littéral de base : le Tableau.

Le tableau est certainement le type de données le plus utilisé. Je vous passe la liste des algorithmes qui manipulent la structure de données du tableau.

 

La base : lecture