├── 1_basics
    ├── 8_memory.js
    ├── 1_hello_world.js
    ├── 2_comments.js
    ├── 6_hoisting.js
    ├── 16_try_catch.js
    ├── 3_declaring_variable.js
    ├── 4_naming_conventions.js
    ├── 9_if_and_switch.js
    ├── 11_coercion.js
    ├── 14_object.js
    ├── 15_copy_by_value_and_reference.js
    ├── 10_loops.js
    ├── 12_function.js
    ├── 13_must_know_array_functions.js
    ├── 5_data_types.js
    └── 7_operators.js
├── 3_all_about_object
    ├── 8_2_execution_context.html
    ├── 9_2_closure_example.html
    ├── 8_1_execution_context.html
    ├── 1_introduction.js
    ├── 4_using_function_to_create_objects.js
    ├── 6_scope.js
    ├── 7_this.js
    ├── 9_1_closure.js
    ├── 3_immutable_object.js
    ├── 2_property_attribute.js
    └── 5_prototype_chain.js
├── 4_async_programming
    ├── 3_async_await.js
    ├── 1_async_theory.js
    └── 2_callback_hell_and_promise.js
└── 2_class_and_oop
    ├── 5_super_and_override.js
    ├── 1_class_keyword.js
    ├── 2_getter_and_setter.js
    ├── 3_static_keyword.js
    ├── 4_inheritance.js
    └── 6_class_problem.js


/1_basics/8_memory.js:
--------------------------------------------------------------------------------
1 | /**
2 |  * 키노트로 대체
3 |  */


--------------------------------------------------------------------------------
/1_basics/1_hello_world.js:
--------------------------------------------------------------------------------
1 | console.log('Hello World');
2 | console.log('Hello', 'World');


--------------------------------------------------------------------------------
/1_basics/2_comments.js:
--------------------------------------------------------------------------------
1 | // 코멘트를 작성하는 첫번째 방법입니다.
2 | console.log('Hello World'); // 이거는 출력을 해줍니다.
3 | 
4 | /**
5 |  * 이렇게 하면
6 |  * 코멘트를 여러 줄을
7 |  * 작성 할 수 있습니다.
8 |  */


--------------------------------------------------------------------------------
/3_all_about_object/8_2_execution_context.html:
--------------------------------------------------------------------------------
 1 | <script>
 2 |     var number1 = 20;
 3 |     var number2 = 30;
 4 | 
 5 |     function multiply(x, y){
 6 |         var result = x * y;
 7 | 
 8 |         return result;
 9 |     }
10 | 
11 |     var result1 = multiply(number1, number2);
12 |     var result2 = multiply(100, 200);
13 | </script>


--------------------------------------------------------------------------------
/3_all_about_object/9_2_closure_example.html:
--------------------------------------------------------------------------------
 1 | <script>
 2 |     function getNumber(){
 3 |         var number = 5;
 4 | 
 5 |         function innerGetNumber(){
 6 |             return number;
 7 |         }
 8 | 
 9 |         return innerGetNumber;
10 |     }
11 | 
12 |     var runner = getNumber();
13 | 
14 |     console.log(runner());
15 | </script>


--------------------------------------------------------------------------------
/1_basics/6_hoisting.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Hoisting
 3 |  */
 4 | console.log('Hello');
 5 | console.log('World');
 6 | console.log('----------');
 7 | 
 8 | // console.log(name);
 9 | // var name = '코드팩토리';
10 | // console.log(name);
11 | 
12 | /**
13 |  * Hoisting은 무엇인가?
14 |  * 
15 |  * 모든 변수 선언문이 코드의 최상단으로 이동되는 것처럼 느껴지는 현상을 이야기한다.
16 |  */
17 | // var name;
18 | // console.log(name);
19 | // name = '코드팩토리';
20 | // console.log(name);
21 | 
22 | console.log(yuJin);
23 | const yuJin = '안유진';


--------------------------------------------------------------------------------
/3_all_about_object/8_1_execution_context.html:
--------------------------------------------------------------------------------
 1 | <script>
 2 |     function one(){
 3 |         console.log('run one');
 4 |         console.log('run one finished');
 5 |     }
 6 | 
 7 |     function two(){
 8 |         console.log('run two');
 9 |         one();
10 |         console.log('run two finished');
11 |     }
12 | 
13 |     function three(){
14 |         console.log('run three');
15 |         two();
16 |         console.log('run three finished');
17 |     }
18 | 
19 |     three();
20 | </script>


--------------------------------------------------------------------------------
/1_basics/16_try_catch.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * try...catch
 3 |  * 
 4 |  * 1) 발생시킬때 -> 던진다고한다. (throw)
 5 |  * 2) 명시적으로 인지할때 -> 잡는다고 한다. (catch)
 6 |  */
 7 | function runner() {
 8 |     try {
 9 |         console.log('Hello');
10 | 
11 |         // throw new Error('큰 문제가 생겼습니다!');
12 | 
13 |         console.log('Code Factory');
14 |     } catch (e) {
15 |         console.log('---catch---');
16 |         console.log(e);
17 |     } finally {
18 |         console.log('---finally---');
19 |     }
20 | }
21 | runner();


--------------------------------------------------------------------------------
/1_basics/3_declaring_variable.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Variable 선언하기
 3 |  * 
 4 |  * 1) var - 더이상 쓰지 않는다.
 5 |  * 2) let
 6 |  * 3) const
 7 |  */
 8 | var name = '코드팩토리';
 9 | console.log(name);
10 | 
11 | var age = 32;
12 | console.log(age);
13 | 
14 | let ive = '아이브';
15 | console.log(ive);
16 | 
17 | /**
18 |  * let과 var로 선언하면
19 |  * 값을 추후 변경할 수 있다.
20 |  */
21 | ive = '안유진';
22 | console.log(ive);
23 | 
24 | const newJeans = '뉴진스';
25 | console.log(newJeans);
26 | 
27 | // newJeans = '코드팩토리';
28 | 
29 | /**
30 |  * 선언과 할당
31 |  * 
32 |  * 1) 변수의 선언
33 |  * 2) 값의 할당
34 |  */
35 | var name = '코드팩토리';
36 | 
37 | let girlFriend;
38 | console.log(girlFriend);
39 | 
40 | const girlFriend2;


--------------------------------------------------------------------------------
/4_async_programming/3_async_await.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Async / Await
 3 |  */
 4 | const getPromise = (seconds)=> new Promise((resolve, reject) => {
 5 |     setTimeout(()=>{
 6 |         resolve('에러');
 7 |     }, seconds * 1000)
 8 | });
 9 | 
10 | async function runner(){
11 |     try{
12 |         const result1 = await getPromise(1);
13 |         console.log(result1);
14 |         const result2 = await getPromise(2);
15 |         console.log(result2);
16 |         const result3 = await getPromise(1);
17 |         console.log(result3);
18 |     }catch(e){
19 |         console.log('---catch e---');
20 |         console.log(e);
21 |     }finally{
22 |         console.log('---finally---');
23 |     }
24 | }
25 | 
26 | runner();


--------------------------------------------------------------------------------
/3_all_about_object/1_introduction.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * All about objects
 3 |  * 
 4 |  * 객체를 선언할때 사용 할 수 있는 방법들
 5 |  * 1) object를 생성해서 객체 생성 - 기본기 {}
 6 |  * 2) class를 인스턴스화해서 생성 - class와 OOP
 7 |  * 3) function을 사용해서 객체 생성
 8 |  */
 9 | 
10 | const yuJin = {
11 |     name: '안유진',
12 |     year: 2003,
13 | };
14 | console.log(yuJin);
15 | 
16 | class IdolModel{
17 |     name;
18 |     year;
19 | 
20 |     constructor(name, year){
21 |         this.name = name;
22 |         this.year = year;
23 |     }
24 | }
25 | console.log(new IdolModel('안유진', 2003));
26 | 
27 | // 생성자 함수
28 | function IdolFunction(name, year){
29 |     this.name = name;
30 |     this.year = year;
31 | }
32 | 
33 | const gaEul = new IdolFunction('가을', 2002);
34 | console.log(gaEul);


--------------------------------------------------------------------------------
/3_all_about_object/4_using_function_to_create_objects.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Using function to create objects
 3 |  */
 4 | function IdolModel(name, year){
 5 |     if(!new.target){
 6 |         return new IdolModel(name, year);
 7 |     }
 8 | 
 9 |     this.name = name;
10 |     this.year = year;
11 | 
12 |     this.dance = function(){
13 |         return `${this.name}이 춤을 춥니다.`;
14 |     }
15 | }
16 | 
17 | const yuJin = new IdolModel('안유진', 2003);
18 | console.log(yuJin);
19 | // console.log(yuJin.dance());
20 | const yuJin2 = IdolModel('안유진', 2003);
21 | console.log(yuJin2);
22 | // console.log(global.name);
23 | 
24 | const IdolModelArrow = (name, year)=>{
25 |     this.name = name;
26 |     this.year = year;
27 | };
28 | 
29 | const yuJin3 = new IdolModelArrow('안유진', 2003);


--------------------------------------------------------------------------------
/1_basics/4_naming_conventions.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Naming Conventions
 3 |  * 
 4 |  * 변수 이름 지을때
 5 |  * 1) 일반적으로 영어(라틴문자)를 사용하며 문자와 숫자를 모두 사용 할 수 있다.
 6 |  * 2) 특수기호는 언더스코어와 달러를 사용 할 수 있다.
 7 |  * 3) 숫자로 이름을 시작 할 수 없다.
 8 |  *    1Name, 2Hello
 9 |  * 4) 키워드는 변수명으로 사용 할 수 없다.
10 |  *    var const = 'var';
11 |  */
12 | let codeFactory = '코드팩토리';
13 | var $ive = '아이브';
14 | const _yuJin = '안유진';
15 | 
16 | console.log(codeFactory);
17 | console.log($ive);
18 | console.log(_yuJin);
19 | 
20 | // let 1name = 'no';
21 | // let const = 'attention';
22 | 
23 | /**
24 |  * Naming Convention 2
25 |  * 
26 |  * 1) camelCase -> 대부분의 언어에서 많이 사용
27 |  * 2) snake_case -> 파이썬같은 언어에서사용
28 |  * 3) PascalCase -> C# 마이크로소프트 계열의 언어에서 사용함
29 |  */
30 | // 안유진
31 | const anYuJin = '안유진';
32 | console.log(anYuJin);


--------------------------------------------------------------------------------
/4_async_programming/1_async_theory.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Async theory
 3 |  */
 4 | // function longWork() {
 5 | //     const now = new Date();
 6 | 
 7 | //     /**
 8 | //      * milliseconds since epoch
 9 | //      * 1970년도 1월 1일부터 지금 코드가 실행되는 순간까지의 시간을
10 | //      * 밀리초로 반환한다.
11 | //      */
12 | //     const milliseconds = now.getTime();
13 | //     const afterTwoSeconds = milliseconds + 2 * 1000;
14 | 
15 | //     while(new Date().getTime() < afterTwoSeconds){
16 | 
17 | //     }
18 | 
19 | //     console.log('완료');
20 | // }
21 | 
22 | // console.log('Hello');
23 | // longWork();
24 | // console.log('World');
25 | 
26 | function longWork(){
27 |     setTimeout(()=>{
28 |         console.log('완료');
29 |     }, 2000);
30 | }
31 | 
32 | console.log('Hello');
33 | longWork();
34 | console.log('World');


--------------------------------------------------------------------------------
/2_class_and_oop/5_super_and_override.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Super and Override
 3 |  */
 4 | class IdolModel{
 5 |     name;
 6 |     year;
 7 | 
 8 |     constructor(name, year){
 9 |         this.name = name;
10 |         this.year = year;
11 |     }
12 | 
13 |     sayHello(){
14 |         return `안녕하세요 ${this.name}입니다.`;
15 |     }
16 | }
17 | 
18 | class FemaleIdolModel extends IdolModel{
19 |     // 노래 / 춤 
20 |     part;
21 | 
22 |     constructor(name, year, part){
23 |         super(name, year);
24 |         this.part = part;
25 |     }
26 | 
27 |     sayHello(){
28 |         // return `안녕하세요 ${this.name}입니다. ${this.part}를 맡고있습니다.`;
29 |         return `${super.sayHello()} ${this.part}를 맡고있습니다.`;
30 |     }
31 | }
32 | 
33 | const yuJin = new FemaleIdolModel('안유진', 2003, '보컬');
34 | console.log(yuJin);
35 | 
36 | const wonYoung = new IdolModel('장원영', 2002);
37 | console.log(wonYoung);
38 | console.log(wonYoung.sayHello());
39 | console.log(yuJin.sayHello());


--------------------------------------------------------------------------------
/2_class_and_oop/1_class_keyword.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Class Keyword
 3 |  */
 4 | class IdolModel {
 5 |     name;
 6 |     year;
 7 | 
 8 |     constructor(name, year) {
 9 |         this.name = name;
10 |         this.year = year;
11 |     }
12 | 
13 |     sayName(){
14 |         return `안녕하세요 저는 ${this.name}입니다.`;
15 |     }
16 | }
17 | 
18 | // constructor - 생성자
19 | 
20 | const yuJin = new IdolModel('안유진', 2003);
21 | console.log(yuJin);
22 | const gaeul = new IdolModel('가을', 2002);
23 | console.log(gaeul);
24 | const ray = new IdolModel('레이', 2004);
25 | console.log(ray);
26 | const wonYoung = new IdolModel('장원영', 2004);
27 | console.log(wonYoung);
28 | const liz = new IdolModel('리즈', 2004);
29 | console.log(liz);
30 | const eseo = new IdolModel('이서', 2007);
31 | console.log(eseo);
32 | 
33 | console.log(yuJin.name);
34 | console.log(yuJin.year);
35 | 
36 | console.log(yuJin.sayName());
37 | console.log(wonYoung.sayName());
38 | 
39 | console.log(typeof IdolModel);
40 | console.log(typeof yuJin);


--------------------------------------------------------------------------------
/1_basics/9_if_and_switch.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * If and Switch
 3 |  */
 4 | let number = 5;
 5 | 
 6 | if (number % 2 === 0) {
 7 |     console.log('number 변수는 짝수입니다.');
 8 | } else {
 9 |     console.log('number 변수는 홀수입니다.');
10 | }
11 | 
12 | if (number % 2 === 0) {
13 |     console.log('2의 배수입니다.');
14 | } else if (number % 3 === 0) {
15 |     console.log('3의 배수입니다.');
16 | } else if (number % 4 === 0) {
17 |     console.log('4의 배수입니다.');
18 | } else if (number % 5 === 0) {
19 |     console.log('5의 배수입니다.');
20 | } else {
21 |     console.log('2, 3, 4, 5의 배수가 아닙니다.');
22 | }
23 | 
24 | const englishDay = 'saturday';
25 | 
26 | let koreanDay;
27 | 
28 | switch(englishDay){
29 |     case 'monday':
30 |         koreanDay = '월요일';
31 |         break;
32 |     case 'tuesday':
33 |         koreanDay = '화요일';
34 |         break;
35 |     case 'wednesday':
36 |         koreanDay = '수요일';
37 |         break;
38 |     case 'thursday':
39 |         koreanDay = '목요일';
40 |         break;
41 |     case 'friday':
42 |         koreanDay = '금요일';
43 |         break;
44 |     default:
45 |         koreanDay = '주말';
46 |         break;
47 | }
48 | 
49 | console.log(koreanDay);


--------------------------------------------------------------------------------
/2_class_and_oop/2_getter_and_setter.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Getter and Setter
 3 |  */
 4 | class IdolModel{
 5 |     name;
 6 |     year;
 7 | 
 8 |     constructor(name, year){
 9 |         this.name = name;
10 |         this.year = year;
11 |     }
12 | 
13 |     /**
14 |      * 1) 데이터를 가공해서 새로운 데이터를 반환할때
15 |      * 2) private한 값을 반환할때
16 |      */
17 |     get nameAndYear(){
18 |         return `${this.name}-${this.year}`;
19 |     }
20 | 
21 |     set setName(name){
22 |         this.name = name;
23 |     }
24 | }
25 | 
26 | const yuJin = new IdolModel('안유진', 2003);
27 | console.log(yuJin);
28 | console.log(yuJin.nameAndYear);
29 | 
30 | yuJin.setName = '장원영';
31 | console.log(yuJin);
32 | 
33 | class IdolModel2{
34 |     #name;
35 |     year;
36 | 
37 |     constructor(name, year){
38 |         this.#name = name;
39 |         this.year = year;
40 |     }
41 | 
42 |     get name(){
43 |         return this.#name;
44 |     }
45 | 
46 |     set name(name){
47 |         this.#name = name;
48 |     }
49 | }
50 | 
51 | const yuJin2 = new IdolModel2('안유진', 2003);
52 | console.log(yuJin2);
53 | console.log(yuJin2.name);
54 | 
55 | yuJin2.name = '코드팩토리';
56 | console.log(yuJin2.name);


--------------------------------------------------------------------------------
/1_basics/11_coercion.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * 타입 변환
 3 |  * Type Conversion
 4 |  * 
 5 |  * 1) 명시적
 6 |  * 2) 암묵적
 7 |  */
 8 | let age = 32;
 9 | 
10 | // 명시적
11 | let stringAge = age.toString();
12 | console.log(typeof stringAge, stringAge);
13 | 
14 | // 암묵적
15 | let test = age + '';
16 | console.log(typeof test, test);
17 | 
18 | console.log('98' + '2');
19 | console.log(98 * 2);
20 | console.log('98' - 2);
21 | 
22 | console.log('------------');
23 | /**
24 |  * 명시적 변환 몇가지 더 배우기
25 |  */
26 | console.log(typeof (99).toString(), (99).toString());
27 | console.log(typeof (true).toString(), (true).toString());
28 | console.log(typeof (Infinity).toString(), (Infinity).toString());
29 | 
30 | // 숫자 타입으로 변환
31 | console.log(typeof parseInt('0'), parseInt('0.99'));
32 | console.log(typeof parseFloat('0.99'), parseFloat('0.99'));
33 | console.log(typeof +'1', +'1');
34 | 
35 | console.log('-------------------_');
36 | /**
37 |  * Boolean 타입으로의 변환
38 |  */
39 | console.log(!!'asdkfjhalksdfjasdfx');
40 | 
41 | console.log(!!'');
42 | 
43 | console.log(!!0);
44 | console.log(!!'0');
45 | console.log(!!'false');
46 | console.log(!!false);
47 | console.log(!!undefined);
48 | console.log(!!null);
49 | 
50 | console.log(!!{});
51 | console.log(!![]);
52 | 
53 | /**
54 |  * 1) 아무 글자도 없는 String
55 |  * 2) 값이 없는 경우
56 |  * 3) 0
57 |  * 
58 |  * 모두 false를 반환한다.
59 |  */


--------------------------------------------------------------------------------
/2_class_and_oop/3_static_keyword.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Static Keyword
 3 |  */
 4 | // class IdolModel {
 5 | //     name;
 6 | //     year;
 7 | //     static groupName = '아이브';
 8 | 
 9 | //     constructor(name, year) {
10 | //         this.name = name;
11 | //         this.year = year;
12 | //     }
13 | 
14 | //     static returnGroupName(){
15 | //         return '아이브';
16 | //     }
17 | // }
18 | 
19 | // const yuJin = new IdolModel('안유진', 2003);
20 | // console.log(yuJin);
21 | 
22 | // console.log(IdolModel.groupName);
23 | // console.log(IdolModel.returnGroupName());
24 | 
25 | /**
26 |  * factory constructor
27 |  */
28 | class IdolModel{
29 |     name;
30 |     year;
31 | 
32 |     constructor(name, year){
33 |         this.name = name;
34 |         this.year = year;
35 |     }
36 | 
37 |     static fromObject(object){
38 |         return new IdolModel(
39 |             object.name,
40 |             object.year,
41 |         );
42 |     }
43 | 
44 |     static fromList(list){
45 |         return new IdolModel(
46 |             list[0],
47 |             list[1],
48 |         );
49 |     }
50 | }
51 | 
52 | const yuJin2 = IdolModel.fromObject({
53 |     name: '안유진',
54 |     year: 2003,
55 | });
56 | console.log(yuJin2);
57 | 
58 | const wonYoung = IdolModel.fromList(
59 |     [
60 |         '장원영',
61 |         2003,
62 |     ]
63 | );
64 | console.log(wonYoung);


--------------------------------------------------------------------------------
/2_class_and_oop/4_inheritance.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Inheritance
 3 |  */
 4 | class IdolModel{
 5 |     name;
 6 |     year;
 7 | 
 8 |     constructor(name, year){
 9 |         this.name = name;
10 |         this.year = year;
11 |     }
12 | }
13 | 
14 | class FemaleIdolModel extends IdolModel {
15 |     dance(){
16 |         return '여자 아이돌이 춤을 춥니다.';
17 |     }
18 | }
19 | 
20 | class MaleIdolModel extends IdolModel{
21 |     sing(){
22 |         return '남자 아이돌이 노래를 부릅니다.';
23 |     }
24 | }
25 | 
26 | const yuJin = new FemaleIdolModel('안유진', 2003);
27 | console.log(yuJin);
28 | 
29 | const jiMin = new MaleIdolModel('지민', 1995);
30 | console.log(jiMin);
31 | 
32 | console.log(yuJin.dance());
33 | console.log(yuJin.name);
34 | 
35 | console.log(jiMin.sing());
36 | console.log(jiMin.year);
37 | 
38 | const cf = new IdolModel('코드팩토리', 1992);
39 | console.log(cf);
40 | 
41 | console.log(cf.name);
42 | 
43 | console.log(yuJin instanceof IdolModel);
44 | console.log(yuJin instanceof FemaleIdolModel);
45 | console.log(yuJin instanceof MaleIdolModel);
46 | 
47 | console.log('----------');
48 | console.log(jiMin instanceof IdolModel);
49 | console.log(jiMin instanceof FemaleIdolModel);
50 | console.log(jiMin instanceof MaleIdolModel);
51 | 
52 | console.log('-------------');
53 | console.log(cf instanceof IdolModel);
54 | console.log(cf instanceof FemaleIdolModel);
55 | console.log(cf instanceof MaleIdolModel);
56 | 


--------------------------------------------------------------------------------
/3_all_about_object/6_scope.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Scope
 3 |  */
 4 | var numberOne = 20;
 5 | 
 6 | function levelOne(){
 7 |     console.log(numberOne);
 8 | }
 9 | 
10 | // levelOne();
11 | 
12 | function levelOne(){
13 |     var numberOne = 40;
14 | 
15 |     console.log(numberOne);
16 | }
17 | 
18 | // levelOne();
19 | 
20 | console.log(numberOne);
21 | 
22 | function levelOne(){
23 |     var numberOne = 40;
24 | 
25 |     function levelTwo(){
26 |         var numberTwo = 99;
27 | 
28 |         console.log(`levelTwo numberTwo : ${numberTwo}`);
29 |         console.log(`levelTwo numberOne : ${numberOne}`);
30 |     }
31 | 
32 |     levelTwo();
33 |     console.log(`levelOne numberOne : ${numberOne}`);
34 | }
35 | 
36 | levelOne();
37 | console.log(numberOne);
38 | // console.log(numberTwo);
39 | 
40 | /**
41 |  * JS -> Lexical Scope
42 |  * 
43 |  * 선언된 위치가 상위 스코프를 정한다.
44 |  * 
45 |  * Dynamic Scope
46 |  * 
47 |  * 실행한 위치가 상위 스코프를 정한다.
48 |  */
49 | var numberThree = 3;
50 | 
51 | function functionOne(){
52 |     var numberThree = 100;
53 | 
54 |     functionTwo();
55 | }
56 | 
57 | function functionTwo(){
58 |     console.log(numberThree);
59 | }
60 | 
61 | functionOne();
62 | 
63 | var i = 999;
64 | 
65 | for(var i = 0; i < 10; i++){
66 |     console.log(i);
67 | }
68 | console.log(`i in global scope : ${i}`)
69 | 
70 | i = 999;
71 | // block level scope
72 | for(let i = 0; i < 10; i++){
73 |     console.log(i);
74 | }
75 | console.log(`i in global scope : ${i}`);
76 | 
77 | /**
78 |  * var 키워드는 함수 레벨 스코프만 만들어낸다.
79 |  * 
80 |  * let, const 키워드는 함수 레벨 스코프와 블록 레벨 스코프를 만들어낸다.
81 |  */


--------------------------------------------------------------------------------
/1_basics/14_object.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Object / 객체
 3 |  */
 4 | 
 5 | // key : value pair
 6 | let yuJin = {
 7 |     name: '안유진',
 8 |     group: '아이브',
 9 |     dance: function () {
10 |         return `${this.name}이 춤을 춥니다.`;
11 |     }
12 | };
13 | 
14 | console.log(yuJin);
15 | console.log(yuJin.name);
16 | console.log(yuJin['name']);
17 | 
18 | const key = 'name';
19 | 
20 | console.log(yuJin[key]);
21 | 
22 | console.log(yuJin.dance());
23 | 
24 | const nameKey = 'name';
25 | const nameValue = '안유진';
26 | 
27 | const groupKey = 'group';
28 | const groupValue = '아이브';
29 | 
30 | const yuJin2 = {
31 |     [nameKey]: nameValue,
32 |     [groupKey]: groupValue,
33 |     dance: function(){
34 |         return `${this.name}이 춤을 춥니다.`;
35 |     }
36 | }
37 | console.log(yuJin2);
38 | console.log(yuJin2.dance());
39 | 
40 | yuJin2['group'] = '코드팩토리';
41 | console.log(yuJin2);
42 | 
43 | yuJin2['englishName'] = 'An Yu Jin';
44 | console.log(yuJin2);
45 | 
46 | delete yuJin2['englishName'];
47 | console.log(yuJin2);
48 | 
49 | /**
50 |  * const로 선언한 객체의 특징
51 |  * 
52 |  * 1) const로 선언할경우 객체 자체를 변경 할 수는 없다.
53 |  * 2) 객체 안의 프로퍼티나 메서드는 변경 할 수 있다.
54 |  */
55 | const wonYoung = {
56 |     name: '장원영',
57 |     group: '아이브',
58 | }
59 | console.log(wonYoung);
60 | 
61 | // wonYoung = {};
62 | 
63 | wonYoung['group'] = '코드팩토리';
64 | console.log(wonYoung);
65 | 
66 | /**
67 |  * 모든 키값 다 가져오기
68 |  */
69 | console.log(Object.keys(wonYoung));
70 | 
71 | /**
72 |  * 모든 벨류값 다 가져오기
73 |  */
74 | console.log(Object.values(wonYoung));
75 | 
76 | const name = '안유진';
77 | 
78 | const yuJin3 = {
79 |     name: name,
80 |     name,
81 | };
82 | console.log(yuJin3);


--------------------------------------------------------------------------------
/4_async_programming/2_callback_hell_and_promise.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Callback
 3 |  */
 4 | function waitAndRun() {
 5 |     setTimeout(() => {
 6 |         console.log('끝');
 7 |     }, 2000);
 8 | }
 9 | 
10 | // waitAndRun();
11 | 
12 | function waitAndRun2() {
13 |     setTimeout(
14 |         () => {
15 |             console.log('1번 콜백 끝');
16 |             setTimeout(() => {
17 |                 console.log('2번 콜백 끝');
18 |                 setTimeout(() => {
19 |                     console.log('3번 콜백 끝');
20 |                 }, 2000);
21 |             }, 2000);
22 |         }, 2000);
23 | }
24 | 
25 | // waitAndRun2();
26 | 
27 | /**
28 |  * Promise
29 |  */
30 | const timeoutPromise = new Promise((resolve, reject) => {
31 |     setTimeout(() => {
32 |         resolve('완료');
33 |     }, 2000);
34 | });
35 | 
36 | // timeoutPromise.then((res) => {
37 | //     console.log('---then---');
38 | //     console.log(res);
39 | // });
40 | 
41 | const getPromise = (seconds) => new Promise((resolve, reject) => {
42 |     setTimeout(() => {
43 |         // if(xxx){
44 |         //     resolve('성공')
45 |         // }else{
46 |         //     reject('에러');
47 |         // }
48 |         resolve('에러');
49 |     }, seconds * 1000);
50 | });
51 | 
52 | // getPromise(3)
53 | //     .then((res) => {
54 | //         console.log('--- first then ---');
55 | //         console.log(res);
56 | //     })
57 | //     .catch((res)=>{
58 | //         console.log('--- first catch ---');
59 | //         console.log(res);
60 | //     })
61 | //     .finally(()=>{
62 | //         console.log('--- finally ---');
63 | //     });
64 | 
65 | Promise.all([
66 |     getPromise(1),
67 |     getPromise(4),
68 |     getPromise(1),
69 | ]).then((res)=>{
70 |     console.log(res);
71 | });


--------------------------------------------------------------------------------
/1_basics/15_copy_by_value_and_reference.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * copy by value 값에 의한 전달
 3 |  * copy by reference 참조에 의한 전달
 4 |  * 
 5 |  * 1) 기본적으로 모든 primitive 값은 copy by value다
 6 |  * 2) 객체는 copy by reference다
 7 |  */
 8 | let original = '안녕하세요';
 9 | let clone = original;
10 | 
11 | console.log(original);
12 | console.log(clone);
13 | 
14 | clone += ' 안유진 입니다.';
15 | console.log('--------------');
16 | console.log(original);
17 | console.log(clone);
18 | 
19 | let originalObj = {
20 |     name: '안유진',
21 |     group: '아이브',
22 | };
23 | let cloneObj = originalObj;
24 | 
25 | console.log(originalObj);
26 | console.log(cloneObj);
27 | 
28 | console.log('----------');
29 | 
30 | originalObj['group'] = '코드팩토리';
31 | console.log(originalObj);
32 | console.log(cloneObj);
33 | 
34 | console.log(originalObj === cloneObj);
35 | console.log(original === clone);
36 | 
37 | originalObj = {
38 |     name: '최지호',
39 |     group: '코드팩토리',
40 | };
41 | cloneObj = {
42 |     name: '최지호',
43 |     group: '코드팩토리',
44 | };
45 | console.log(originalObj === cloneObj);
46 | 
47 | const yuJin1 = {
48 |     name: '안유진',
49 |     group: '아이브',
50 | }
51 | const yuJin2 = yuJin1;
52 | const yuJin3 = {
53 |     name: '안유진',
54 |     group: '아이브',
55 | }
56 | 
57 | // true
58 | console.log(yuJin1 === yuJin2);
59 | // false
60 | console.log(yuJin1 === yuJin3);
61 | // false
62 | console.log(yuJin2 === yuJin3);
63 | 
64 | /**
65 |  * Spread Operator
66 |  */
67 | const yuJin4 = {
68 |     ...yuJin3,
69 | };
70 | console.log(yuJin4);
71 | 
72 | console.log(yuJin4 === yuJin3);
73 | 
74 | const yuJin5 = {
75 |     year: 2003,
76 |     ...yuJin3,
77 | };
78 | console.log(yuJin5);
79 | 
80 | const yuJin6 = {
81 |     name: '코드팩토리',
82 |     ...yuJin3,
83 | };
84 | console.log(yuJin6);
85 | 
86 | const yuJin7 = {
87 |     ...yuJin3,
88 |     name: '코드팩토리',
89 | }
90 | console.log(yuJin7);
91 | 
92 | const numbers = [1, 3, 5];
93 | const numbers2 = [
94 |     ...numbers,
95 |     10,
96 | ];
97 | console.log(numbers2);


--------------------------------------------------------------------------------
/3_all_about_object/7_this.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * this
 3 |  * 
 4 |  * JS는 Lexical Scope를 사용하기때문에 함수의 상위 스코프가
 5 |  * 정의 시점에 평가된다. 
 6 |  * 
 7 |  * *****하지만 this 키워드는 바인딩이 객체가 생성되는 시점에 결정된다.
 8 |  */
 9 | const testFunction = function(){
10 |     return this;
11 | }
12 | 
13 | console.log(testFunction());
14 | console.log(testFunction() === global);
15 | 
16 | const yuJin = {
17 |     name: '안유진',
18 |     year: 2003,
19 |     sayHello: function(){
20 |         return `안녕하세요 저는 ${this.name}입니다.`;
21 |     },
22 | }
23 | 
24 | console.log(yuJin.sayHello());
25 | 
26 | function Person(name, year){
27 |     this.name = name;
28 |     this.year = year;
29 | 
30 |     this.sayHello = function(){
31 |         return `안녕하세요 저는 ${this.name}입니다.`;
32 |     }
33 | }
34 | 
35 | const yuJin2 = new Person('안유진', 2003);
36 | console.log(yuJin2.sayHello());
37 | 
38 | Person.prototype.dance = function(){
39 |     function dance2(){
40 |         return `${this.name}이 춤을춥니다.`;
41 |     }
42 | 
43 |     return dance2();
44 | }
45 | console.log(yuJin2.dance());
46 | 
47 | /**
48 |  * this 키워드가 어떤걸 가르키냐는 세가지만 기억하면된다.
49 |  * 
50 |  * 1) 일반 함수 호출할땐 this가 최상위 객체 (global 또는 window)를 가리킨다.
51 |  * 2) 메서드로 호출할땐 호출된 객체를 가리킨다.
52 |  * 3) new 키워드를 사용해서 객체를 생성했을땐 객체를 가리킨다.
53 |  */
54 | 
55 | /**
56 |  * 1) apply()
57 |  * 2) call()
58 |  * 3) bind()
59 |  */
60 | function returnName(){
61 |     return this.name;
62 | }
63 | 
64 | console.log(returnName());
65 | 
66 | const yuJin3 = {
67 |     name: '안유진',
68 | }
69 | 
70 | console.log(returnName.call(yuJin3));
71 | console.log(returnName.apply(yuJin3));
72 | 
73 | /**
74 |  * 1) call -> 컴마를 기반으로 아규먼트를 순서대로 넘겨주고
75 |  * 2) apply ->  아규먼트를 리스트로 입력해야한다.
76 |  */
77 | function multiply(x, y, z){
78 |     return `${this.name} / 결과값 : ${x * y * z}`;
79 | }
80 | 
81 | console.log(multiply.call(yuJin3, 3, 4, 5));
82 | console.log(multiply.apply(yuJin3, [3, 4, 5]));
83 | 
84 | /**
85 |  * bind()
86 |  */
87 | const laterFunc = multiply.bind(yuJin3, 3, 4, 5);
88 | console.log(laterFunc);
89 | console.log(laterFunc());


--------------------------------------------------------------------------------
/3_all_about_object/9_1_closure.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Closure
 3 |  * 
 4 |  * A closure is the combination of a function and the lexical 
 5 |  * environemnt within which that function was declared
 6 |  * 
 7 |  * "클로저는 어떤 함수와 해당 함수가 선언된 렉시컬 환경의 조합이다."
 8 |  * 
 9 |  * "상위 함수보다 하위 함수가 더 오래 살아있는 경우를 closure라고 한다."
10 |  */
11 | function getNumber() {
12 |     var number = 5;
13 | 
14 |     function innerGetNumber() {
15 |         return number;
16 |     }
17 | 
18 |     return innerGetNumber();
19 | }
20 | 
21 | // console.log(number);
22 | 
23 | // console.log(getNumber());
24 | 
25 | function getNumber() {
26 |     var number = 5;
27 | 
28 |     function innerGetNumber() {
29 |         return number;
30 |     }
31 | 
32 |     return innerGetNumber;
33 | }
34 | 
35 | const runner = getNumber();
36 | 
37 | console.log(runner);
38 | console.log(runner());
39 | 
40 | /**
41 |  * 1) 데이터 캐싱
42 |  */
43 | function cacheFunction() {
44 |     // 아래 계산은 매우 오래걸린다는 가정을 했을때
45 |     var number = 10 * 10;
46 | 
47 |     function innerCacheFunction(newNumb){
48 |         return number * newNumb;
49 |     }
50 | 
51 |     return innerCacheFunction;
52 | }
53 | 
54 | const runner2 = cacheFunction();
55 | console.log(runner2(10));
56 | console.log(runner2(20));
57 | 
58 | function cacheFunction2(){
59 |     var number = 99;
60 | 
61 |     function increment(){
62 |         number ++;
63 |         return number;
64 |     }
65 | 
66 |     return increment;
67 | }
68 | 
69 | const runner3 = cacheFunction2();
70 | console.log(runner3());
71 | console.log(runner3());
72 | console.log(runner3());
73 | console.log(runner3());
74 | console.log(runner3());
75 | console.log(runner3());
76 | console.log(runner3());
77 | 
78 | /**
79 |  * 3) 정보 은닉
80 |  */
81 | function Idol(name, year){
82 |     this.name = name;
83 | 
84 |     var _year = year;
85 | 
86 |     this.sayNameAndYear = function(){
87 |         return `안녕하세요 저는 ${this.name}입니다. ${_year}에 태어났습니다.`;
88 |     }
89 | }
90 | 
91 | const yuJin = new Idol('안유진', 2003);
92 | console.log(yuJin.sayNameAndYear());
93 | 
94 | console.log(yuJin.name);
95 | console.log(yuJin._year);


--------------------------------------------------------------------------------
/1_basics/10_loops.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * Loops
  3 |  * 
  4 |  * 1) for
  5 |  * 2) while
  6 |  */
  7 | for (let i = 0; i < 10; i++) {
  8 |     console.log(i);
  9 | }
 10 | 
 11 | console.log('------------');
 12 | 
 13 | for (let i = 10; i > 0; i--) {
 14 |     console.log(i);
 15 | }
 16 | 
 17 | console.log('------------');
 18 | 
 19 | for (let i = 0; i < 3; i++) {
 20 |     for (let j = 3; j > 0; j--) {
 21 |         console.log(i, j);
 22 |     }
 23 | }
 24 | 
 25 | // *을 이용해서 6x6의 정사각형를 출력해라
 26 | let square = '';
 27 | let side = 6;
 28 | 
 29 | for (let i = 0; i < side; i++) {
 30 |     for (let j = 0; j < side; j++) {
 31 |         square += '*';
 32 |     }
 33 |     square += '\n';
 34 | }
 35 | 
 36 | console.log(square);
 37 | 
 38 | /**
 39 |  * for...in
 40 |  */
 41 | const yuJin = {
 42 |     name: '안유진',
 43 |     year: 2003,
 44 |     group: '아이브',
 45 | }
 46 | 
 47 | console.log('------------');
 48 | 
 49 | for (let key in yuJin) {
 50 |     console.log(key);
 51 | }
 52 | 
 53 | const iveMembersArray = ['안유진', '가을', '레이', '장원영', '리즈', '이서'];
 54 | 
 55 | console.log('------------');
 56 | 
 57 | for (let key in iveMembersArray) {
 58 |     console.log(key);
 59 |     console.log(`${key}:${iveMembersArray[key]}`);
 60 | }
 61 | 
 62 | /**
 63 |  * for...of
 64 |  */
 65 | for (let value of iveMembersArray) {
 66 |     console.log(value);
 67 | }
 68 | 
 69 | /**
 70 |  * While
 71 |  */
 72 | let number = 0;
 73 | 
 74 | while (number < 10) {
 75 |     number++;
 76 | }
 77 | 
 78 | console.log(number);
 79 | 
 80 | /**
 81 |  * do...while
 82 |  */
 83 | number = 0;
 84 | 
 85 | do {
 86 |     number++;
 87 | } while (number < 10);
 88 | 
 89 | console.log(number);
 90 | 
 91 | /**
 92 |  * break
 93 |  */
 94 | console.log('--------------');
 95 | for (let i = 0; i < 10; i++) {
 96 |     if (i === 5) {
 97 |         break;
 98 |     }
 99 |     console.log(i);
100 | }
101 | 
102 | console.log('-------------');
103 | number = 0;
104 | 
105 | while(number < 10){
106 |     if(number === 5){
107 |         break;
108 |     }
109 | 
110 |     number ++;
111 |     console.log(number);
112 | }
113 | 
114 | /**
115 |  * continue
116 |  */
117 | console.log('---------------');
118 | for(let i = 0; i < 10; i++){
119 |     if(i === 5){
120 |         continue;
121 |     }
122 |     console.log(i);
123 | }
124 | 
125 | 
126 | console.log('----------------');
127 | number = 0;
128 | 
129 | while(number < 10){
130 |     number ++;
131 | 
132 |     if(number === 5){
133 |         continue;
134 |     }
135 | 
136 |     console.log(number);
137 | }


--------------------------------------------------------------------------------
/3_all_about_object/3_immutable_object.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * Immutable Object
  3 |  */
  4 | const yuJin = {
  5 |     name: '안유진',
  6 |     year: 2003,
  7 | 
  8 |     get age(){
  9 |         return new Date().getFullYear() - this.year;
 10 |     },
 11 | 
 12 |     set age(age){
 13 |         this.year = new Date().getFullYear() - age;
 14 |     }
 15 | }
 16 | 
 17 | console.log(yuJin);
 18 | 
 19 | /**
 20 |  * Extensible
 21 |  */
 22 | console.log(Object.isExtensible(yuJin));
 23 | 
 24 | yuJin['position'] = 'vocal';
 25 | 
 26 | console.log(yuJin);
 27 | 
 28 | Object.preventExtensions(yuJin);
 29 | 
 30 | console.log(Object.isExtensible(yuJin));
 31 | 
 32 | yuJin['groupName'] = '아이브';
 33 | console.log(yuJin);
 34 | 
 35 | delete yuJin['position'];
 36 | console.log(yuJin);
 37 | 
 38 | /**
 39 |  * Seal
 40 |  */
 41 | const yuJin2 = {
 42 |     name: '안유진',
 43 |     year: 2003,
 44 | 
 45 |     get age(){
 46 |         return new Date().getFullYear() - this.year;
 47 |     },
 48 | 
 49 |     set age(age){
 50 |         this.year = new Date().getFullYear() - age;
 51 |     }
 52 | }
 53 | console.log(yuJin2);
 54 | 
 55 | console.log(Object.isSealed(yuJin2));
 56 | 
 57 | Object.seal(yuJin2);
 58 | 
 59 | console.log(Object.isSealed(yuJin2));
 60 | 
 61 | yuJin2['groupName'] = '아이브';
 62 | console.log(yuJin2);
 63 | 
 64 | delete yuJin2['name'];
 65 | console.log(yuJin2);
 66 | 
 67 | Object.defineProperty(yuJin2, 'name', {
 68 |     writable: false,
 69 | });
 70 | console.log(Object.getOwnPropertyDescriptor(yuJin2, 'name'));
 71 | 
 72 | /**
 73 |  * Freezed
 74 |  * 
 75 |  * 읽기 외에 모든 기능을 불가능하게 만든다.
 76 |  */
 77 | const yuJin3 = {
 78 |     name: '안유진',
 79 |     year: 2003,
 80 | 
 81 |     get age(){
 82 |         return new Date().getFullYear() - this.year;
 83 |     },
 84 | 
 85 |     set age(age){
 86 |         this.year = new Date().getFullYear() - age;
 87 |     }
 88 | }
 89 | console.log(Object.isFrozen(yuJin3));
 90 | 
 91 | Object.freeze(yuJin3);
 92 | console.log(Object.isFrozen(yuJin3));
 93 | 
 94 | yuJin3['groupName'] = '아이브';
 95 | console.log(yuJin3);
 96 | 
 97 | delete yuJin3['name'];
 98 | console.log(yuJin3);
 99 | 
100 | // Object.defineProperty(yuJin3, 'name', {
101 | //     value: '코드팩토리',
102 | // })
103 | console.log(Object.getOwnPropertyDescriptor(yuJin3, 'name'));
104 | 
105 | const yuJin4 = {
106 |     name: '안유진',
107 |     year: 2003,
108 |     wonYoung: {
109 |         name: '장원영',
110 |         year: 2002,
111 |     },
112 | };
113 | Object.freeze(yuJin4);
114 | 
115 | console.log(Object.isFrozen(yuJin4));
116 | console.log(Object.isFrozen(yuJin4['wonYoung']));


--------------------------------------------------------------------------------
/1_basics/12_function.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * function -> 함수
  3 |  */
  4 | 
  5 | /**
  6 |  * 만약에 2라는 숫자에 * 10/ 2 % 3 스트링으로 변환해서
  7 |  * 반환받고싶다면 어떻게 해야할까?
  8 |  */
  9 | console.log((2 * 10 / 2 % 3).toString());
 10 | console.log((3 * 10 / 2 % 3).toString());
 11 | 
 12 | /**
 13 |  * DRY
 14 |  * D -> Don't
 15 |  * R -> Repeat
 16 |  * Y -> Yourself
 17 |  */
 18 | function calculate() {
 19 |     console.log((3 * 10 / 2 % 3).toString());
 20 | }
 21 | 
 22 | // calculate();
 23 | 
 24 | function calculate(number) {
 25 |     console.log((number * 10 / 2 % 3).toString());
 26 | }
 27 | 
 28 | /**
 29 |  * 함수에서 입력받는 값에대한 정의를 Parameter라고한다.
 30 |  * 
 31 |  * 실제 입력하는 값은 argument라고 한다.
 32 |  */
 33 | calculate(4);
 34 | calculate(5);
 35 | 
 36 | function multiply(x, y) {
 37 |     console.log(x * y);
 38 | }
 39 | 
 40 | multiply(2, 4);
 41 | 
 42 | function multiply(x, y = 10) {
 43 |     console.log(x * y);
 44 | }
 45 | 
 46 | multiply(2, 4);
 47 | multiply(2);
 48 | 
 49 | /**
 50 |  * 반환받기
 51 |  * return 받기
 52 |  */
 53 | console.log('---------------');
 54 | function multiply(x, y) {
 55 |     return x * y;
 56 | }
 57 | 
 58 | const result1 = multiply(2, 4);
 59 | console.log(result1);
 60 | 
 61 | const result2 = multiply(4, 5);
 62 | console.log(result2);
 63 | 
 64 | /**
 65 |  * Arrow 함수
 66 |  */
 67 | const multiply2 = (x, y) => {
 68 |     return x * y;
 69 | }
 70 | console.log(multiply2(3, 4));
 71 | 
 72 | const multiply3 = (x, y) => x * y;
 73 | console.log(multiply3(4, 5));
 74 | 
 75 | const multiply4 = x => x * 2;
 76 | console.log(multiply4(2));
 77 | 
 78 | const multiply5 = x => y => z => `x: ${x} y: ${y} z:${z}`;
 79 | console.log(multiply5(2)(5)(7));
 80 | 
 81 | function multiply6(x) {
 82 |     return function (y) {
 83 |         return function (z) {
 84 |             return `x: ${x} y: ${y} z:${z}`
 85 |         }
 86 |     }
 87 | }
 88 | console.log(multiply6(3)(4)(5));
 89 | 
 90 | const multiplyTwo = function (x, y) {
 91 |     return x * y;
 92 | }
 93 | console.log(multiplyTwo(4, 5));
 94 | 
 95 | const multiplyThree = function (x, y, z) {
 96 |     console.log(arguments);
 97 |     return x * y * z;
 98 | }
 99 | 
100 | console.log('-----------------');
101 | console.log(multiplyThree(4, 5, 6));
102 | 
103 | const multiplyAll = function (...arguments) {
104 |     return Object.values(arguments).reduce((a, b) => a * b, 1);
105 | }
106 | 
107 | console.log(multiplyAll(3, 4, 5, 6, 7, 8, 9, 10));
108 | 
109 | // immediately invoked function
110 | (function(x, y){
111 |     console.log(x * y);
112 | })(4, 5)
113 | 
114 | console.log(typeof multiply);
115 | console.log(multiply instanceof Object);


--------------------------------------------------------------------------------
/1_basics/13_must_know_array_functions.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * Array Functions
  3 |  */
  4 | let iveMembers = [
  5 |     '안유진',
  6 |     '가을',
  7 |     '레이',
  8 |     '장원영',
  9 |     '리즈',
 10 |     '이서',
 11 | ];
 12 | 
 13 | console.log(iveMembers);
 14 | 
 15 | // push()
 16 | console.log(iveMembers.push('코드팩토리'));
 17 | console.log(iveMembers);
 18 | 
 19 | console.log('---------------_');
 20 | // pop()
 21 | console.log(iveMembers.pop());
 22 | console.log(iveMembers);
 23 | 
 24 | console.log('---------------_');
 25 | // shift()
 26 | console.log(iveMembers.shift());
 27 | console.log(iveMembers);
 28 | 
 29 | // unshift()
 30 | console.log(iveMembers.unshift('안유진'));
 31 | console.log(iveMembers);
 32 | 
 33 | console.log('---------------_');
 34 | 
 35 | // splice()
 36 | console.log(iveMembers.splice(0, 3))
 37 | console.log(iveMembers);
 38 | 
 39 | iveMembers = [
 40 |     '안유진',
 41 |     '가을',
 42 |     '레이',
 43 |     '장원영',
 44 |     '리즈',
 45 |     '이서',
 46 | ];
 47 | 
 48 | console.log(iveMembers);
 49 | 
 50 | // concat()
 51 | console.log(iveMembers.concat('코드팩토리'));
 52 | console.log(iveMembers);
 53 | 
 54 | // slice()
 55 | console.log(iveMembers.slice(0, 3));
 56 | console.log(iveMembers);
 57 | 
 58 | // spread operator
 59 | let iveMembers2 = [
 60 |     ...iveMembers,
 61 | ];
 62 | console.log(iveMembers2);
 63 | 
 64 | let iveMembers3 = [
 65 |     iveMembers,
 66 | ];
 67 | console.log(iveMembers3);
 68 | 
 69 | 
 70 | console.log('--------------');
 71 | let iveMembers4 = iveMembers;
 72 | 
 73 | console.log(iveMembers4);
 74 | console.log(iveMembers4 === iveMembers);
 75 | 
 76 | console.log([
 77 |     ...iveMembers,
 78 | ] === iveMembers);
 79 | 
 80 | // join()
 81 | console.log(iveMembers.join());
 82 | console.log(iveMembers.join('/'));
 83 | console.log(iveMembers.join(', '));
 84 | 
 85 | // sort()
 86 | // 오름차순
 87 | iveMembers.sort();
 88 | console.log(iveMembers);
 89 | 
 90 | console.log(iveMembers.reverse());
 91 | 
 92 | let numbers = [
 93 |     1,
 94 |     9,
 95 |     7,
 96 |     5,
 97 |     3,
 98 | ];
 99 | console.log(numbers);
100 | 
101 | // a, b를 비교했을때
102 | // 1) a를 b 보다 나중에 정렬하려면 (뒤에두려면) 0보다 큰 숫자를 반환
103 | // 2) a를 b 보다 먼저 정렬하려면 (앞에두려면) 0보다 작은 숫자를 반환
104 | // 3) 원래 순서를 그대로 두려면 0을 반환
105 | numbers.sort((a, b) => {
106 |     return a > b ? 1 : -1;
107 | });
108 | console.log(numbers);
109 | 
110 | numbers.sort((a, b) => a > b ? -1 : 1);
111 | console.log(numbers);
112 | 
113 | // map()
114 | console.log('--------------');
115 | console.log(iveMembers.map((x) => x));
116 | console.log(iveMembers.map((x) => `아이브: ${x}`));
117 | 
118 | console.log(iveMembers.map((x) => {
119 |     if (x === '안유진') {
120 |         return `아이브: ${x}`;
121 |     } else {
122 |         return x;
123 |     }
124 | }));
125 | console.log(iveMembers);
126 | 
127 | // filter()
128 | numbers = [1, 8, 7, 6, 3];
129 | 
130 | console.log(numbers.filter((x) => x % 2 === 0));
131 | 
132 | // find()
133 | console.log(numbers.find((x) => x % 2 === 0));
134 | 
135 | // findIndex()
136 | console.log(numbers.findIndex((x) => x % 2 === 0));
137 | 
138 | // reduce()
139 | console.log(numbers.reduce((p, n) => p + n, 0));
140 | 
141 | // reduce() 퀴즈
142 | // reduce() 함수를 사용해서 iveMembers 변수에 있는 모든 스트링 값들의
143 | // 길이를 더해서 반환하라.
144 | // 참고로 string의 길이는 .length를 이용해서 구할 수 있다.
145 | console.log(iveMembers.reduce((p, n) => p + n.length, 0))


--------------------------------------------------------------------------------
/3_all_about_object/2_property_attribute.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * Property Attribute
  3 |  * 
  4 |  * 1) 데이터 프로퍼티 - 키와 값으로 형성된 실질적 값을 갖고있는 프로퍼티
  5 |  * 2) 액세서 프로퍼티 - 자체적으로 값을 갖고 있지 않지만 다른 값을 가져오거나
  6 |  *                  설정할때 호출되는 함수로 구성된 프로퍼티
  7 |  *                  예를들면 getter와 setter
  8 |  */
  9 | const yuJin = {
 10 |     name: '안유진',
 11 |     year: 2003,
 12 | };
 13 | 
 14 | console.log(Object.getOwnPropertyDescriptor(yuJin, 'year'));
 15 | 
 16 | /**
 17 |  * 1) value - 실제 프로퍼티의 값
 18 |  * 2) writable - 값을 수정 할 수 있는지 여부. false로 설정하면 프로퍼티 값을
 19 |  *               수정 할 수 없다.
 20 |  * 3) enumerable - 열거가 가능한지 여부이다. for...in 룹 등을 사용 할 수 있으면
 21 |  *                 true를 반환한다.
 22 |  * 4) configurable - 프로퍼티 어트리뷰트의 재정의가 가능한지 여부를 판단한다.
 23 |  *                   false 일 경우 프로퍼티 삭제나 어트리뷰트
 24 |  *                   변경이 금지된다. 단, writable이 true인 경우
 25 |  *                   값 변경과 writable을 변경하는건 가능하다.
 26 |  */
 27 | console.log(Object.getOwnPropertyDescriptor(yuJin, 'name'));
 28 | 
 29 | console.log(Object.getOwnPropertyDescriptors(yuJin));
 30 | 
 31 | const yuJin2 = {
 32 |     name: '안유진',
 33 |     year: 2003,
 34 | 
 35 |     get age(){
 36 |         return new Date().getFullYear() - this.year;
 37 |     },
 38 | 
 39 |     set age(age){
 40 |         this.year = new Date().getFullYear() - age;
 41 |     }
 42 | }
 43 | 
 44 | console.log(yuJin2);
 45 | console.log(yuJin2.age);
 46 | 
 47 | yuJin2.age = 32;
 48 | console.log(yuJin2.age);
 49 | console.log(yuJin2.year);
 50 | 
 51 | console.log(Object.getOwnPropertyDescriptor(yuJin2, 'age'));
 52 | 
 53 | Object.defineProperty(yuJin2, 'height', {
 54 |     value: 172,
 55 |     writable: true,
 56 |     enumerable: true,
 57 |     configurable: true,
 58 | })
 59 | console.log(yuJin2);
 60 | console.log(Object.getOwnPropertyDescriptor(yuJin2, 'height'));
 61 | 
 62 | yuJin2.height = 180;
 63 | console.log(yuJin2);
 64 | 
 65 | /**
 66 |  * Writable
 67 |  */
 68 | Object.defineProperty(yuJin2, 'height', {
 69 |     writable:false,
 70 | });
 71 | console.log(Object.getOwnPropertyDescriptor(yuJin2, 'height'));
 72 | 
 73 | console.log('-------------');
 74 | yuJin2.height = 172;
 75 | console.log(yuJin2);
 76 | 
 77 | /**
 78 |  * Enumerable
 79 |  */
 80 | console.log(Object.keys(yuJin2));
 81 | for(let key in yuJin2){
 82 |     console.log(key);
 83 | }
 84 | 
 85 | Object.defineProperty(yuJin2, 'name', {
 86 |     enumerable:false,
 87 | });
 88 | 
 89 | console.log(Object.getOwnPropertyDescriptor(yuJin2, 'name'));
 90 | 
 91 | console.log('-------------');
 92 | console.log(Object.keys(yuJin2));
 93 | for(let key in yuJin2){
 94 |     console.log(key);
 95 | }
 96 | console.log(yuJin2);
 97 | console.log(yuJin2.name);
 98 | 
 99 | /**
100 |  * Configurable
101 |  */
102 | Object.defineProperty(yuJin2, 'height', {
103 |     writable: true,
104 |     configurable: false,
105 | });
106 | console.log(Object.getOwnPropertyDescriptor(yuJin2, 'height'));
107 | 
108 | // Object.defineProperty(yuJin2, 'height', {
109 | //     enumerable: false,
110 | // });
111 | 
112 | Object.defineProperty(yuJin2, 'height', {
113 |     value: 172,
114 | });
115 | console.log(Object.getOwnPropertyDescriptor(yuJin2, 'height'));
116 | 
117 | Object.defineProperty(yuJin2, 'height', {
118 |     writable: false,
119 | });
120 | console.log(Object.getOwnPropertyDescriptor(yuJin2, 'height'));
121 | 
122 | Object.defineProperty(yuJin2, 'height', {
123 |     writable: true,
124 | });
125 | 


--------------------------------------------------------------------------------
/1_basics/5_data_types.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * Data Types
  3 |  * 
  4 |  * 여섯개의 Primitive Type과
  5 |  * 한개의 오브젝트 타입이있다.
  6 |  * 
  7 |  * 1) Number (숫자)
  8 |  * 2) String (문자열)
  9 |  * 3) Boolean (불리언)
 10 |  * 4) undefined (언디파인드)
 11 |  * 5) null (널)
 12 |  * 6) Symbol (심볼)
 13 |  * 
 14 |  * 7) Object (객체)
 15 |  *    Function
 16 |  *    Array
 17 |  *    Object
 18 |  */
 19 | 
 20 | /**
 21 |  * Number 타입
 22 |  */
 23 | const age = 32;
 24 | const tempature = -10;
 25 | const pi = 3.14;
 26 | 
 27 | console.log(typeof age);
 28 | console.log(typeof tempature);
 29 | console.log(typeof pi);
 30 | console.log('--------------');
 31 | 
 32 | const infinity = Infinity;
 33 | const nInfinity = -Infinity;
 34 | 
 35 | console.log(typeof infinity);
 36 | console.log(typeof nInfinity);
 37 | console.log('--------------');
 38 | 
 39 | /**
 40 |  * String 타입
 41 |  */
 42 | const codeFactory = '"코"드팩토리';
 43 | console.log(codeFactory);
 44 | console.log(typeof codeFactory);
 45 | 
 46 | const ive = "'아이브' 안유진";
 47 | console.log(ive);
 48 | 
 49 | /**
 50 |  * Template Literal
 51 |  * 
 52 |  * Escaping Character
 53 |  * 1) newline -> \n
 54 |  * 2) tab -> \t
 55 |  * 3) 백슬래시를 스트링으로 표현하고싶다면 두번 입력하면된다.
 56 |  */
 57 | const iveYuJin = '아이브\n안유진'
 58 | console.log(iveYuJin);
 59 | const iveWonYoung = '아이브\t장원영';
 60 | console.log(iveWonYoung);
 61 | const backSlash = '아이브\\코드팩토리';
 62 | console.log(backSlash);
 63 | const smallQutoation = '아이브\'코드팩토리';
 64 | console.log(smallQutoation);
 65 | 
 66 | const iveWonYoung2 = `아이브i '" / / / / / /
 67 | 장원영`;
 68 | console.log(iveWonYoung2);
 69 | 
 70 | console.log(typeof iveWonYoung2);
 71 | 
 72 | const groupName = '아이브';
 73 | console.log(groupName + ' 안유진');
 74 | console.log(`${groupName} 안유진`);
 75 | console.log('-------------');
 76 | 
 77 | /**
 78 |  * Boolean 타입
 79 |  */
 80 | const isTrue = true;
 81 | const isFalse = false;
 82 | console.log(typeof isTrue);
 83 | console.log(typeof isFalse);
 84 | 
 85 | /**
 86 |  * undefined
 87 |  * 
 88 |  * 사용자가 직접 값을 초기화하지 않았을때
 89 |  * 지정되는 값이다.
 90 |  * 
 91 |  * 직접 undefined로 값을 초기화하는건 지양해야한다.
 92 |  */
 93 | let noInit;
 94 | console.log(noInit);
 95 | console.log(typeof noInit);
 96 | 
 97 | /**
 98 |  * null 타입
 99 |  * 
100 |  * undefined와 마찬가지로 값이 없다는 뜻이나
101 |  * JS에서는 개발자가 명시적으로 없는 값으로 초기화할때
102 |  * 사용된다.
103 |  */
104 | let init = null;
105 | console.log(init);
106 | console.log(typeof init);
107 | console.log('----------')
108 | 
109 | /**
110 |  * Symbol 타입
111 |  * 
112 |  * 유일무이한 값을 생성할때 사용한다.
113 |  * 다른 프리미티브 값들과 다르게 Symbol 함수를
114 |  * 호출해서 사용한다.
115 |  */
116 | const test1 = '1';
117 | const test2 = '1';
118 | 
119 | console.log(test1 === test2);
120 | 
121 | const symbol1 = Symbol('1');
122 | const symbol2 = Symbol('1');
123 | 
124 | console.log(symbol1 === symbol2);
125 | 
126 | /**
127 |  * Object 타입
128 |  * 
129 |  * Map
130 |  * 키:벨류의 쌍으로 이루어져있다.
131 |  * key:value
132 |  */
133 | const dictionary = {
134 |     red: '빨간색',
135 |     orange: '주황색',
136 |     yellow: '노란색',
137 | };
138 | 
139 | console.log(dictionary);
140 | console.log(dictionary['red']);
141 | console.log(dictionary['orange']);
142 | console.log(dictionary['yellow']);
143 | 
144 | console.log(typeof dictionary);
145 | 
146 | /**
147 |  * Array 타입
148 |  * 
149 |  * 값을 리스트로 나열 할 수 있는 타입이다.
150 |  */
151 | const iveMembersArray = [
152 |     '안유진',
153 |     '가을',
154 |     '레이',
155 |     '장원영',
156 |     '리즈',
157 |     '이서',
158 | ];
159 | console.log(iveMembersArray);
160 | 
161 | /**
162 |  * index
163 |  * 
164 |  * 0부터 시작한다.
165 |  * 1씩 올라갑니다.
166 |  */
167 | console.log(iveMembersArray[0]);
168 | console.log(iveMembersArray[5]);
169 | 
170 | iveMembersArray[0] = '코드팩토리';
171 | console.log(iveMembersArray);
172 | console.log(typeof iveMembersArray);
173 | 
174 | /**
175 |  * static typing -> 변수를 선언할때 어떤 타입의 변수를 선언할지 명시를한다.
176 |  *                  C
177 |  * dynamic typing -> 변수의 타입을 명시적으로 선언하지 않고 갑에의해 타입을 "추론"한다.
178 |  * JS -> dynamic typing
179 |  */


--------------------------------------------------------------------------------
/2_class_and_oop/6_class_problem.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * 클래스 강의를 끝낸기념 문제
  3 |  * 
  4 |  * 1) Country 클래스는 나라 이름과 나라에 해당되는 아이돌 그룹정보를 
  5 |  *    리스트로 들고있다. (name 프로퍼티, idolGroups 프로퍼티)
  6 |  * 2) IdolGroup 클래스는 아이돌 그룹 이름과 멤버 정보를 리스트로 들고있다.
  7 |  *    (name 프로퍼티, members 프로퍼티)
  8 |  * 3) Idol 클래스는 아이돌 이름과 출생년도 정보를 들고있다.
  9 |  *    (name 프로퍼티, year 프로퍼티)
 10 |  * 4) MaleIdol 클래스는 Idol 클래스와 동일하게 
 11 |  *    name, year 프로퍼티가 존재한다
 12 |  *    추가로 sing() 함수를 실행하면 ${이름}이 노래를 합니다.
 13 |  *    라는 스트링을 반환해준다.
 14 |  * 5) FemaleIdol 클래스는 Idol 클래스와 동일하게
 15 |  *    name, year 프로퍼티가 존재한다.
 16 |  *    추가로 dance() 함수를 실행하면 ${이름}이 춤을 춥니다.
 17 |  *    라는 스트링을 반환해준다.
 18 |  * 
 19 |  * 아래 정보가 주어졌을때 위 구조로 데이터를 형성해보라.
 20 |  * map() 함수를 잘 활용하면 좋다.
 21 |  */
 22 | 
 23 | // 아이브는 한국 아이돌이고
 24 | // 아이브라는 이름의 걸그룹이다.
 25 | // 아이브는 여자 아이돌이다.
 26 | const iveMembers = [
 27 |     {
 28 |         name: '안유진',
 29 |         year: 2003,
 30 |     },
 31 |     {
 32 |         name: '가을',
 33 |         year: 2002,
 34 |     },
 35 |     {
 36 |         name: '레이',
 37 |         year: 2004,
 38 |     },
 39 |     {
 40 |         name: '장원영',
 41 |         year: 2004,
 42 |     },
 43 |     {
 44 |         name: '리즈',
 45 |         year: 2004,
 46 |     },
 47 |     {
 48 |         name: '이서',
 49 |         year: 2007,
 50 |     },
 51 | ]
 52 | 
 53 | // BTS는 한국 아이돌이고
 54 | // 방탄소년단이라는 이름의 보이그룹이다.
 55 | // BTS는 남자 아이돌이다.
 56 | const btsMembers = [
 57 |     {
 58 |         name: '진',
 59 |         year: 1992,
 60 |     },
 61 |     {
 62 |         name: '슈가',
 63 |         year: 1993,
 64 |     },
 65 |     {
 66 |         name: '제이홉',
 67 |         year: 1994,
 68 |     },
 69 |     {
 70 |         name: 'RM',
 71 |         year: 1994,
 72 |     },
 73 |     {
 74 |         name: '지민',
 75 |         year: 1995,
 76 |     },
 77 |     {
 78 |         name: '뷔',
 79 |         year: 1995,
 80 |     },
 81 |     {
 82 |         name: '정국',
 83 |         year: 1997,
 84 |     },
 85 | ]
 86 | 
 87 | class Country{
 88 |     name;
 89 |     idolGroups;
 90 | 
 91 |     constructor(name, idolGroups){
 92 |         this.name = name;
 93 |         this.idolGroups = idolGroups;
 94 |     }
 95 | }
 96 | 
 97 | class IdolGroup{
 98 |     name;
 99 |     members;
100 | 
101 |     constructor(name, members){
102 |         this.name = name;
103 |         this.members = members;
104 |     }
105 | }
106 | 
107 | class Idol{
108 |     name;
109 |     year;
110 | 
111 |     constructor(name, year){
112 |         this.name = name;
113 |         this.year = year;
114 |     }
115 | }
116 | 
117 | class FemaleIdol extends Idol{
118 |     sing(){
119 |         return `${this.name}이 노래를 합니다.`;
120 |     }
121 | }
122 | 
123 | class MaleIdol extends Idol{
124 |     dance(){
125 |         return `${this.name}이 춤을 춥니다.`;
126 |     }
127 | }
128 | 
129 | const cIveMembers = iveMembers.map(
130 |     (x) => new FemaleIdol(x['name'], x['year']),
131 | );
132 | console.log(cIveMembers);
133 | 
134 | const cBtsMembers = btsMembers.map(
135 |     (x) => new MaleIdol(x['name'], x['year']),
136 | );
137 | console.log(cBtsMembers);
138 | 
139 | const iveGroup = new IdolGroup(
140 |     '아이브',
141 |     cIveMembers,
142 | )
143 | console.log(iveGroup);
144 | 
145 | const btsGroup = new IdolGroup(
146 |     'BTS',
147 |     cBtsMembers,
148 | );
149 | console.log(btsGroup);
150 | 
151 | const korea = new Country(
152 |     '대한민국',
153 |     [
154 |         iveGroup,
155 |         btsGroup,
156 |     ],
157 | );
158 | console.log(korea);
159 | 
160 | const allTogether = new Country(
161 |     '대한민국',
162 |     [
163 |         new IdolGroup(
164 |             '아이브',
165 |             iveMembers.map(
166 |                 (x) => new FemaleIdol(x['name'], x['year']),
167 |             ),
168 |         ),
169 |         new IdolGroup(
170 |             '방탄소년단',
171 |             btsMembers.map(
172 |                 (x) => new MaleIdol(x['name'], x['year']),
173 |             ),
174 |         ),
175 |     ],
176 | );
177 | console.log(allTogether);


--------------------------------------------------------------------------------
/3_all_about_object/5_prototype_chain.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * Prototype
  3 |  */
  4 | const testObj = {};
  5 | 
  6 | // __proto__ 모든 객체에 존재하는 프로퍼티다.
  7 | // class 강의에서 배울때 상속에서 부모 클래스에 해당되는 값이다.
  8 | console.log(testObj.__proto__);
  9 | 
 10 | function IdolModel(name, year) {
 11 |     this.name = name;
 12 |     this.year = year;
 13 | }
 14 | 
 15 | console.log(IdolModel.prototype);
 16 | 
 17 | // console.dir(IdolModel.prototype, {
 18 | //     showHidden: true,
 19 | // });
 20 | 
 21 | // circular reference
 22 | console.log(IdolModel.prototype.constructor === IdolModel);
 23 | console.log(IdolModel.prototype.constructor.prototype === IdolModel.prototype);
 24 | 
 25 | const yuJin = new IdolModel('안유진', 2003);
 26 | 
 27 | console.log(yuJin.__proto__);
 28 | console.log(yuJin.__proto__ === IdolModel.prototype);
 29 | 
 30 | console.log(testObj.__proto__ === Object.prototype);
 31 | 
 32 | console.log(IdolModel.__proto__ === Function.prototype);
 33 | console.log(Function.prototype.__proto__ === Object.prototype);
 34 | console.log(IdolModel.prototype.__proto__ === Object.prototype);
 35 | 
 36 | console.log(yuJin.toString());
 37 | console.log(Object.prototype.toString());
 38 | 
 39 | function IdolModel2(name, year) {
 40 |     this.name = name;
 41 |     this.year = year;
 42 | 
 43 |     this.sayHello = function () {
 44 |         return `${this.name}이 인사를 합니다.`;
 45 |     }
 46 | }
 47 | 
 48 | const yuJin2 = new IdolModel2('안유진', 2003);
 49 | const wonYoung2 = new IdolModel2('장원영', 2002);
 50 | 
 51 | console.log(yuJin2.sayHello());
 52 | console.log(wonYoung2.sayHello());
 53 | console.log(yuJin2.sayHello === wonYoung2.sayHello);
 54 | 
 55 | console.log(yuJin2.hasOwnProperty('sayHello'));
 56 | 
 57 | function IdolModel3(name, year) {
 58 |     this.name = name;
 59 |     this.year = year;
 60 | }
 61 | 
 62 | IdolModel3.prototype.sayHello = function () {
 63 |     return `${this.name}이 인사를 합니다.`;
 64 | }
 65 | 
 66 | const yuJin3 = new IdolModel3('안유진', 2003);
 67 | const wonYoung3 = new IdolModel3('장원영', 2004);
 68 | 
 69 | console.log(yuJin3.sayHello());
 70 | console.log(wonYoung3.sayHello());
 71 | 
 72 | console.log(yuJin3.sayHello === wonYoung3.sayHello);
 73 | 
 74 | console.log(yuJin3.hasOwnProperty('sayHello'));
 75 | 
 76 | IdolModel3.sayStaticHello = function () {
 77 |     return '안녕하세요 저는 static method 입니다.';
 78 | }
 79 | 
 80 | console.log(IdolModel3.sayStaticHello());
 81 | 
 82 | /**
 83 |  * Overriding
 84 |  */
 85 | function IdolModel4(name, year) {
 86 |     this.name = name;
 87 |     this.year = year;
 88 | 
 89 |     this.sayHello = function () {
 90 |         return '안녕하세요 저는 인스턴스 메서드입니다!';
 91 |     }
 92 | }
 93 | 
 94 | IdolModel4.prototype.sayHello = function () {
 95 |     return '안녕하세요 저는 prototype 메서드입니다!';
 96 | }
 97 | 
 98 | const yuJin4 = new IdolModel4('안유진', 2003);
 99 | 
100 | // 프로퍼티 셰도잉 - class에서 override
101 | console.log(yuJin4.sayHello());
102 | 
103 | /**
104 |  * getPrototypeOf, setPrototypeOf
105 |  * 
106 |  * 인스턴스의 __proto__ 변경 vs 함수의 prototype 변경
107 |  */
108 | function IdolModel(name, year) {
109 |     this.name = name;
110 |     this.year = year;
111 | }
112 | 
113 | IdolModel.prototype.sayHello = function () {
114 |     return `${this.name} 인사를 합니다.`;
115 | }
116 | 
117 | function FemaleIdolModel(name, year) {
118 |     this.name = name;
119 |     this.year = year;
120 | 
121 |     this.dance = function(){
122 |         return `${this.name}가 춤을 춥니다.`;
123 |     }
124 | }
125 | 
126 | const gaEul = new IdolModel('가을', 2004);
127 | const ray = new FemaleIdolModel('레이', 2004);
128 | 
129 | console.log(gaEul.__proto__);
130 | console.log(gaEul.__proto__ === IdolModel.prototype);
131 | console.log(Object.getPrototypeOf(gaEul) === IdolModel.prototype);
132 | 
133 | console.log(gaEul.sayHello());
134 | console.log(ray.dance());
135 | console.log(Object.getPrototypeOf(ray) === FemaleIdolModel.prototype);
136 | // console.log(ray.sayHello());
137 | 
138 | Object.setPrototypeOf(ray, IdolModel.prototype);
139 | console.log(ray.sayHello());
140 | 
141 | console.log(ray.constructor === FemaleIdolModel);
142 | console.log(ray.constructor === IdolModel);
143 | console.log(gaEul.constructor === IdolModel);
144 | console.log(Object.getPrototypeOf(ray) === FemaleIdolModel.prototype);
145 | console.log(Object.getPrototypeOf(ray) === IdolModel.prototype);
146 | console.log(FemaleIdolModel.prototype === IdolModel.prototype);
147 | 
148 | FemaleIdolModel.prototype = IdolModel.prototype;
149 | 
150 | const eSeo = new FemaleIdolModel('이서', 2007);
151 | console.log(Object.getPrototypeOf(eSeo) === FemaleIdolModel.prototype);
152 | console.log(FemaleIdolModel.prototype === IdolModel.prototype);


--------------------------------------------------------------------------------
/1_basics/7_operators.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * Operators
  3 |  * 
  4 |  * 연산자
  5 |  */
  6 | 
  7 | /**
  8 |  * 산술 연산자
  9 |  * 
 10 |  * 1) 덧셈
 11 |  * 2) 뺄셈
 12 |  * 3) 곱셈
 13 |  * 4) 나눗셈
 14 |  * 5) 나머지
 15 |  */
 16 | console.log(10 + 10);
 17 | console.log(10 - 10);
 18 | console.log(10 * 10);
 19 | console.log(10 / 10);
 20 | console.log(10 % 10);
 21 | console.log(10 % 3);
 22 | 
 23 | console.log('-----------');
 24 | 
 25 | console.log(10 * (10 + 10));
 26 | 
 27 | /**
 28 |  * 증가와 감소
 29 |  */
 30 | let number = 1;
 31 | 
 32 | number++;
 33 | console.log(number);
 34 | 
 35 | number--;
 36 | console.log(number);
 37 | console.log('---------');
 38 | 
 39 | /**
 40 |  * 연산자의 위치
 41 |  */
 42 | let result = 1;
 43 | console.log(result);
 44 | 
 45 | result = number++;
 46 | console.log(result, number);
 47 | 
 48 | result = number--;
 49 | console.log(result, number);
 50 | 
 51 | result = ++number;
 52 | console.log(result, number);
 53 | 
 54 | result = --number;
 55 | console.log(result, number);
 56 | 
 57 | /**
 58 |  * 숫자 타입이 아닌 타입에 +, - 사용하면 어떻게될까?
 59 |  */
 60 | let sample = '99';
 61 | 
 62 | console.log(+sample);
 63 | console.log(typeof +sample);
 64 | 
 65 | console.log(sample);
 66 | console.log(typeof sample);
 67 | 
 68 | sample = true;
 69 | console.log(+sample);
 70 | console.log(typeof +sample);
 71 | 
 72 | sample = false;
 73 | console.log(+sample);
 74 | console.log(typeof +sample);
 75 | 
 76 | sample = '안유진';
 77 | // NaN -> Not a Number
 78 | console.log(+sample);
 79 | 
 80 | sample = '99';
 81 | console.log(-sample);
 82 | console.log(typeof -sample);
 83 | 
 84 | /**
 85 |  * 할당 연산자 (assignment operator)
 86 |  */
 87 | number = 100;
 88 | console.log(number);
 89 | 
 90 | number += 10;
 91 | console.log(number);
 92 | 
 93 | number -= 10;
 94 | console.log(number);
 95 | 
 96 | number *= 10;
 97 | console.log(number);
 98 | 
 99 | number /= 10;
100 | console.log(number);
101 | 
102 | number %= 10;
103 | console.log(number);
104 | 
105 | /**
106 |  * 비교 연산자
107 |  * 
108 |  * 1) 값의 비교
109 |  * 2) 값과 타입의 비교
110 |  */
111 | 
112 | console.log(5 == 5);
113 | console.log(5 == '5');
114 | console.log(0 == '');
115 | console.log(true == 1);
116 | console.log(false == 0);
117 | console.log(true == '1');
118 | 
119 | console.log(5 === 5);
120 | console.log(5 === '5');
121 | console.log(0 === '');
122 | console.log(true === 1);
123 | console.log(false === 0);
124 | console.log(true === '1');
125 | 
126 | console.log('------------');
127 | 
128 | console.log(5 != 5);
129 | console.log(5 != '5');
130 | console.log(0 != '');
131 | console.log(true != 1);
132 | console.log(false != 0);
133 | console.log(true != '1');
134 | 
135 | console.log('-------------')
136 | 
137 | console.log(5 !== 5);
138 | console.log(5 !== '5');
139 | console.log(0 !== '');
140 | console.log(true !== 1);
141 | console.log(false !== 0);
142 | console.log(true !== '1');
143 | 
144 | console.log('------------');
145 | 
146 | /**
147 |  * 대소 관계 비교 연산자
148 |  */
149 | console.log(100 > 1);
150 | console.log(100 < 1);
151 | console.log(100 <= 1);
152 | console.log(100 >= 1);
153 | 
154 | /**
155 |  * 삼항 조건 연산자 (ternary operator)
156 |  */
157 | console.log(10 > 0 ? '10이 0보다 크다' : '10이 0보다 작다');
158 | 
159 | console.log('------------');
160 | /**
161 |  * 논리 연산자
162 |  * 
163 |  * 1) && (and)
164 |  * 2) || (or)
165 |  */
166 | 
167 | // && 조건은 모두 true여야 true를 반환한다.
168 | console.log(true && true);
169 | console.log(true && false);
170 | console.log(false && true);
171 | console.log(false && false);
172 | 
173 | console.log('------------');
174 | 
175 | // ||는 하나만 true여도 true를 반환한다.
176 | console.log(true || true);
177 | console.log(true || false);
178 | console.log(false || true);
179 | console.log(false || false);
180 | console.log('------------');
181 | 
182 | console.log(10 > 1 && 20 > 2);
183 | console.log(10 < 1 && 20 > 2);
184 | console.log(10 < 1 && 20 < 2);
185 | 
186 | console.log(10 > 1 || 20 > 2);
187 | console.log(10 < 1 || 20 > 2);
188 | console.log(10 < 1 || 20 < 2);
189 | 
190 | /**
191 |  * 단축평가 (short circuit evaluation)
192 |  * 
193 |  * &&를 사용했을때 좌측이 true면 우측 값 반환
194 |  * &&를 사용했을때 좌측이 false면 좌측 값 반환
195 |  * ||를 사용했을때 좌측이 true면 좌측 값 반환
196 |  * ||를 사용했을때 좌측이 false면 우측 값 반환
197 |  */
198 | console.log('------------');
199 | 
200 | console.log(true || '아이브');
201 | console.log(false || '아이브');
202 | console.log(false && '아이브');
203 | console.log(true && '아이브');
204 | 
205 | console.log(true && true && '아이브');
206 | console.log(true && false && '아이브');
207 | 
208 | /**
209 |  * 지수 연산자
210 |  */
211 | console.log(2 ** 2);
212 | console.log(10 ** 3);
213 | 
214 | /**
215 |  * null 연산자
216 |  */
217 | let name;
218 | console.log(name);
219 | 
220 | name = name ?? '코드팩토리';
221 | console.log(name);
222 | 
223 | name = name ?? '아이브';
224 | console.log(name);
225 | 
226 | let name2;
227 | name2 ??= '코드팩토리';
228 | console.log(name2);


--------------------------------------------------------------------------------