ES6 - redutan/redutan.github.io GitHub Wiki
๋ฆฌํฐ๋ด, ๋ณ์, ์์, ๋ฐ์ดํฐ ํ์
๋ณ์(es6)
let currentTempC = 22;
currentTempC = 23;
let targetTempC, root1 = "conrerence_room_a", room2 = "lobby";
์์(es6)
// ์์
const ZERO = 0;
const ROOM_TEMP_C = 21.5, MAX_TEMP_C = 30;
๋ฆฌํฐ๋ด
// ๋ฌธ์์ด ๋ฆฌํฐ๋ด
let room1 = "conference_room_a";
// ๊ฐ์ฒด ๋ฆฌํฐ๋ด
let obj = {};
// ๋ฐฐ์ด ๋ฆฌํฐ๋ด
let objs = [];
์์ํ์ (primitive)๊ณผ ๊ฐ์ฒด(ojbect) ํ์
์์ํ์
-
๋ถ๋ณ, call by value
-
number(Double)
-
string
-
boolean
-
null
-
undefined
-
Symbol
๊ฐ์ฒด(object)
Array
Date
RegExp
Map
,WeakMap
(since es6)Set
,WeakSet
(since es6)
์ซ์
let count = 10;
const = blue = 0x0000ff; // 16์ง์
const = umask = 0o0022; // 8์ง์
const rommTemp = 21.5 // 10์ง์
const c = 3.0e6; // ์ง์ (3.0 * 10^6 = 3,000,000)
const e = -1.6e-19 // ์ง์ (-1.6 * 10^-19 = 0.00000000000000000016)
const inf = Infinity;
const ninf = -Infinity;
const nam = NaN;
Number
const small = Number.EPSILON; // ๋ถ๋์์์ ์ฐ์ฐ ๊ทผ์ฌ์น ๋น๊ต๋ฅผ ์ํจ
const maxInt = Number.MAX_SAFE_INTEGER;
const max = Number.MAX_VALUE;
const minInt = Number.MIN_SAFE_INTEGER;
const min = Number.MIN_VALUE;
const nInf = Number.NEGATIVE_INFINITY; // -Infinity
const nan = Number.NaN; // NaN
const inf = Number.POSITIVE_INFINITY; / Infinity
String
escape
const dialog1 = "He looked up and said \"don't do that!\" to Max.";
const dialog2 = 'He looked up and said "don\'t do that!" to Max.';
const s = "In JavaScript, use \\ as an escape character in strings.";
template(es6)
let currentTemp = 19.5;
const message = `The current temperature is ${currentTemp}\u00b0C`;
multiline(es6)
const multiline =
`
line1
line2
`
String, Number
const result1 = 3 + '30'; // '330'
const result2 = 3 * '30'; // 90
Symbol
const RED = Symbol('The color of a sunset!');
const ORANGE = Symbol('The color of a sunset!');
RED !== ORANGE // true; ์ฌ๋ณผ์ ์๋ก ๋ค๋ฆ
๋๋ค.
null, undefined
let currentTemp; // undefined
const targetTemp = null; // null
currentTemp = 19.5; // 19.5
currentTemp = undefined; // undefined. ํ ๋น๋ ๊ฐ์ ๋ค์ undefined๋ฅผ ์ฐ๋ ๊ถ์ฅํ์ง ์์. ์ด๋ จ ๊ฒฝ์ฐ๋ผ๋ฉด null์ ์ฌ์ฉํ๊ธธ ๊ถ์ฅ
Object
const sam3 = {
name: 'Sam',
classification: {
kingdom: 'Anamalia',
phylum: 'Chordata',
class: 'Mamalia',
family: 'Felidae',
},
};
// ์ ๊ทผ
sam3.classification.family;
sam3["classification"].family;
sam3.classification["family"];
sam3["classification"]["family"];
// ์์ฑ ์ ๊ฑฐ
delete sam3.classification
๋ฐ์ดํฐ ํ์ ๋ณํ
To number
const numStr = "33.3";
const num = Number(numStr); // 33.3
const a = parseInt("16 volts", 10); // 16
const b = parseInt("3a", 16); // 58
const c = parseFloat("15.5 kph"); // 15.5
const d = new Date();
const ts = d.valueOf(); // timestamp milliseconds
To string
const n = 33.5 // 33.5
const s = n.toString(); // "33.5"
const arr = [1, true, "hello"];
arr.toString(); // "1,true,hello";
To boolean
const n = 0; // false value
const b1 = !!n; // false
const b2 = Boolean(n); // false
์ฐ์ฐ์
๋น๊ต ์ฐ์ฐ์
==
: ๋๋ฑํจ(loose equality)===
: ์ผ์นํจ(strict equality)
const n = 5;
const s = "5";
n === s; // false(ํ์
์ด ๋ค๋ฆ)
n !== s; // true
n === Number(s); // true
n !== Number(s); // false
n == s // true (๊ถ์ฅํ์ง ์์)
n != s // false(๊ถ์ฅํ์ง ์์)
const a = { name: "an object" };
const b = { name: "an object" };
a === b; // false(๊ฐ์ฒด๋ ํญ์ ๋ค๋ฆ)
a !== b; // true
a == b; // false(๊ถ์ฅํ์ง ์์)
a != b; // true (๊ถ์ฅํ์ง ์์)
์ซ์ ๋น๊ต
let n = 0;
while(true) {
n += 0.1;
console.log(n);
if (n === 0.3) break;
}
console.log(`Stopped at ${n}`);
output : ๋ฌดํ๋ฃจํ๊ฐ ๋๋ค.
let n = 0;
while(true) {
n += 0.1;
if (Math.abs(n - 0.3) < Number.EPSILON) break;
}
console.log(`Stopped at ${n}`);
ouput : Stopped at 0.30000000000000004
๋ ผ๋ฆฌ ์ฐ์ฐ์
๊ฑฐ์ง ๊ฐ์ ๊ฐ
undefined
null
false
0
NaN
""
(๋น ๋ฌธ์์ด)
์ฐธ ๊ฐ์ ๊ฐ
- ๋ชจ๋ ๊ฐ์ฒด,
valueOf()
๋ฉ์๋๋ฅผ ํธ์ถํ์ ๋false
๋ฅผ ๋ฐํํ๋ ๊ฐ์ฒด๋ ์ฐธ ๊ฐ์ ๊ฐ์ ์ํฉ๋๋ค. - ๋ฐฐ์ด, ๋น ๋ฐฐ์ด๋ ์ฐธ ๊ฐ์ ๊ฐ์ ์ํฉ๋๋ค. ํ์ง๋ง
[]
(๋น ๋ฐฐ์ด ๋ฆฌํฐ๋ด)๋ ๊ฑฐ์ง ๊ฐ์ ๊ฐ - ๊ณต๋ฐฑ๋ง ์๋ ๋ฌธ์์ด(
" "
๋ฑ) - ๋ฌธ์์ด
"false"
!!!
boolean ์ฐ์ฐ์
Default pattern
const options = suppliedOptions || { name: "Default" };
์ผํ ์ฐ์ฐ์.
let x = 0, y = 10, z;
z = (x++, y++); // z = x, z = y
consol.log(`${x}, ${y}, ${z}`); // 1, 11, 10
์ฐ์ฐ์ ๊ทธ๋ฃน
typeof
typeof undefined // "undefined"
typeof null // "object" !!!
typeof {} // "object"
typeof [] // "object" !!!
typeof true // "boolean"
typeof 1 // "number"
typeof "" // "string"
typeof Symbol() // "symbol"
typeof function() {} // "function"
ํด์ฒด ํ ๋น(destructuring assignment)
const obj = { b: 2, c: 3, d: 4 };
// ํด์ฒด ํ ๋น
const {a, b, c} = obj;
console.log(a); // undefined
console.log(b); // 2
console.log(c); // 3
console.log(d); // ReferenceError: "d"๋ ์ ์๋์ง ์์์ต๋๋ค.
const arr = [1, 2, 3, 4, 5];
let [x, y, ...rest] = arr;
console.log(x); // 1
console.log(y); // 2
console.log(rest); // [3, 4, 5]
let a = 5, b = 10;
[a, b] = [b, a]
console.log(a); // 10
console.log(b); // 5
ํจ์
ํจ์์ ๋งค๊ฐ๋ณ์
call by value
function f(x) {
console.log(`f ๋ด๋ถ: x = ${x}`);
x = 5;
console.log(`f ๋ด๋ถ: x = ${x} (ํ ๋น ํ)`);
}
let x = 3;
console.log(`f๋ฅผ ํธ์ถํ๊ธฐ ์ : x = ${x}`);
f(x)
console.log(`f๋ฅผ ํธ์ถํ ๋ค์: x = ${x}`);
๊ฒฐ๊ณผ
f๋ฅผ ํธ์ถํ๊ธฐ ์ : x = 3
f ๋ด๋ถ: x = 3
f ๋ด๋ถ: x = 5 (ํ ๋น ํ)
f๋ฅผ ํธ์ถํ ๋ค์: x = 3
call by reference
function f(o) {
o.message = `f ์์์ ์์ ํจ (์ด์ ๊ฐ: '${o.messsage}')`;
}
let o = {
message: "์ด๊ธฐ ๊ฐ"
};
console.log(`f๋ฅผ ํธ์ถํ๊ธฐ ์ : o.message = "${o.message}"`);
f(o);
console.log(`f๋ฅผ ํธ์ถํ ๋ค์: o.message = "${o.message}"`);
๊ฒฐ๊ณผ
f๋ฅผ ํธ์ถํ๊ธฐ ์ : o.message = "์ด๊ธฐ๊ฐ"
f๋ฅผ ํธ์ถํ ๋ค์: o.message = "f ์์์ ์์ ํจ (์ด์ ๊ฐ: '์ด๊ธฐ ๊ฐ');
๋งค๊ฐ๋ณ์ ํด์
๊ฐ์ฒด
function getSentence({ subject, verb, object }) {
return `${subject} ${verb} ${object}`;
}
const o = {
subject: "I",
verb: "love",
object: "JavaScript",
}
getSentence(o); // "I love JavaScript"
๋ฐฐ์ด
function getSentence([ subject, verb, object ]) {
return `${subject} ${verb} ${object}`;
}
const arr = ["I", "love", "JavaScript"];
getSentence(arr); // "I love JavaScript"
ํ์ฐ์ฐ์ฐ์
function addPrefix(prefix, ...words) {
// ๋์ค์ ๋ ์ข์ ๋ฐฉ๋ฒ์ ๋ฐฐ์๋๋ค.
const prefixedWords = [];
for(let i = 0; i < words.length; i++) {
prefixedWords[i] = prefix + words[i];
}
return prefixedWords;
}
addPrefix("con", "vers", "vex"); // ["converse", "convex"]
๋งค๊ฐ๋ณ์ ๊ธฐ๋ณธ๊ฐ
function f(a, b = "default", c = 3) {
return `${a} - ${b} = ${c}`;
}
f(5, 6, 7); // "5 - 6 - 7"
f(5, 6); // "5 - 6 - 3"
f(5); // "5 - default - 3"
f(); // "undefined - default - 3"
๊ฐ์ฒด์ ํ๋กํผํฐ์ธ ํจ์
const o = {
name: "Wallace",
es5Method: function() { return "Woof!"; },
es6Method() { return "Woof!"; },
};