Pages

La représentation schématique

let tabPers = [  {
   nom: "Dupont",
   sex : "f",
 },
 {
   nom: "Brusel",
   sex : "h",
 },
 {
   nom: "Dupont",
   sex : "f",
 },  
];

Voici la représentation de tabPers.



Donner la représentation de tabFiltre.


function femme({sex}) {
 return (sex === "f");}

function filter(array, test) {
 let passed = [];
 for (let val of array) {
   if (test(val))
     passed.push(val);
 }
 return passed;
}

let tabFiltre = filter(tabPers,femme);

Clonage en action : Object.assign

let tabPers = [  {
    nom: "Dupont",
    sex : "f",
  }, 
  {
    nom: "Brusel",
    sex : "h",
  },
  {
    nom: "Dupont",
    sex : "f",
  },  
];

let cloneTabPers = [];

for(let pers of tabPers){
  
   cloneTabPers.push(Object.assign({pays:"fr"},pers))

}




Visualisation

Besoin d'aide

arrow function !

Il fût un temps où l'on écrivait

le temps des closures


// A function that generators a new function for adding numbers
function addGenerator( num ) {
    // Return a simple function for adding two numbers
    // with the first number borrowed from the generator
    return function( toAdd ) {
        return num + toAdd
    };
}

// addFive now contains a function that takes one argument,
// adds five to it, and returns the resulting number
var addFive = addGenerator( 5 );

// We can see here that the result of the addFive function is 9,
// when passed an argument of 4
alert( addFive( 4 ) == 9 );

le temps des blocs

let addFive_b; { let five = 5; addFive_b = function ( toAdd ) { return five + toAdd }; } console.log(addFive_b( 4 ) == 9 );

Le temps des arrow functions


ES6 arrow functions make it easy to write curried functions manually:

const add = x => y => x + y;
That means that you have to invoke add() as follows:
add(5)(4); // 9
This is currying: a function with an arity greater than one becomes a nested series of functions. Most functional programming languages with automatic currying have syntax where there is no difference between add(1, 2) and add(1)(2).


Visualisation de la fonction filtre

code 

passage paramètre valeur par défaut

Problème de code
Rappel 

function selectEntries(options) {
    options = options || {};
    var start = options.start || 0;
    var end = options.end || getDbLength();
    var step = options.step || 1;
    ···
}
In ECMAScript 6, you can use destructuring, which looks like this:
function selectEntries({ start=0, end=-1, step=1 }) {
    ···
};
If you call selectEntries() with zero arguments, the destructuring fails, because you can’t match an object pattern against undefined. That can be fixed via a default value. In the following code, the object pattern is matched against {} if there isn’t at least one argument.
function selectEntries({ start=0, end=-1, step=1 } = {}) {
    ···
};

let tabPers = [
  {
    nom: "Brusel",
    sex : "h",
    born: 1980,
n:"fr"
  },
  {
    nom: "Charles",
    sex : "h",
    born: 2001,
n:"fr"
  },
  {
    nom: "Dupont",
    sex : "f",
    born: 2000,
n:"fr"
  },  
 {
    nom: "Toto",
    sex : "f",
    born: 1991,
n:"fr"
  },
  {
    nom: "Dupont",
    sex : "h",
    born: 2002,
n:"fr"
  },
];

let annee = new Date().getFullYear();
function setAge({nom,sex,born}) {
age = annee - born;
  return {nom,sex,age};
}
function setAge({nom,sex,born}) {
age = annee - born;
  return {nom,sex,age};
}


function filterMultArg(array, test,argObj) {
  let passed = [];
  for (val of array) {
    if (test(val, argObj ))
      passed.push(val);
  }
  return passed;
}

function sexAge({sex,age},  {limiteAge=18,civilite="h"} = {} ) {
    console.log(limiteAge,civilite);
    return (sex === civilite  && age > limiteAge);
}
function transf(array, fx) {
  let passed = [];
  
  for(v  of array)
passed.push(fx(v));

  return passed;
}


T = transf(tabPers,setAge);
console.log(filterMultArg(T, sexAge,{limiteAge:2,civilite:"h",pipo:"popi"}));
console.log(filterMultArg(T, sexAge,{pipo:"popi"}));
console.log(filterMultArg(T, sexAge));


Google map in jsfiddle

code

HTML

<h3>My Google Maps Demo</h3>
<div id="map"></div>
 <!-- Replace the value of the key parameter with your own API key. -->
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCZj6jlvGwL0uIzag">
</script>


JS

function initMap() { 
}

let options = {
};

function success( {coords}) {

 console.log = ` ${coords.latitude},${coords.longitude}`;
 let myPos = {lat: coords.latitude, lng: coords.longitude};
 let map = new google.maps.Map(document.getElementById('map'), {
    zoom: 15,
    center: myPos
  });
  var marker = new google.maps.Marker({
    position: myPos,
    map: map
  });
  
};

function error(err) {
  console.warn(`ERROR(${err.code}): ${err.message}`);
};

navigator.geolocation.getCurrentPosition(success, error, options);