Javascript Deep Dive14

• 제어문 - 블록문,조건문 제어문이란? 조건에 따라 코드 블록을 실행 or 반복 실행 할 때 사용합니다. 위에서 아래 방향으로 순차적으로 진행하는 것이 일반적인 실행 방법입니다. 블록문 블록문 정의 - 0개 이상의 문을 중괄호로 묶은 것, 코드블록 또는 블록이라 부르기도 합니다. - 블록문을 하나의 "실행단위" 로 취급 - 단독으로 사용할 수 있으나 일반적으로 제어문이나 함수를 정의할 때 사용하는게 일반적입니다. - 블록문의 끝에는 세미콜론( ; ) 을 붙이지 않습니다. 조건문 if , else 문 기본적인 문법이라 간단히 설명하겠습니다. if (조건식) { // 조건식이 참이면 이 코드 블록이 실행된다. } else if (조건식){ //위 if 조건식이 거짓이면 이 코드 블록이 실행된다. } else { // 위 if, els.. Javascript Deep Dive/제어문 2022. 9. 26.

• 연산자 우선순위, 연산자 결합 순서 연산자 우선순위 우선순위 연산자 1 () 2 new(매개변수 존재), ., [ ](프로퍼티 접근), ( )(함수 호출), ? .(옵셔널 체이닝 연산자) 3 new(매개변수 미존재) 4 x++, x-- 5 !x, +x, -x, ++x, --x, typeof, delete 6 **(이항 연산자 중 우선순위가 가장 높다) 7 *, /, % 8 +, - 9 =, in, instanceof 10 ==, !=, ===, !== 11 ??(null 병합 연산자) 12 && 13 ||(OR) 14 ? ... : ... (삼항연산자) 15 할당 연산자(=, +=, -=, ...) 16 , (쉼표연산자) 연산자 결합 순서 결합 순서 ( ---------->>>> ) ( Javascript Deep Dive/연산자 2022. 9. 9.

• 그룹 연산자,typeof 연산자, 지수 연산자, 그 외 연산자 그룹 연산자 소괄호 () 로 피연산자를 감싸는 연산자 이다. 자신의 피연산자인 표현식을 가장 먼저 평가한다. 따라서 연산의 우선순위를 조절할 수 있다. 10 * 2 + 3; // 23 // 그룹 연산자를 사용하여 우선순위를 조절 10 * (2 + 3); // 50 typeof 연산자 피연산자의 데이터 타입을 문자열로 반환하는 연산자이다. string , number , boolean , undefined , symbol , object , function 중 하나를 반환한다. null을 반환하는 경우는 없고, 함수는 function을 반환한다. null 타입인지 확인할 때는 일치 연산자(===)를 사용하여 비교하자. typeof 연산자가 반환하는 문자열은 위 7개 타입과 정확히 일치하지는 않는다. 선언하.. Javascript Deep Dive/연산자 2022. 9. 9.

• 삼항 조건 연산자, 논리 연산자, 쉼표 연산자 삼항 조건 연산자 var result = score >= 60 ? 'pass' : 'fail'; // 조건문 참일때 거짓일때 // 참일때 'pass'를 반환, 거짓일때 'fail'을 반환 삼항 조건 연산자의 표현식은 값으로 평가할 수 있는 표현식인 문이다. 같은 조건문인 if, else문은 표현식이 아닌 문이라 값처럼 사용할 수 없다. 조건에 따라 어떤 값을 결정해야 한다면 if, else문 보다 삼항 조건 연산자 표현식을 사용하는게 유리하다. 하지만 조건에 따라 수행해야 할 문이 하나가 아니라 여러개라면 if, else문의 가독성이 더 좋다. 논리 연산자 논리 연산자 의미 부수 효과 || 논리합(OR) X && 논리곱(AND) X ! 부정(NOT) X 논리 부정(!) 연산자는 언제나 불리언 값을 반환한.. Javascript Deep Dive/연산자 2022. 9. 9.

• 비교 연산자 동등/일치 비교 연산자 좌항과 우항의 피연산자가 "같은 값"으로 평가되는지 비교해 불리언 값을 반환한다. 차이점은 엄격성의 정도가 다르다. 비교 연산자 의미 사례 설명 부수 효과 == 동등 비교 x == y x와 y의 값이 같음 X === 일치 비교 x === y x와 y의 값과 타입이 같음 X != 부동등 비교 x != y x와 y의 값이 다름 X !== 불일치 비교 x !== y x와 y의 값과 타입이 다름 X 동등 비교 연산자 = 느슨한 비교 비교 할 때 먼저 암묵적 타입 변환을 통해 타입을 일치시킨 후 같은 값인지 비교해서 타입이 달라도 같은 값이면 true를 반환한다. 편리하지만 결과를 예측하기 어렵고 실수하기 쉽다. 아래 예제는 안티패턴으로 참고만 하자.(가독성, 성능, 유지보수 등에 부정적인.. Javascript Deep Dive/연산자 2022. 9. 9.

• 할당 연산자 할당 연산자란? 우항에 있는 피연산자의 평가 결과를 좌항에 있는 변수에 할당한다. 좌항의 변수에 값을 할당하므로, 변수 값이 변하는 부수 효과가 있다. 할당문은 표현식인 문이다.(할당된 값으로 평가됨) 할당 연산자 예 동일 표현 부수 효과 = x = 5 x = 5 O += x += 5 x = x + 5 O -= x -= 5 x = x - 5 O *= x *= 5 x = x * 5 O /= x /= 5 x = x / 5 O %= x %= 5 x = x % 5 O 문자열 연결 연산자 var str = 'My name is '; str += 'Lee'; // str = str + 'Lee'; console.log(str); // 'My name is Lee' 연쇄 할당 var a, b, c; // 연쇄 할당은.. Javascript Deep Dive/연산자 2022. 9. 9.

• 

  산술 연산자 산술 연산자 란? 피연산자를 대상으로 수학적 계산을 수행해 새로운 숫자 값을 만든다. 산술연산이 불가능 한 경우, NaN을 반환한다. 피연산자의 개수에 따라 이항,단항 산술 연산자로 구분한다. 이항 산술 연산자( 덧셈 / 뺄셈 / 곱셈 / 나눗셈 / 나머지 ) 이처럼, 2개의 피 연산자를 산술하여 숫자 값을 만드는 것을 이항 산술 연산자 라고 한다. 모든 이항 산술 연산자는 피연산자의 값을 변경하는 "부수 효과"가 없다. 부수 효과가 없어, 어떤 산술 연산을 해도 피연산자의 값이 바뀌는 경우는 없고 언제나 새로운 값을 만든다. 단항 산술 연산자( ++ / -- / + / - ) 1개의 피 연산자를 산술 연산하여 숫자 값을 만드는 것을 단항 산술 연산자 라고 한다. ++ / -- 증가/감소 연산자는 피연산.. Javascript Deep Dive/연산자 2022. 9. 8.

• 데이터 타입의 필요성,동적 타이핑 데이터 타입에 의한 메모리 공간의 확보와 참조 숫자, 문자열타입 외의 데이터 타입의 크기를 명시적으로 규정하고 있지 않다. 숫자 = 배정밀도 64비트 부동소수점 형식을 사용( 8비트 ) ( 위키 참조 ) 심벌 테이블 : 컴파일러 또는 인터프리터는 심벌 테이블 이라고 부르는 자료 구조를 통해 식별자를 키로 바인됭 된 값의 메모리주소, 데이터타입, 스코프 등을 관리한다 데이터 타입에 의한 값의 해석 예를들어 메모리에 저장된 값 0100 0001을 숫자로 해석하면 65인데, 문자열로 해석하면 'A'이다. var score = 65; 일 경우, score에 할당된 값은 숫자 타입의 값으로, socre 변수를 참조하면 메모리 공간의 주소에서 읽어들인 2진수를 숫자로 해석한다. 데이터 타입이 필요한 이유 값을 저장.. Javascript Deep Dive/데이터 타입 2022. 9. 7.

• undefined 타입, null 타입, 심벌 타입, 객체 타입 undefined undefined 값은 undefined 가 유일하다. var 키워드로 선언한 변수는 암묵적으로 undefined 로 초기화 된다. null null 의 값은 null 이 유일하다. 대소문자를 구분하므로 주의한다. 값이 없다는 것을 의도적으로 명시할 때 사용한다. 이전에 할당되어 있던 값에 대한 참조를 명시적으로 제거하는 것도 의미한다. 심벌 타입 ES6에서 추가된 7번째 타입, 변경 불가능한 원시 타입의 값이다. 다른 값과 중복 되지 않는 유일무이한 값이다. 객체의 유일한 프로퍼티 키를 만들기 위해 사용한다. 심벌 이외의 원시 값은 리터럴을 통해 생성하지만 심벌은 Symbol 함수를 호출해 생성한다. 이 때 생성된 심벌값은 외부에 노출되지 않으며 다른값과 절대 중복되지 않는 유일무이한.. Javascript Deep Dive/데이터 타입 2022. 9. 7.

• 템플릿 리터럴(` `), 불리언 타입 템플릿 리터럴 이란? 멀티라인 문자열, 표현식 삽입, 태그드 템플릿 등 편리한 문자열 처리기능을 제공한다. 런타임에 일반 문자열로 변환되어 처리된다. 백틱( ` ` )을 사용해 표현한다. 멀티라인 문자열 일반 문자열 내에서는 줄바꿈(개행)이 허용되지 않는다. 일반 문자열 내에서 줄바꿈 등의 공백을 표현하려면 백슬래시( \ ) 로 시작하는 이스케이프 시퀀스를 사용해야 한다. 이스케이프 시퀀스 의미 \0 Null \b 백스페이스 \f 폼 피드, 프린터로 출력할 경우 다음 페이지의 시작 지점으로 이동한다. \n 개행. 다음 행으로 이동 \r 개행. 커서를 처음으로 이동 \t 탭(수평) \v 탭(수직) \uXXXX 유니코드. 예를들어 '\u0041'은 'A' '\uD55C'는 '한' '\u{1F600}'은 😁 .. Javascript Deep Dive/데이터 타입 2022. 9. 7.

• 데이터 타입(정의, 숫자타입, 문자열타입) 데이터 타입이란? 값의 종류 자바스크립트(ES6)는 7개의 데이터 타입을 제공한다. 숫자 타입 : 산술 연산을 위해 주로 사용 문자열 타입 : 텍스트를 화면 출력을 위해 주로 사용 구분 데이터타입 설명 원시 타입 숫자 타입 숫자,정수와 실수 구분 없이 하나의 숫자 타입만 존재 문자열 타입 문자열 불리언 타입 논리적 참(true)와 거짓(false) undefined 타입 var 키워드로 선언된 변수에 암묵적으로 할당되는 값 null 타입 값이 없다는 것을 의도적으로 명시할 때 사용하는 값 심벌 타입 ES6에서 추가된 7번째 타입 객체 타입 객체, 함수, 배열 등 숫자 타입 숫자 타입은 모든 수를 실수로 처리하며, 정수만 표현하기 위한 데이터 타입이 별도로 존재하지 않는다. 2진수,8진수,16진수를 표현하.. Javascript Deep Dive/데이터 타입 2022. 9. 7.

• 표현식과 문 표현식 표현식(expression)은 값으로 평가될 수 있는 문(statement)이다. 즉, 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조한다. (리터럴도 값으로 평가되기 때문에 표현식이다) 문 문(statement)은 프로그램을 구성하는 기본 단위이자 최소 실행 단위이다. 문의 집합으로 이뤄진 것이 프로그램이며, 문을 작성하고 순서에 맞게 나열하는 것이 프로그래밍이다. //문을 명령문이라고도 부른다. // 변수 선언문 var x; // 표현식 문(할당문) x = 5; // 함수 선언문 function foo () {} // 조건문 if (x > 1) { console.log(x); } // 반복문 for (var i = 0; i < 2; i++) { console.log(i); } 세미콜론.. Javascript Deep Dive/표현식과 문 2022. 9. 6.