├── .gitignore
├── LICENSE
├── README.md
├── assets
└── css
│ └── main.css
├── exercises
├── example
│ ├── example.js
│ └── example.spec.js
├── fizzbuzz
│ ├── main.js
│ └── main.spec.js
└── todolist
│ ├── InMemoryStore.js
│ ├── LocaStorageStore.js
│ ├── final-way.js
│ ├── homework.md
│ ├── index.html
│ ├── main.css
│ ├── main.js
│ ├── simplified
│ ├── index.html
│ └── scripts.js
│ └── utils.js
├── notes
├── Basics.md
└── Errors.md
└── package.json
/.gitignore:
--------------------------------------------------------------------------------
1 | # OSX
2 | .DS_Store
3 |
4 | # Logs
5 | logs
6 | *.log
7 | npm-debug.log*
8 | yarn-debug.log*
9 | yarn-error.log*
10 | package-lock.json
11 |
12 | # Runtime data
13 | pids
14 | *.pid
15 | *.seed
16 | *.pid.lock
17 |
18 | # Directory for instrumented libs generated by jscoverage/JSCover
19 | lib-cov
20 |
21 | # Coverage directory used by tools like istanbul
22 | coverage
23 |
24 | # nyc test coverage
25 | .nyc_output
26 |
27 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
28 | .grunt
29 |
30 | # Bower dependency directory (https://bower.io/)
31 | bower_components
32 |
33 | # node-waf configuration
34 | .lock-wscript
35 |
36 | # Compiled binary addons (https://nodejs.org/api/addons.html)
37 | build/Release
38 |
39 | # Dependency directories
40 | node_modules/
41 | jspm_packages/
42 |
43 | # Typescript v1 declaration files
44 | typings/
45 |
46 | # Optional npm cache directory
47 | .npm
48 |
49 | # Optional eslint cache
50 | .eslintcache
51 |
52 | # Optional REPL history
53 | .node_repl_history
54 |
55 | # Output of 'npm pack'
56 | *.tgz
57 |
58 | # Yarn Integrity file
59 | .yarn-integrity
60 |
61 | # dotenv environment variables file
62 | .env
63 |
64 | # next.js build output
65 | .next
66 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2018 Ignacio Villanueva
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # My JavaScript Path
2 |
3 | My JavaScript Path: everything I do while learning
4 |
5 | ## Exercises
6 |
7 | 1. [Todo List](/exercises/todolist/main.js)
8 | 1. [Fizzbuzz](/exercises/fizzbuzz/main.js)
9 |
10 | ## Katas
11 |
12 | 1. [Mastermind](https://github.com/IgnaciodeNuevo/kata-mastermind)
13 | 1. [Tamagotchi](https://github.com/IgnaciodeNuevo/kata-tamagochi)
14 | 1. 08/10/2018 - [Clock-in](https://github.com/IgnaciodeNuevo/kata-clock-in)
15 |
16 | ## Workshops
17 |
18 | 1 30/03/2019 - [AdaJS Barcelona TDD Workshop](https://github.com/IgnaciodeNuevo/AdaJS-TDD-Workshop)
19 |
20 | ## Notes
21 |
22 | 1. [JavaScript Common Errors](/notes/Errors.md)
23 | 1. [JavaScript Basics](/notes/Basics.md)
24 |
--------------------------------------------------------------------------------
/assets/css/main.css:
--------------------------------------------------------------------------------
1 | body {
2 | border: 0;
3 | margin: 0;
4 | padding: 1rem;
5 | }
6 |
7 | button {
8 | background-color: #0047bb;
9 | border-radius: 3px;
10 | border: 0;
11 | color: #fff;
12 | cursor: pointer;
13 | height: 42px;
14 | text-align: center;
15 | transition: background-color 0.2s ease, border 0.2s ease;
16 | }
17 |
18 | button:hover {
19 | background-color: #003488;
20 | }
21 |
22 | button:not(:last-of-type) {
23 | margin-right: 0.5rem;
24 | }
25 |
26 | button {
27 | font-size: 1.2rem;
28 | padding: 0.5rem;
29 | }
30 |
31 | input[type='text'] {
32 | border: 0;
33 | border-bottom: 2px solid #003488;
34 | font-size: 1.2rem;
35 | padding-top: 0.5rem;
36 | padding-bottom: 0.5rem;
37 | }
38 |
39 | label {
40 | display: block;
41 | font-size: 1.2rem;
42 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
43 | 'Open Sans', 'Helvetica Neue', sans-serif;
44 | margin-top: 0.5rem;
45 | }
46 |
--------------------------------------------------------------------------------
/exercises/example/example.js:
--------------------------------------------------------------------------------
1 | // Create a program that tells you if a number is pair or even
2 | function isPair(number) {
3 | return number % 2 == 0;
4 | }
5 |
6 | // This line allows to export on node module and acts as guard for the browser
7 | if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
8 | module.exports = isPair;
9 | }
10 |
--------------------------------------------------------------------------------
/exercises/example/example.spec.js:
--------------------------------------------------------------------------------
1 | var isPair = require('./example');
2 |
3 | describe('isPair', function() {
4 | it('Should return true for a pair number', function() {
5 | expect(isPair(2)).toBe(true);
6 | });
7 |
8 | it('Should return false for an even number', function() {
9 | expect(isPair(1)).toBe(false);
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/exercises/fizzbuzz/main.js:
--------------------------------------------------------------------------------
1 | function fizzBuzz(number) {
2 | if (number === 0) {
3 | return 'Fail!';
4 | }
5 |
6 | if (number % 3 === 0 && number % 5 === 0) {
7 | return 'fizzbuzz';
8 | } else if (number % 3 === 0) {
9 | return 'fizz';
10 | } else if (number % 5 === 0) {
11 | return 'buzz';
12 | } else {
13 | return 'Fail!';
14 | }
15 | }
16 |
17 | // This line allows to export on node module and acts as guard for the browser
18 | if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
19 | module.exports = fizzBuzz;
20 | }
21 |
--------------------------------------------------------------------------------
/exercises/fizzbuzz/main.spec.js:
--------------------------------------------------------------------------------
1 | var fizzBuzz = require('./main');
2 |
3 | describe('fizzBuzz', function() {
4 | it('Should return fizzbuzz string if divisible by 3 and by 5', function() {
5 | expect(fizzBuzz(15)).toBe('fizzbuzz');
6 | });
7 |
8 | it('Should return fizz string if divisible by 3', function() {
9 | expect(fizzBuzz(9)).toBe('fizz');
10 | });
11 |
12 | it('Should return buzz if divisible by 5', function() {
13 | expect(fizzBuzz(100000)).toBe('buzz');
14 | });
15 |
16 | it('Should return Fail! string if is not divisible by 3 or by 5', function() {
17 | expect(fizzBuzz(0)).toBe('Fail!');
18 | });
19 |
20 | it('Should return Fail! string if is not divisible by 3 or by 5', function() {
21 | expect(fizzBuzz(-0)).toBe('Fail!');
22 | });
23 |
24 | it('Should return Fail! string if is not divisible by 3 or by 5', function() {
25 | expect(fizzBuzz(-3)).toBe('fizz');
26 | });
27 | });
28 |
--------------------------------------------------------------------------------
/exercises/todolist/InMemoryStore.js:
--------------------------------------------------------------------------------
1 | //Module pattern or revealed module pattern
2 | const Api = (function() {
3 | let todos = [];
4 | const add = function(item) {
5 | item.id = guid();
6 | todos.push(item);
7 | return Promise.resolve(todos);
8 | };
9 |
10 | const get = function() {
11 | return Promise.resolve(todos);
12 | };
13 |
14 | const getById = function(id) {
15 | let item;
16 | for (let i = 0; i < todos.length; i++) {
17 | if (todos[i].id == id) {
18 | item = todos[i];
19 | }
20 | }
21 | return Promise.resolve(item);
22 | };
23 |
24 | const update = function(item) {
25 | for (let i = 0; i < todos.length; i++) {
26 | if (todos[i].id == item.id) {
27 | todos[i] = item;
28 | }
29 | }
30 | return Promise.resolve(todos);
31 | };
32 |
33 | const clear = function() {
34 | todos = [];
35 |
36 | return Promise.resolve();
37 | };
38 |
39 | return {
40 | addTodo: add,
41 | getTodos: get,
42 | clearTodos: clear,
43 | getTodoById: getById,
44 | updateTodo: update,
45 | };
46 | })();
47 |
--------------------------------------------------------------------------------
/exercises/todolist/LocaStorageStore.js:
--------------------------------------------------------------------------------
1 | //Module pattern or revealed module pattern
2 | const Api = (function() {
3 | let todos = JSON.parse(localStorage.getItem('todoListDataBase')) || [];
4 |
5 | const add = function(item) {
6 | item.id = guid();
7 | todos.push(item);
8 |
9 | localStorage.setItem('todoListDataBase', JSON.stringify(todos));
10 | return Promise.resolve(todos);
11 | };
12 |
13 | const get = function() {
14 | return Promise.resolve(todos);
15 | };
16 |
17 | const getById = function(id) {
18 | let item;
19 | for (let i = 0; i < todos.length; i++) {
20 | if (todos[i].id == id) {
21 | item = todos[i];
22 | }
23 | }
24 | return Promise.resolve(item);
25 | };
26 |
27 | const update = function(item) {
28 | for (let i = 0; i < todos.length; i++) {
29 | if (todos[i].id == item.id) {
30 | todos[i] = item;
31 | }
32 | }
33 |
34 | localStorage.setItem('todoListDataBase', JSON.stringify(todos));
35 | return Promise.resolve(todos);
36 | };
37 |
38 | const clear = function() {
39 | todos = [];
40 |
41 | localStorage.setItem('todoListDataBase', JSON.stringify(todos));
42 | return Promise.resolve();
43 | };
44 |
45 | return {
46 | addTodo: add,
47 | getTodos: get,
48 | clearTodos: clear,
49 | getTodoById: getById,
50 | updateTodo: update,
51 | };
52 | })();
53 |
--------------------------------------------------------------------------------
/exercises/todolist/final-way.js:
--------------------------------------------------------------------------------
1 | const todoList = document.getElementById('todo-list');
2 | const clearButton = document.querySelector('.js-clear-storage');
3 | const form = document.querySelector('form');
4 |
5 | const api = new Api();
6 |
7 | const components = [
8 | //funciones constructoras
9 | new AddToDoListCompenent(api),
10 | new ToDoListCompenent(api),
11 | new ClearCompenent(api)
12 | ];
13 |
14 | components.forEach(function (component) {
15 | component.init();
16 | })
17 |
18 | // Función constructora
19 | var API = function () {
20 | // Al asignar that al this dentro de la Función
21 | // tenemos acceso, en este caso a los métodos que exponemos
22 | var that = this;
23 | var todos = [];
24 |
25 | that.add = function (item) {
26 | todos.push(item);
27 | };
28 | }
29 |
30 | var myTodos1 = new API();
31 | myTodos1.add('ignacio');
32 |
33 | var myTodos2 = new API();
34 | myTodos2.add('alfredo');
35 |
--------------------------------------------------------------------------------
/exercises/todolist/homework.md:
--------------------------------------------------------------------------------
1 | # Ejercicios
2 |
3 | ## Ejercicio 1
4 | ```
5 |
9 |
10 |
20 | ```
21 |
22 |
23 |
24 | ## Ejercicio 2
25 | cambiar la declaracion de funciones en vez de:
26 | * function drawTodos(todos) {}
27 | * usar:
28 | * const drawTodos = function(todos)....
29 |
30 |
31 |
32 | ## Ejercicio 3
33 | Agregar un boton de añadir
34 |
35 |
36 |
37 | ## Ejercicio 4
38 | En la funcion draw hay dos fors
39 | * sustituir el primero por map
40 | * sustituir el segundo por forEach
41 |
42 |
43 |
44 | ## Ejercicio 5
45 | main.js tiene que tener el minimo de codigo posible
46 | Tiene que:
47 | * inicializar el api
48 | * inicializar componente añadir item
49 | * inicializar componente clear
50 | * inicializar componente listado de items
51 |
52 |
53 |
54 | ## Ejercicio Opcional
55 | hacer que inmemory grabe en el localstorage
56 |
57 | * sin tener ninguna al referencia al local storage
58 | * main.js tampoco tenga una referencia al localstorage
59 |
--------------------------------------------------------------------------------
/exercises/todolist/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 | Todo List
11 |
12 |
13 |
14 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
--------------------------------------------------------------------------------
/exercises/todolist/main.css:
--------------------------------------------------------------------------------
1 | legend {
2 | color: #003488;
3 | display: block;
4 | font-size: 1.2rem;
5 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
6 | 'Open Sans', 'Helvetica Neue', sans-serif;
7 | font-weight: 700;
8 | margin-top: 2rem;
9 | text-transform: uppercase;
10 | }
11 |
12 | button,
13 | input {
14 | margin-right: 0.5rem;
15 | }
16 |
17 | fieldset {
18 | border: 0;
19 | margin-top: 0.5rem;
20 | padding: 0;
21 | }
22 |
--------------------------------------------------------------------------------
/exercises/todolist/main.js:
--------------------------------------------------------------------------------
1 | const todoList = document.getElementById('todo-list');
2 | const clearButton = document.querySelector('.js-clear-storage');
3 | const form = document.querySelector('form');
4 |
5 | const api = Api;
6 |
7 | init();
8 |
9 | function init() {
10 | api.getTodos().then(function(todos) {
11 | drawTodos(todos);
12 | });
13 | }
14 |
15 | function drawTodos(todos) {
16 | let content = '';
17 | for (let i = 0; i < todos.length; i++) {
18 | content += `
19 | `;
23 | }
24 |
25 | todoList.innerHTML = content;
26 |
27 | for (let i = 0; i < todos.length; i++) {
28 | document
29 | .querySelector(`[data-guid="${todos[i].id}"]`)
30 | .addEventListener('change', function () {
31 | console.log('oatata');
32 | toggleTodo(todos[i].id);
33 | });
34 | }
35 | }
36 |
37 | function clearInput() {
38 | document.getElementById('target').value = '';
39 | }
40 |
41 | function updateTodo(item) {
42 | api.updateTodo(item).then(todos => {
43 | drawTodos(todos);
44 | clearInput();
45 | });
46 | }
47 |
48 | function toggleTodo(id) {
49 | api.getTodoById(id).then(item => {
50 | item.checked = !item.checked;
51 | api.updateTodo(item).then(todos => {
52 | drawTodos(todos);
53 | });
54 | });
55 | }
56 |
57 | clearButton.addEventListener('click', function() {
58 | api.clearTodos();
59 | init();
60 | });
61 |
62 | form.addEventListener('submit', function(e) {
63 | e.preventDefault();
64 | const value = document.getElementById('target').value;
65 | if (value === '') {
66 | return;
67 | }
68 |
69 | api.addTodo({ checked: false, value: value }).then(todos => {
70 | drawTodos(todos);
71 | clearInput();
72 | });
73 | });
74 |
--------------------------------------------------------------------------------
/exercises/todolist/simplified/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 | Todo List
11 |
12 |
13 |
14 |
15 |
18 |
19 | Items
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
--------------------------------------------------------------------------------
/exercises/todolist/simplified/scripts.js:
--------------------------------------------------------------------------------
1 | const form = document.querySelector('form');
2 | const ul = document.querySelector('ul');
3 | const button = document.querySelector('button');
4 | const input = document.getElementById('item');
5 | let itemsArray = localStorage.getItem('items') ? JSON.parse(localStorage.getItem('items')) : [];
6 |
7 | localStorage.setItem('items', JSON.stringify(itemsArray));
8 | const data = JSON.parse(localStorage.getItem('items'));
9 |
10 | const liMaker = (text) => {
11 | const li = document.createElement('li');
12 | li.textContent = text;
13 | ul.appendChild(li);
14 | }
15 |
16 | form.addEventListener('submit', function (e) {
17 | e.preventDefault();
18 |
19 | itemsArray.push(input.value);
20 | localStorage.setItem('items', JSON.stringify(itemsArray));
21 | liMaker(input.value);
22 | input.value = "";
23 | });
24 |
25 | data.forEach(item => {
26 | liMaker(item);
27 | });
28 |
29 | button.addEventListener('click', function () {
30 | localStorage.clear();
31 | while (ul.firstChild) {
32 | ul.removeChild(ul.firstChild);
33 | }
34 | });
35 |
--------------------------------------------------------------------------------
/exercises/todolist/utils.js:
--------------------------------------------------------------------------------
1 | function guid() {
2 | function s4() {
3 | const max_int = 65536;
4 | return Math.floor((1 + Math.random()) * max_int)
5 | .toString(16)
6 | .substring(1);
7 | }
8 | return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
9 | }
10 |
--------------------------------------------------------------------------------
/notes/Basics.md:
--------------------------------------------------------------------------------
1 | # JavaScript Basics
2 |
3 | ## LocalStorage
4 |
5 | localStorage is a key: value pair
6 |
7 | | Method | Description |
8 | | ------------- |:----------------------------------:|
9 | | setItem() | Add key and value to local storage |
10 | | getItem() | Retrieve a value by the key |
11 | | removeItem() | Remove an item by key |
12 | | clear() | Clear all storage |
13 |
14 | ### Usage
15 |
16 | **setItem()**
17 |
18 | `localStorage.setItem('key', 'value');`
19 |
20 | **getItem()**
21 |
22 | `localStorage.getItem('key');`
23 |
24 | **removeItem()**
25 |
26 | `localStorage.removeItem('key');`
27 |
28 | **clear()**
29 |
30 | `localStorage.clear();`
31 |
32 | ## JavaScript Methods
33 |
34 | ### [.parse()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse)
35 |
36 | `JSON.parse()`: parses a JSON string, constructing the JavaScript value or object described by the string. An optional reviver function can be provided to perform a transformation on the resulting object before it is returned.
37 |
38 | ```
39 | var json = '{"result":true, "count":42}';
40 | obj = JSON.parse(json);
41 |
42 | console.log(obj.count);
43 | // expected output: 42
44 |
45 | console.log(obj.result);
46 | // expected output: true
47 | ```
48 |
49 | ### [.slice()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/slice)
50 |
51 | `variable.slice(beginIndex, endIndex)`: extracts a section of a string and returns it as a new string, without modifying the original string. The first number (`beginIndex`) in parentheses is the nombre of the character that begins the slice, and the second number (`endIndex`) is the number of the character after the last character in the slice.
52 |
53 | ```
54 | var name = 'Carlos y Juan son amigos';
55 | var nameResult = name.slice(0, 13);
56 |
57 | console.log(nameResult);
58 | // expected output: Carlos y Juan
59 | ```
60 |
61 | ### [.toUpperCase()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/toUpperCase)
62 |
63 | - Used in: *string*.
64 |
65 | `variable.toUpperCase()`: returns the calling string value converted to uppercase (the value will be converted to a string if it isn't one).
66 |
67 | ```
68 | var name = 'patata';
69 | var name = name.toUpperCase;
70 |
71 | console.log(name);
72 | // expected output: PATATA
73 | ```
74 |
75 | ### [.toLowerCase()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/toLowerCase)
76 |
77 | Used in: *string*.
78 |
79 | `variable.toLowerCase()`: returns the calling string value converted to lower case.
80 |
81 | ```
82 | var name = 'PATATA';
83 | var name = name.toUpperCase;
84 |
85 | console.log(name);
86 | // expected output: patata
87 | ```
88 |
89 | ### [.push()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
90 |
91 | - Used in: *array*.
92 | - Modifies the array: *yes*
93 |
94 | `array.push(item)`: adds one or more elements to the end of an array and returns the new length of the array.
95 |
96 | ```
97 | var animals = ['pigs', 'goats', 'sheep'];
98 | var item = 'cow';
99 | animals.push(item);
100 |
101 | // expected output: [ "pigs", "goats", "sheep", "cow" ]
102 | ```
103 |
104 | ### [.unshift()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/unshift)
105 |
106 | - Used in: *array*.
107 | - Modifies the array: *yes*
108 |
109 | `array.push(item)`: adds one or more elements to the beginning of an array and returns the new length of the array.
110 |
111 | ```
112 | var array1 = [1, 2, 3];
113 | var array2 = 0;
114 | array1.unshift(array2);
115 |
116 | // expected output: Array [0, 1, 2, 3]
117 | ```
118 |
119 | ### [.pop()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/pop)
120 |
121 | - Used in: *array*.
122 | - Modifies the array: *yes*
123 |
124 | `array.pop(item)`: removes the last element from an array and returns that element. This method changes the length of the array.
125 |
126 | ```
127 | var plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];
128 |
129 | console.log(plants.pop());
130 | // expected output: "tomato"
131 | ```
132 |
133 |
134 | ### [.shift()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/shift)
135 |
136 | - Used in: *array*.
137 | - Modifies the array: *yes*
138 |
139 | `array.shift(item)`: removes the first element from an array and returns that removed element. This method changes the length of the array.
140 |
141 | ```
142 | var array1 = [1, 2, 3];
143 | var firstElement = array1.shift();
144 |
145 | console.log(array1);
146 | // expected output: Array [2, 3]
147 | ```
148 |
149 |
150 |
151 | ### [.concat()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat)
152 |
153 | - Used in: *array*.
154 | - Modifies the array: *no*
155 |
156 | `array.concat(otherArray)`: is used to merge two or more arrays. This method does not change the existing arrays, but instead returns a new array.
157 |
158 | ```
159 | var array1 = ['a', 'b', 'c'];
160 | var array2 = ['d', 'e', 'f'];
161 |
162 | console.log(array1.concat(array2));
163 | // expected output: Array ["a", "b", "c", "d", "e", "f"]
164 | ```
165 |
166 |
167 | ### [.indexOf()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf)
168 |
169 | - Used in: *string or array*.
170 |
171 | `array.indexOf(otherArray)`: is used to merge two or more arrays. This method does not change the existing arrays, but instead returns a new array.
172 |
173 | ```
174 | var paragraph = ['red', 'pink', 'orange'];
175 | var res = paragraph.indexOf('pink');
176 |
177 | // expected output: 1
178 | ```
179 |
180 |
181 |
182 | ### [.join()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
183 |
184 | - Used in: *array*.
185 |
186 | `array.join()`: creates and returns a new string by concatenating all of the elements in an array (or an array-like object), separated by commas or a specified separator string. If the array has only one item, then that item will be returned without using the separator.
187 |
188 | ```
189 | var paragraph = ['red', 'pink', 'orange'];
190 | var res = paragraph.join();
191 | console.log(res);
192 |
193 | // expected output: 'red, pink, orange';
194 |
195 | var paragraph = ['red', 'pink', 'orange'];
196 | var res = paragraph.join('-');
197 | console.log(res);
198 |
199 | // expected output: 'red-pink-orange';
200 | ```
201 |
202 | ## How to organize your JavaScript Classes
203 |
204 | - Business logic: where you calculate based on the data you have
205 | - Persistence: where you store the data you have
206 | - UI: where you get or paint data in the interface
207 |
208 |
209 | ## Falsy values
210 |
211 | - false
212 | - null
213 | - undefined
214 | - NaN
215 | - number 0
216 | - empty string ""
217 |
218 |
219 | ## null vs undefined
220 |
221 | - null: value of nothing
222 | - undefined: absence of value
223 |
224 | ## Async Cheatsheet
225 |
226 | - [Async Cheatsheet](https://raw.githubusercontent.com/frontarm/async-javascript-cheatsheet/master/async-cheatsheet.png)
227 |
--------------------------------------------------------------------------------
/notes/Errors.md:
--------------------------------------------------------------------------------
1 | # Common JavaScript Errors
2 |
3 | ## Via [Ana Tudor](https://twitter.com/anatudor/status/965838510765862913)
4 |
5 | * Don't add/ remove elements directly to a wrapper within a loop! Use [documentFragment](https://developer.mozilla.org/en-US/docs/Web/API) instead.
6 |
7 | 
8 | 
9 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "js-path",
3 | "version": "1.0.0",
4 | "description": "JavaScript Path: exercises, notes and tests.",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "jasmine-node exercises/"
8 | },
9 | "repository": {
10 | "type": "git",
11 | "url": "git+https://github.com/IgnaciodeNuevo/js-path.git"
12 | },
13 | "author": "Ignacio Villanueva",
14 | "license": "MIT",
15 | "bugs": {
16 | "url": "https://github.com/IgnaciodeNuevo/js-path/issues"
17 | },
18 | "homepage": "https://github.com/IgnaciodeNuevo/js-path#readme",
19 | "dependencies": {
20 | "jasmine": "^3.0.0",
21 | "jasmine-node": "^1.14.5"
22 | }
23 | }
24 |
--------------------------------------------------------------------------------