ES6 - React

1.1 - copy string.js

console.clear();

var string = 'opcon4';

function changeString(string) {
  string = 'opcon1';
  console.log('inside', string);
}

changeString(string);

console.log('outside', string);

1.2 copy numbers.js

console.clear();

var number = 22;

function changeNumber(number) {
  number = number + 20;
  console.log('inside', number);
}

changeNumber(number);

console.log('outside', number);

2.1 - reference arrays.js

console.clear()

var array = [
  'backbone',
  'require',
  'gulp'
];

function changeArray(array) {
  array[0] = 'react';
  console.log('inside', array);
}

changeArray(array);

console.log('outside', array);

2.2 reference objects.js

console.clear();

var developer = {
  name: 'Orlando',
  surname: 'Bustos'
};

function changeObject(developer) {
  developer.name = 'Don ' + developer.name;
  console.log('inside', developer);
}

changeObject(developer);

console.log('outside', developer);

3.1 - check change primitive.js

console.clear();

var x = 2;

function square(x) {
  x = x * x;
  return x;
}

var newX = square(x);

console.log(newX);

console.log(
  'same number?',
   x === newX
);

3.2 - check change array error.js

console.clear()

var opcons = [1, 2, 3];

function addOpcon(opcons) {
  opcons.push(4);
  return opcons;
}

var newOpcons = addOpcon(opcons);

console.log(newOpcons);

console.log(
  'same array?',
  opcons === newOpcons
);

3.3 check change array ok.js

console.clear();

var opcons = [1, 2, 3];

function addOpcon(opcons) {
  var newOpcons = [];
  var i;
  for(i = 0; i < opcons.length; i++) {
    newOpcons[i] = opcons[i];
  }
  newOpcons[i] = 4;
  return newOpcons;
}

var newOpcons = addOpcon(opcons);

console.log(newOpcons);

console.log(
  'same array?',
  opcons === newOpcons
);

3.4 - check change object error.js

console.clear()

var developer = {
  name: 'Orlando'
};

function changeObject(developer) {
  developer.name = 'Don ' + developer.name;
  return developer;
}

var newDeveloper = changeObject(developer);

console.log(newDeveloper);

console.log(
  'same object?',
  developer === newDeveloper
);

3.5 check change object ok.js

console.clear();

var developer = {
  name: 'Orlando'
};

function changeObject(developer) {
  var newDeveloper = {};
  for (var key in developer) {
    newDeveloper[key] = 'Don ' + developer[key];
  }
  return newDeveloper;
}

var newDeveloper = changeObject(developer);

console.log(newDeveloper)

console.log(
  'same object?',
  developer === newDeveloper
);

4.1 - es6 Object.assign().js

console.clear()

let developer = {
  name: 'Orlando'
}

const changeObject = (developer) => {
  return Object.assign(
    {},
    developer,
    {name: 'Don ' + developer.name}
  )
}

var newDeveloper = changeObject(developer)

console.log(newDeveloper)

console.log(
  'same object?',
  developer === newDeveloper
)

4.2 - es6 Array.concat().js

console.clear()

let opcons = [1, 2, 3]

let addOpcon = (opcons) => {
  return opcons.concat([4])
}

var newOpcons = addOpcon(opcons)

console.log(newOpcons)

console.log(
  'same array?',
  opcons === newOpcons
)

4.3 - es6 spread operator array.js

console.clear()

let array = [1, 2, 3]

console.log([0, ...array, 4])

const numbers = (num1, num2, num3) => {
  console.log(num1, num2, num3)
}

numbers(...array)

4.4 - es6 spread operator object.js

console.clear()

let developer = {
  name: 'Orlando',
  surname: 'Bustos'
}

let developerWithKingOf = {kingOf: 'Sabre', ...developer}

console.log(developerWithKingOf)

4.5 - es6 spread variable parameters.js

console.clear()

const variableParams = (name, ...developer) => {
  console.log(name, developer)
}

variableParams('Orlando', 'Bustos', 'Don')

4.6 - es6 default parameters.js

console.clear()

let defaultValues = (opcon) => {
  console.log(opcon)
}

defaultValues(4)

// Test without parameters and then create default parameter

4.7 - es6 destructuring assignment.js

console.clear()

let developer = {
  name: 'Bladimir',
  surname: 'Yanez',
  kingOf: 'Sabre'
}

let { surname } = developer

console.log(surname)

import { component } from 'React'
  
class vuelos extends component {
  
}

// Extract name too

5.1 - expect and deepFreeze.js

<script src="https://wzrd.in/standalone/expect@latest"></script>
<script src="https://wzrd.in/standalone/deep-freeze@latest"></script>

5.2 - toogle todo.js

console.clear()

const toogleTodo = (todo) => {
  //todo.completed = !todo.completed
  return Object.assign(
    {},
    todo,
    {completed: !todo.completed}
  )
  return todo
}

const testToogleTodo = () => {
  const todoBefore = {
    id: 0,
    text: 'Make a favor to Blad to join the mafia',
    completed: false
  }
  const todoAfter = {
    id: 0,
    text: 'Make a favor to Blad to join the mafia',
    completed: true
  }

  deepFreeze(todoBefore)

  expect(
    toogleTodo(todoBefore)
  ).toEqual(todoAfter)
}

testToogleTodo()

console.log('All tests clear')