전체 글
[자바스크립트] 논리 연산자
[자바스크립트] 논리 연산자
2021.06.29논리 연산자 논리 연산자 ||(OR), &&(AND), !(NOT)이 있다. || (OR) 피연산자가 모두 false인 경우를 제외하고 연산 결과는 항상 true alert( true || true ); // true alert( false || true ); // true alert( true || false ); // true alert( false || false ); // false 첫 번째 truthy를 찾는 OR 연산자 ‘||’ 자바스크립트에서만 제공하는 논리 연산자 OR의 '추가’ 기능 OR 연산자와 피연산자가 여러 개인 경우: result = value1 || value2 || value3; 이때, OR ||연산자는 다음 순서에 따라 연산을 수행한다. 가장 왼쪽 피연산자부터 시작해 오른쪽으..
[자바스크립트] if와 '?'를 사용한 조건 처리
[자바스크립트] if와 '?'를 사용한 조건 처리
2021.06.29if와 '?'를 사용한 조건 처리 조건에 따라 다른 행동을 취할 때 if문 조건부 연산자 ?를 사용하면 된다. if문 if(...)문은 괄호 안에 들어가는 조건을 평가하는데, 그 결과가 true이면 코드 블록이 실행됩니다. let year = prompt('ECMAScript-2015 명세는 몇 년도에 출판되었을까요?', ''); if (year == 2015) { alert( "정답입니다!" ); alert( "아주 똑똑하시네요!" ); } 불린 형으로 변환 if(..)문은 괄호 안에 0, 빈 문자열"", null, undefined, NaN은 불린 형으로 변환 시 모두 false가 된다. 조건부 연산자 '?' 조건에 따라 다른 값을 변수에 할당해줘야 할 때가 있다. let accessAllowed; ..
[자바스크립트] 비교 연산자
[자바스크립트] 비교 연산자
2021.06.29비교 연산자 다양한 자료형을 대상으로 자바스크립트가 어떻게 비교를 하는지 알아보자. 문자열 비교 자바스크립트는 '사전' 순으로 문자열을 비교한다. (정확히는 유니코드 순으로 비교한다.) alert( 'Z' > 'A' ); // true alert( 'Glow' > 'Glee' ); // true alert( 'Bee' > 'Be' ); // true 다른 형을 가진 값 간의 비교 비교하려는 값의 자료형이 다르면 자바스크립트는 이 값들을 숫자형으로 바꾼다. // 문자열 '2'가 숫자 2로 변환된 후 비교가 진행 alert( '2' > 1 ); // true // 문자열 '01'이 숫자 1로 변환된 후 비교가 진행 alert( '01' == 1 ); // true alert( true == 1 ); // t..
[자바스크립트] 기본 연산자와 수학
[자바스크립트] 기본 연산자와 수학
2021.06.29기본 연산자와 수학 기본 연산자를 시작으로 자바스크립트에서만 제공하는 연산자를 배워보자. '단항', '이항', '피연산자' 피연산자 연산을 수행하는 대상 5 * 2에는 왼쪽 피연산자 5와 오른쪽 피연산자 2, 총 두 개의 피연산자가 있다. 피연산자는 '인수'라는 용어로도 불린다. 피연산자를 하나만 받는 연산자는 단항 연산자라고 부른다. let x = 1; x = -x; alert( x ); // -1, 단항 마이너스 연산자는 부호를 뒤집습니다. 두 개의 연산자는 이항 연산자라고 부른다. 수학 덧셈 연산자 + 뺄셈 연산자 - 곱셈 연산자 * 나눗셈 연산자 / 나머지 연산자 % 거듭제곱 연산자 ** 이항 연산자 '+'와 문자열 연결 +로 문자열이 전달되면 문자열을 병합(연결)한다. let s = "my" +..
[자바스크립트] 자바스크립트 형 변환 (type conversion)
[자바스크립트] 자바스크립트 형 변환 (type conversion)
2021.06.29형 변환 (type conversion) 함수와 연산자에 전달되는 값은 대부분 적절한 자료형으로 자동 변환된다. alert가 전달받은 값의 자료형과 관계없이 문자열로 자동 변환하여 보여주는 것 or 수학 관련 연산자가 전달받은 값을 숫자로 변환하는 경우가 형 변환의 대표적인 예시 전달받은 값을 의도적으로 명시적 변환해주는 것도 형 변환이라고 할 수 있다. 문자형으로 변환 alert 메서드는 매개변수로 문자형을 받기 때문에 alert(value)에서 value는 문자형이어야 한다. 만약 다른 형의 값을 전달받으면 문자형으로 자동 변환된다. 숫자형으로 변환 수학과 관련된 함수와 표현식에서 자동으로 형 변환이 일어난다. 숫자형이 아닌 값에 /를 하는 경우 문자열로 입력했지만 숫자형으로 자동변환 되어서 연산 수..
[자바스크립트]alert, prompt, confirm
[자바스크립트]alert, prompt, confirm
2021.06.29alert, prompt, confirm 브라우저 환경에서 사용되는 최소한의 사용자 인터페이스 기능을 알아보자 alert 메시지가 있는 작은 창은 모달 창(modal window)이다. '모달’이란 단어엔 페이지의 나머지 부분과 상호 작용이 불가능하다는 의미가 내포되어 있다. prompt result = prompt(title, [default]); 브라우저에서 제공하는 prompt 함수는 두 개의 인수를 받는다. 텍스트 메시지와 입력 필드(input field), 확인(OK) 및 취소(Cancel) 버튼이 있는 모달 창을 띄워준다. title : 사용자에게 보여줄 문자열 default : 입력 필드의 초깃값(선택 값) 인수를 감싸는 대괄호([])는 이 매개변수는 필수가 아닌 선택 값이라는 것을 의미한다..
[자바스크립트]자바스크립트의 자료형
[자바스크립트]자바스크립트의 자료형
2021.06.29자료형 자바스크립트의 변수는 자료형에 관계없이 모든 데이터일 수 있다. 변수는 어느 순간 문자열일 수 있고 순간엔 숫자가 될 수 있다. // no error let message = "hello"; message = 123456; 이처럼 자료의 타입은 있지만, 변수에 저장되는 값의 타입은 언제든지 바꿀 수 있는 언어를 ‘동적 타입(dynamically typed)’ 언어라고 부른다. 숫자형 let n = 123; n = 12.345; 숫자형(number type) 은 정수 및 부동소수점 숫자(floating point number)를 나타낸다. 숫자형엔 일반적인 숫자 외에 Infinity, -Infinity, NaN 같은 '특수 숫자 값(special numeric value)'이 포함된다. Infini..
[자바스크립트]변수와 상수(let, const)
[자바스크립트]변수와 상수(let, const)
2021.06.29변수와 상수 변수와 상수의 용도를 알아보자 변수란? 변수는 데이터를 저장할 때 쓰이는 ''이름이 붙은 저장소''이다. 자바스크립트에서는 let 키워드를 사용해 변수를 생성한다. let message; //'message’라는 이름을 가진 변수를 생성(선언) message = 'Hello!'; // 문자열 저장 // let message = 'Hello!'; 선언과 동시에 값 할당 alert(message); // 변수에 저장된 값을 보여줍니다. 변수 선언을 여러 번 하면 에러 발생 변수 선언은 딱 한 번만 선언하고, 선언한 변수를 참조할 때는 let 없이 변수명만 사용해서 참조한다. ⚠️ let대신 var 만들어진 지 오래된 스크립트에서 let 대신 var라는 키워드 사용 둘 다 거의 동일하게 동작 변수..
[자바스크립트] 엄격모드
[자바스크립트] 엄격모드
2021.06.29엄격 모드 자바스크립트는 꽤 오랫동안 기존의 기능을 변경하지 않으면서 새로운 기능을 추가했다. 그러나 ES5에서 새로운 기능을 추가되고 기존 기능 중 일부가 변경되어 하위 호환성 문제가 발생할 가능성이 있다. 그래서 이러한 변경사항 대부분을 ES5의 기본 모드에서 활성화되지 않도록 하기 위해 엄격 모드를 사용 그래서 변경사항 대부분은 ES5의 기본 모드에선 활성화되지 않도록 설계되었다 대신 use strict라는 특별한 지시자를 사용해 엄격 모드(strict mode)를 활성화했을 때만 이 변경사항이 활성화되게 되도록 해놓았다. use strict 스크립트 최상단에 use strict or use strict가 오면 스크립트 전체가 모던한 방식으로 동작한다. "use strict"; // 이 코드는 모던..
[자바스크립트] JavaScript 작성 방법
[자바스크립트] JavaScript 작성 방법
2021.06.29JavaScript 작성 방법 HTML 내 자바스크립트의 작성 방법을 소개한다. 스크립트 후 모던 마크업 HTML4에서는 type을 명시하는 것이 필수였다 type="text/javascript" 그러나 이제는 타입 명시가 필수가 아니다. language 속성: ⚠️ 주의사항 스크립트가 간단할 때만 HTML 안에 작성해도 되지만, 길어진 파일을 분리하여 저장하는 것이 좋다. 스크립트 파일을 별도로 저장하면 브라우저가 스크립트를 다운로드하여 캐시에 저장하기 때문에 성능상 이점이 있다. 여러 페이지에서 동일한 스크립트를 사용하는 경우 트래픽이 절약되고 웹 페이지의 실제 속도도 빨라진다. src 속성이 있으면 태그 내부의 코드는 무시됩니다. //--------아래 코드는 정상 실행----------- 📌 참고..