JS 특강 3주차를 들으며..

2주차 : es6, 일급객체로서의 함수, Map과 Set

3주차 : 데이터 타입(심화), 실행 컨텍스트, this

 

1주차는 '응응 아는 것이군' 하면서 들었는데 2주차 3주차 늘어날수록.. 머릴 부여잡게 된다..

본캠프에서의 1주차 마인드를 지닌채 주말을 보냈어야 하는데 너무 게을리 보냈나

대략 30분에서 1시간 정도 졸았던 것 같다

3주차 강의 중간까지 듣다가 내일 나머지를 들을까 했는데

그나마 한 번 훑고 다시 보는게 좋을 것 같다 싶어 3주차까지 완강했다.

 

var user = {
    name: "john",
    age: 20,
}

var getAged = function (user, passedTime) {
	var newUser = {};
    for (var prop in user) {
        newUser[prop] = user[prop];
    }
    newUser.age += passedTime;
    return newUser;
}


var agedUser = getAged(user, 6);

var agedUserMustBeDifferentFromUser = function (user1, user2) {
    if (!user2) {
		    console.log("Failed! user2 doesn't exist!");
	  } else if (user1 !== user2) { 
        console.log("Passed! If you become older, you will be different from you in the past!")
    } else {
        console.log("Failed! User same with past one");
    }
}

agedUserMustBeDifferentFromUser(user, agedUser);

 

var fullname = 'Ciryl Gane'

var fighter = {
    fullname: 'John Jones',
    opponent: {
        fullname: 'Francis Ngannou',
        getFullname: function () {
            // 1. 객체 this 바인딩 : 프란시스 은가누
            return this.fullname;
        }
    },

    getName: function() {
        // 2. 객체 this 바인딩 : 존 존스
        return this.fullname;
    },

    getFirstName: () => {
        // 3. 함수 this 바인딩 : 시릴
        return this.fullname.split(' ')[0];
    },

    //즉시 실행 함수
    getLastName: (function() {
        // 4. 함수 this 바인딩 : 가네
        return this.fullname.split(' ')[1];
    })()

}

console.log('Not', fighter.opponent.getFullname(), 'VS', fighter.getName());
console.log('It is', fighter.getName(), 'VS', fighter.getFirstName(), fighter.getLastName);

// fighter.opponent.getFullname() : 호출의 주체가 명확하기 때문에 메서드
// fighter.getName() : 호출의 주체가 명확하기 때문에 메서드
// fighter.getFirstName() : 화살표 함수 => this 바인딩 안 한다는 것 => 상위 this 바라봄
// fighter.getListName : ()호출부 없음 => 이름을 통해 (function() {return this.fullname.split(' ')[1];})()
// 이 부분을 콜한 것(=대체했다) => 호출하는 주체가 없기 때문에 전역 객체 바라봄