Skip to content

Commit 5bcfc63

Browse files
author
Vitalii Telychko
committed
destr
1 parent ae3dcad commit 5bcfc63

File tree

12 files changed

+234
-5
lines changed

12 files changed

+234
-5
lines changed

‎ES6/Destructuring/destructuring_algorithm.js

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
// Destructuring as a recursive pattern matching algorithm.
2+
// 1. «pattern» = «value»
3+
// 2. Rule - {key: «pattern», «properties»} ← obj => (Object Pattern)
4+
// «pattern» ← obj.key
5+
// {«properties»} ← obj
6+
// || {} ← obj (no properties left)
7+
// 3. Description
8+
// The effect of this rule is that execution continues with the property value pattern being matched
9+
// against obj.key and the remaining properties being matched against obj.
10+
11+
// 1. Variable Pattern
12+
// x ← value (including undefined and null)
13+
// x = value
14+
15+
// 2. Object Pattern
16+
// {«properties»} ← undefined || null (throw new TypeError())
17+
// {key: «pattern» = default_value, «properties»} ← obj
18+
19+
// const tmp = obj.key;
20+
// if(tmp !== undefined) {
21+
// «pattern» ← tmp
22+
// } else {
23+
// «pattern» ← default_value
24+
// }
25+
// {«properties»} ← obj
26+
27+
// 3. Array Pattern => the same

‎ES6/Destructuring/features.js

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
// rest operator (not as spread operator)
2+
// const [x, ...[y, z]] = ['a', 'b', 'c'];
3+
// console.log(x, y, z);
4+
// // x = 'a'; y = 'b'; z = 'c'
5+
6+
// Examples:
7+
8+
// const obj = {};
9+
// [first, ...obj.prop] = ['a', 'b', 'c'];
10+
11+
// const arr = [];
12+
// ({ bar: arr[0] } = { bar: true });
13+
14+
// DO NOT DO THAT
15+
// { a, b } = someObject; BAD
16+
// ({ a, b } = someObject); OK
17+
// ({ a, b }) = someObject; BAD

‎ES6/Destructuring/overview.js

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
// 1. Object destructuring
2+
// const obj = { first: 'Vitalii', last: 'Telychko' };
3+
// const { first: f, last: l } = obj;
4+
// console.log(f, l);
5+
6+
// const obj = { foo: 123 };
7+
// const { writable, configurable } = Object.getOwnPropertyDescriptor(obj, 'foo');
8+
// console.log(writable, configurable);
9+
10+
// 2. Array destructuring
11+
// const iterable = ['a', 'b'];
12+
// const [x, y] = iterable;
13+
14+
// 3. for-of
15+
// const arr = ['a', 'b'];
16+
// for(const [index, element] of arr.entries()) {
17+
// console.log(index, element);
18+
// }

‎ES6/Destructuring/patterns.js

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
// 1. The object pattern coerces destructuring sources to objects before accessing properties.
2+
// That means that it works with primitive values:
3+
// const { length: len } = 'abc';
4+
// console.log(len);
5+
6+
// 2. Array patterns work with iterables
7+
// const [x,...y] = 'abc';
8+
// const [x,y] = new Set(['a', 'b']); // x='a'; y='b’;
9+
// console.log(x, y);
10+
11+
// 3. Empty objects, null and undefined are not iterable
12+
// [] = {}; // TypeError, empty objects are not iterable
13+
// [] = undefined; // TypeError, not iterable
14+
// [] = null; TypeError, not iterable
15+
16+
// 4. Default values for patterns
17+
// const [{ prop: x } = {}] = [];
18+
// console.log(x); // undefined
19+
// const [{ prop: x } = { prop: 123 }] = [];
20+
// const { prop: x } = { prop: 123 }
21+
// console.log(x); // 123

‎ES6/Parameter_handling/overview.js

Whitespace-only changes.

‎ES6/Template_literals/basics.js

+43
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
// 1. String Interpolation
2+
3+
// // ES5
4+
//
5+
// function printCoord(x, y) {
6+
// console.log('('+x+', '+y+')');
7+
// }
8+
//
9+
// // ES6
10+
//
11+
// function printCoord(x, y) {
12+
// console.log(`(${x}, ${y})`);
13+
// }
14+
15+
16+
// 2. Multi-line strings
17+
18+
// ES5
19+
20+
// var HTML5_SKELETON =
21+
// '<!doctype html>\n' +
22+
// '<html>\n' +
23+
// '<head>\n' +
24+
// ' <meta charset="UTF-8">\n' +
25+
// ' <title></title>\n' +
26+
// '</head>\n' +
27+
// '<body>\n' +
28+
// '</body>\n' +
29+
// '</html>\n';
30+
31+
32+
// ES6
33+
34+
// const HTML5_SKELETON = `
35+
// <!doctype html>
36+
// <html>
37+
// <head>
38+
// <meta charset="UTF-8">
39+
// <title></title>
40+
// </head>
41+
// <body>
42+
// </body>
43+
// </html>`;

‎ES6/Template_literals/itearting_over_strings.js

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
// for(const ch of 'abc') {
2+
// console.log(ch);
3+
// }
4+
//
5+
// const chars = [...'abc'];
6+
// console.log(chars);

‎ES6/Template_literals/new_string_methods.js

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
// From indexOf to startsWith:
2+
//
3+
// if (str.indexOf('x') === 0) {} // ES5
4+
// if (str.startsWith('x')) {} // ES6
5+
// From indexOf to endsWith:
6+
//
7+
// function endsWith(str, suffix) { // ES5
8+
// var index = str.indexOf(suffix);
9+
// return index >= 0
10+
// && index === str.length-suffix.length;
11+
// }
12+
// str.endsWith(suffix); // ES6
13+
// From indexOf to includes:
14+
//
15+
// if (str.indexOf('x') >= 0) {} // ES5
16+
// if (str.includes('x')) {} // ES6
17+
// From join to repeat (the ES5 way of repeating a string is more of a hack):
18+
//
19+
// new Array(3+1).join('#') // ES5
20+
// '#'.repeat(3) // ES6

‎ES6/Template_literals/overview.js

+71
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
// 1. Template Literals
2+
// are string literals that can stretch across multiple lines and include interpolated expressions (inserted via ${···}):
3+
4+
// const firstName = `Jane`;
5+
// console.log(`Hello ${firstName}!
6+
// How are
7+
// you?
8+
// `);
9+
10+
// 2. Tagged template literals (short: tagged templates) are created by mentioning a function before a template literal
11+
// The common usages of tag functions is getting the raw data out of template string.
12+
13+
// function fmtDate(strings, date) {
14+
// const str0 = strings[0], str1 = strings[1];
15+
// console.log(strings)
16+
// const strDate = new Intl.DateTimeFormat('en-US').format(date);
17+
// console.log(`${str0}${strDate}${str1}`);
18+
// return `${str0}${strDate}${str1}`;
19+
// }
20+
//
21+
// fmtDate`Today is ${new Date()}`;
22+
23+
// console.log(String.raw`first ${new Date()}`)
24+
25+
// 3. A tag function for HTML templating
26+
27+
// function html(templateObject, ...substs) {
28+
// console.log(substs);
29+
// const raw = templateObject.raw;
30+
//
31+
// let result = '';
32+
//
33+
// substs.forEach((subst, i) => {
34+
// let lit = raw[i];
35+
// if (Array.isArray(subst)) {
36+
// subst = subst.join('');
37+
// }
38+
//
39+
// if (lit.endsWith('!')) {
40+
// subst = htmlEscape(subst);
41+
// lit = lit.slice(0, -1);
42+
// }
43+
// result += lit;
44+
// result += subst;
45+
// });
46+
// result += raw[raw.length - 1]; // (A)
47+
// return result;
48+
// }
49+
//
50+
// function htmlEscape(str) {
51+
// return str.replace(/&/g, '&amp;') // first!
52+
// .replace(/>/g, '&gt;')
53+
// .replace(/</g, '&lt;')
54+
// .replace(/"/g, '&quot;')
55+
// .replace(/'/g, '&#39;')
56+
// .replace(/`/g, '&#96;');
57+
// }
58+
//
59+
// const tmpl = addrs => html`
60+
// <table>
61+
// ${addrs.map(addr => html`
62+
// <tr><td>!${addr.first}</td></tr>
63+
// <tr><td>!${addr.last}</td></tr>
64+
// `)}
65+
// </table>
66+
// `;
67+
// const data = [
68+
// { first: '<Jane>', last: 'Bond' },
69+
// { first: 'Lars', last: '<Croft>' },
70+
// ];
71+
// console.log(tmpl(data));

‎ES6/Variables_and_scoping/class_declaration.js

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
// const identity = x => x;
2+
//
3+
// // Here we are in the temporal dead zone of `MyClass`
4+
// const inst = new MyClass(); // ReferenceError
5+
// console.log(inst);
6+
//
7+
// // Note the expression in the `extends` clause
8+
// class MyClass extends identity(Object) {
9+
// }

‎ES6/Variables_and_scoping/parameters_as_fn.js

+1-4
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,4 @@
4040
// const foo = 'inner';
4141
// console.log(func()); // outer
4242
// }
43-
// bar();
44-
45-
let a = 5;
46-
console.log(window);
43+
// bar();

‎index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,6 @@
1010

1111
<div id="content"></div>
1212

13-
<script src="ES6/Variables_and_scoping/parameters_as_fn.js"></script>
13+
<script src="ES6/Parameter_handling/"></script>
1414
</body>
1515
</html>

0 commit comments

Comments
 (0)