[시작하기전...]
특문요약본 (강의자료에서 첨부)
[8장 이어서...]
this키워드
객체는 상태를 나타내는 프로퍼티, 동작을 나타내는 메서드를 하나의 논리적인 단위로 묶음 복합적인 자료구조이다. 메서드는 자신이 속한 객체의 상태, 즉 프로퍼티를 참조하고 변경할 수 있어야한다. 이때 생성할 인스턴스를 가리키는 식별자를 this로 구분하게 한다.
일반 함수 호출
// 일반 함수 호출, 전역객체
function foo() {
// foo 라는 function 안에서 this를 한번 찍어봐
console.log("foo's this: ", this); // window
function bar() {
// bar 라는 function 안에서 this를 한번 찍어봐
console.log("bar is this : ", this); // window
}
bar();
}
foo();
// 기본적으로 window 를 전역객체의 default 값으로 가지기 때문에 window 의 객체값을 가져온다
// 아 그냥 this는 전역객체에서 window 이다~ 라고 이해하면 될듯메서드 호출
// 메서드 호출
const person = {
name: "Lee",
getName() {
return this.name;
},
};
console.log(person.getName());
// 메서드를 호출할 때는 . 앞에 인스턴스를 붙여줘서 호출할 메서드가 뭔지 정확하게 한다.
const anotherPerson = {
name: "Kim",
};
anotherPerson.getName = person.getName;
console.log(anotherPerson.getName());
const getName = person.getName;
console.log(getName());
console.log(person.getName());
// 가장 많이 사용하는 호출방식, 메서드 앞에 .찍고 앞에 호출한 객체(this가 될 수 있다)를 넣어서
// 그 객체의 값들을 바인딩한다.
생성자함수 호출
// 생성자 함수 정의
function Circle(radius) {
this.radius = radius;
this.getDiameter = function () {
return 2 * this.radius;
};
}
// 여기까지는 아무런 값도 얻을 수 없음, why? 인수로 넣은게 없거든
const circle1 = new Circle(5);
// 5를 Circle 함수에 인수로 던질거야 그럼, function Circle 에서
// 선언된 인스턴스 circle1의 함수를 하나 만들어줄거고 여기서는 5를 매개변수로
// 프로퍼티와 메서드를 생성하겠지
console.log(circle1.getDiameter());
// 그중에 메서드 getDiameter 를 출력하겠다는거야
// 생성자 함수가 미래에 생성할 인스턴스가 바인딩된다.Function.prototype.apply/call/bind 메서드에 의한 간접 호출
이라는 것도 있다~~
[9장 스코프]
스코프
식별자 접근 규칙에 따른 유효범위이며 중괄호(블록) 또는 함수에 의해 나눠진다.
function add(x, y) {
// 매개변수는 함수 몸체 내에서만 작동한다.
console.log(x, y); // 2 5
return x + y;
}
add(2, 5);
// 함수 밖에서는 작동하지 않는다.
console.log(x, y); // 에러
// 전역에서 선언된 x
var x = "global";
function foo() {
// 지역에서 선언된 x
var x = "local";
console.log(x); // "local"
}
foo(); // 함수 호출 : 함수는 항상 호출이 되어야지만 등장하는 수동적인 친구들
console.log(x); // "global"
체인스코프
전역스코프, 지역스코프(outer), 지역스코프(inner) 쭉 연결되어있는 스코프들
(강의자료 사진참고)
var x = "global";
function foo() {
var x = "local";
console.log(x); // local
function bar() {
console.log(x); // local
}
bar(); // 함수가 호출이 되어서 함수 실행가능
}
foo(); // 함수가 호출되어 함수 실행 가능
console.log(x); // global함수레벨 스코프
var a = 10; // 전역변수
// 즉시 실행함수 = 지역변수
(function () {
var b = 20; // 지역변수
})();
console.log(a); // 10
console.log(b); // "b" is not defined
var x = "global";
function foo() {
var x = "local";
console.log(x);
}
foo();
console.log(x);
// 예제
var j = 10; // 바뀐적 없음
function joo() {
var j = 100; // 새로운 j !!!!
console.log(j);
function jar() {
j = 1000;
console.log(j); // 재할당
}
jar(); // 함수 호출
}
joo(); // 함수 호출
console.log(j);
//예제
// 지역스코프는 코드블록이 아닌 함수에 의해서만 생성된다.
var q = 1;
if (true) {
var q = 10;
}
console.log(q); //10
// 예제
var e = 10;
// for 문에서 선안한 e 는 전역변수이다.
// 이미 선언된 전역변수 e 가 있으므로 중복선언된다.
for(var e = 0; e <5; e++){
console.log(e); // 0 1 2 3 4
}
// 의도치 않게 변수의 값이 저장되었다.
// e 가 5가 되면서 for문이 실행되지 않고 나옴
console.log(e); // 5렉시컬 스코프
동적 스코프:함수를 어디서 호출했는지에 따라 함수의 상위 스코프를 결정한다.
렉시컬, 정적스코프:함수를 어디서 정의했는지에 따라 함수의 상위 스코프를 결정한다.
// 렉시컬 스코프 예제
var x = 1;
function foo() {
var x = 10;
bar();
}
function bar() {
console.log(x);
}
foo(); // console.log는 없지만 foo()에서 bar()를 실행했기 때문에
// bar 의 console.log(x)가 출력된다.
bar(); // bar()를 실행하면서 bar()에 있는 console.log(x)가 출력된다.특강 + 자습 하는 날 ~
특강으로, 협업툴소프트웨어를 만들고 있는 회사 콜라비의 대표 조용상대표님이 오셔서 두시간동안 강연을 해주셨다.
가장 핵심적인 내용으로는 우리가 왜 디지털 트윈이라는 주제를 담고 부트캠프를 하고 있는지, 그리고 사회라는 무대로 나가기전에 어떤 마음가짐이었으면 하는지 사회생활선배의 입장에서 말씀주셨다.
디지털 트윈, AR, VR, 비트코인, NFT, DAO 등등 새로운 기술을 바탕으로 우리에게 다가오고 있으면서 친숙하지만 익숙하지 않은 용어들이 향하고 있는 메타버스라는 개념, 가상현실세계는 어디쯤에 있는지 어떻게 천천히 그렇지만 급작스럽게 다가오고 있는지...
