메타 스터디15 웹 개념 웹? 가상의 연결망 세계다. 어떤? 우리가 사용하는 웹 브라우저를 통해 다른 웹페이지들로 이동하는데 이동이 가능하게 해주는 세계가 바로 웹이라는 세계다! url? 특정 데이터를 나타내는 문자열 url 구성요소 scheme - http 또는 https host - 전 세계의 서버 중 하나의 특정 서버를 나타냄 path - 특정 서버에 있는 데이터중 특정 데이터를 나타냄 query - 특정 데이터에 있는 세부사항을 나타냄 http? 브라우저와 서버 간에 hyper text(이외에 동영상, 이미지, 소리 등이 있다)를 전달하기 위해서 정한 약속 사용자가 보고 있는 웹페이지에는 과연 하나의 req와 rep가 있을까? nono 개발자 도구 켜서 network 버튼을 누르고 새로고침 하면 얼마나 많은 req-res.. 메타 스터디/web 2022. 5. 21. 전역 변수의 문제점(the problem with global variable) 변수의 생명 주기 메모리 공간 확보(allocate), 해제(release), 가용 메모리 풀(memory pool)에 반환까지 메모리 공간의 해제(release)는 어떻게 되는 걸까? 가비지 콜렉터가 더이상 참조되지 않는 메모리 공간으로 인식하면 해당 메모리 공간을 해제한 후 memory pool에 반환한다. 지역변수의 생명 주기 함수 생명주기가 끝날 때까지 전역 변수의 생명주기 모든 실행문들이 실행된 후 사라짐 window 객체가 있는 웹 페이지를 예시로 들면 모든 웹페이지를 종료 할때 사라진다. 문제점 모든 코드가 암묵적 결합(implicit binding)의 가능 성을 가지기 때문에 값이 변할 위험이 크다. 해결법 생명 주기를 줄인다. 어떻게? 스코프를 줄인다. 어떻게? 4가지 방법이 있다. 즉시.. 메타 스터디/JavaScript 2022. 5. 18. 스코프(scope) 코드의 유효 범위를 뜻한다. 실행 컨텍스트(execution context) 모든 코드의 평가와 실행이 이루어 지는 곳 이안에 렉시컬 환경이 있음 렉시컬 환경(lexical environment) 코드의 위치, 주변의 어떤 코드가 있는지를 말하는 것 스코프 체인(scope chain) 렉시컬 환경에 있는 스코프들을 단반향으로 연결한 것 자바스크립트가 스코프로 검색하는 원리 이벤트 지점부터 부모 요소로 퍼지는 버블링처럼 현 위치 스코프부터 찾고자 하는 스코프가 나올 때까지 스코프 체인을 통해서 상위 스코프로 올라간다. 찾고자 하는 스코프가 나오면 검색을 종료한다. p.s 최상위 스코프는 전역 스코프(global scope) 자바스크립트에서 함수의 상위 스코프는 어떻게 정해 질까? 함수의 스코프는 호출 되는.. 메타 스터디/JavaScript 2022. 5. 17. 함수(function) 함수란? 실행문들을 코드 블록으로 묶어 하나의 실행 단위로 정의한 것 인자? 전달인자? 매개변수를 parameter, 인수를(argument)라고 표현 다른 표현으로는 인자(자바스크립트 deep dive 168pg)와 전달 인자? 함수 사용하는 이유? 하나의 결과 값을 재도출하기 위한 실행문들의 번복을 막음 함수 선언과 함수 표현식 차이 함수 선언은 값으로 사용하지 않은 선언만 한 함수이고 함수 표현식은 함수를 값(식별자에 함수를 할당한 것)으로 사용한 것이다. 함수 정의 방법 4가지 함수 선언문, 함수 표현식, Function 생성자 함수, 화살표 함수(트렌디한 함수 정의 법) 함수 정의되는 원리 함수 선언 시 사용되는 객체를 평가한다. 객체에 있는 함수 이름은 객체 내부에서만 사용된다(외부 x) 함수.. 메타 스터디/JavaScript 2022. 5. 17. 원시 값과 객체의 비교(comparison between primitive value and object) 원시 값과 객체의 다른 점 세 가지 immutable value vs mutable value pass by value vs pass by reference(이 표현은 모던 자바스크립트 deep dive에서 값의 전달 형태를 구분하기 위해 표현됨, 실제로는 pass by sharing을 쓴다고 한다) store real value vs store reference value 원시 값(primitive value) 값이 절대 바뀌지 않는다.(값이 바뀐다고 착각하는 이유는 변수에 새로운 값이 할당될 때 메모리 주소가 이전되는 것을 몰라서 그럴 확률이 크다.) 값이 저장되는 원리 변수에 할당될 표현식을 읽어 메모리 공간의 사이즈를 확보해 해당 메모리 주소에 값을 저장한다. 선언된 변수는 현 메모리 주소에서 새.. 메타 스터디/JavaScript 2022. 5. 13. 객체 리터럴(object literal) 객체(object) 0개 이상의 프로퍼티의 집합 자바스크립트에서 원시 값(immutable value)을 제외한 모든 값은 객체 값(mutable value)이다 property와 method 구분 property는 상태를 나타내고 method는 객체 안에 있는 property를 참조하고 조작하는 동작 엄밀히 말하면 메서드도 프로퍼티인데 명시적으로 구분을 짓기 위해서 property와 method를 구분지어서 말하는 것 같다.. {property, property, method // 메서드도 프로퍼티이지만 객체 내의 요소를 구분할 때는 간단히 property와 method로 구분 지어서 말한다 } 클래스 기반과 프로토타입 기반 객체지향 언어 C, 자바 (클래스 기반 객체지향 언어) ←→ JavaScrip.. 메타 스터디/JavaScript 2022. 5. 13. 타입 변환과 단축 평가(type conversion and short-circuit evaluation) 타입이 없는 값은 없다. 명시적 타입 변환(explicit coercion/ type casting) 개발자 의도한 대로 타입 변환이 되는 것 암묵적 타입 변환implicit coercion/ type coercion 자바스크립트 엔진 자체에서 타입 변환되는 것 코드에 타입 변환을 한다는 것이 명시적으로 나타나 있지 않다. 표현식에 여러 타입을 같이 계산하게 되는 경우에 자바스크립트 엔진이 문맥에 따라 필요한 타입을 인식하고 해당 타입이 아닌 피연산자를 식별해 타입을 변환하는데 이것을 type coercion이라고 한다. 연산자의 역할을 파악하는 것이 타입 예측에 도움이 되는 것 같다. 타입 변환시 값은 어떻게 변할까? 타입 변환시 새로운 값을 생성한다고 한다. 다른 메모리 주소에 변환 하려고 하는 타입.. 메타 스터디/JavaScript 2022. 5. 11. 제어문(control flow statement) 역할 말그대로 코드의 흐름을 제어 할 수 있는 문이다. 단점 코드의 흐름을 제어 하는 만큼 코드의 흐름을 해칠 수 있다. 개선책 코드의 흐름을 해치지 않고 가독성을 높이기 위해 고차함수(higher-order function)을 쓰는 걸 권장한다고 한다. 나중에 함수형 프로그래밍을 공부해보자! 블록문(block statement/compound statement?) 하나의 실행단위 조건문(conditional statement) 조건의 참,거짓 유무에 따라 코드블록 실행 결정 종류 삼항 연산자(ternary operator) 간단한 값 연산시 사용 값으로 평가되서 중첩가능! if ...else 복잡한 연산이 많을 때 사용 switch 조건이 너무 많을 때 사용하면 좋다. type coercion 있음 반.. 메타 스터디/JavaScript 2022. 5. 10. 연산자 연산자란(operator)? 피연산자(operand)를 가지고 값으로 평가 될 수 있는 표현식을 만들 수 있게 수행하는 역할을 함 산술 연산자(arithmetic operator) 수학적 계산을 수행 이항(binary) 산술 연산자 두개의 피연산자(숫자)를 연산하는 역할 단항(unary) 산술 연산자 하나의 피연산자(숫자)를 연산하는 역할 문자열 연산자(산술 연산자 개념과 다름) ‘+’ 를 사용하는데 숫자와 문자 타입에 영향을 준다. 암묵적 타입 변환(implicit coercion) === 타입 강제 변환(type coercion) coercion - 강제 type coercion은 자바스크립트 엔진에서 일어나는데 개발자가 예측하지 못하는 타입 변환이 일어나기 때문에 주의 해야한다. 되도록이면 일치 연.. 메타 스터디/JavaScript 2022. 5. 7. 데이터 타입 종류 원시타입(Number, String, Boolean, null, undefined, symbol, BigInt) 그리고 객체타입 총 8개 숫자 타입 값의 저장 형태 배정밀도 64bit 부동소수점 형식(double precision 64bit floating point) 모든 수가 실수로 처리된다. 특이한 숫자 값 3가지 NaN Infinity -Infinity 문자열 타입 16bit 유니코드 문자?? 자바스크립트언어에서 문자열은 immutable value이다. Line Feed와 Carriage Return 각 운영 체제마다 LF와 CR의 사용 유무가 다른데 텍스트 에디터에서 운영체제에 맞게 개행을 잘 변환해 준다고 하니 걱정 할 건 없다. ASCII 코드 (American Standard Cod.. 메타 스터디/JavaScript 2022. 5. 7. 표현식과 문 값(value) 식이 평가되어 생성된 결과 0과 1의 나열인 비트 형식으로 저장되며 같은 2진수의 나열이어도 데이터 타입에 따라 다른 값으로 평가된다. 리터럴(literal) 사람이 이해할 수 있는 문자와 약속된 기호를 사용해서 값을 생성하는 표기법 표현식(expression) 값으로 평가될 수 있는 문. 즉, 값으로 평가되지 않는 문이라면 표현식이 아니다.(에러나 결과 값이 undefined 같은 경우) 문(statement) 프로그램을 실행하는 최소 단위 표현 식인 문과 표현식이 아닌 문으로 구별할 수 있는 상위 개념 토큰(token) 코드의 최소 문법 단위 ASI(automatic semicolone insertion) 뭘까? 자바스크립트 엔진이 문이 끝난다고 예상되는 지점에 자동으로 세미콜론을 붙.. 메타 스터디/JavaScript 2022. 5. 3. 변수 변수(variable) 확보한 메모리 공간을 식별하기 위해 지어진 고유한 이름 변수가 값을 읽는 원리 변수는 값이 아닌 값을 담고 있는 메모리 주소를 가리키고 메모리 주소를 통해 값을 참조한다. 메모리 셀(memory cell) 하나의 메모리 셀 크기는 1Byte(8Bit)이다. 메모리 셀의 집합을 메모리라고 한다. 식별자(identifier) 메모리에 존재하는 값들을 구분하기 위해 메모리 주소에 붙인 고유한 이름을 식별자라고 함. 실행 컨텍스트(execution context) 모든 식별자는 실행 컨텍스트에 등록됨 변수와 식별자의 차이점? 변수는 식별자이지만 식별자는 변수, 함수(자바스크립트에서 값), 클래스(?) 등 모든 값들을 구분할 수 있는 모든 이름을 말하는 게 아닐까? 변수 선언 선언 되는 시.. 메타 스터디/JavaScript 2022. 5. 3. 이전 1 2 다음