나디아 성장 일기

while문: 조건이 맞으면 코드 실행while (조건식) { ...}let i = 0;while (i * 이터레이션(iteration, 반복): 반복문 본문이 한 번 실행되는 것 do while문: 조건 안 맞아도 무조건 1번 실행 후 조건 검사 최소 한 번은 먼저 실행해야 할 때 사용do { ...} while (조건식);let a = 5;do { console.log('사랑해'); a++;} while (a > 7);// 사랑해while (a break;: 반복문을 즉시 중단하고 빠져나온다.let sum = 0;while (true) { let value = +prompt("숫자를 입력하세요.", ''); if (!value) break; // (*) sum..

switch문: 다양한 상황에서 비교할 수 있는 조건문break를 안 넣으면 조건에 맞지 않는 case 코드들도 실행됨(= fall-through(폴스루) )switch (변수) { case 조건1: ... break; case 조건2: ... break; default: ... break;} let a = 2 + 2;switch (a) { case 3: alert( '비교하려는 값보다 작습니다.' ); break; case 4: alert( '비교하려는 값과 일치합니다.' ); break; case 5: alert( '비교하려는 값보다 큽니다.' ); break; default: alert( ..

nullish 병합 연산자 `??`?? : 값이 있는 첫 번째 변수를 찾는다.왼쪽(첫 번째) 피연산자가 null 또는 undefined일 때 오른쪽(두 번째) 피연산자를 반환 null과 undefined만 고려  a ?? ba 값이 있으면⭕(null / undefined가 아니면) 👉 a 값 할당a 값이 없으면❌(null / undefined면) 👉 b 값 할당let firstName = null;let lastName = null;let nickName = "바이올렛";alert(firstName ?? lastName ?? nickName ?? "익명의 사용자"); // nickName 출력("바이올렛")  * 조건부 삼항 연산자const a = null;const b = 'Hello';const ..

aspect-ratio: 요소의 가로 대 세로 비율을 설정하여 요소의 크기를 유지하면서 원하는 비율을 유지하는 속성 부모 컨테이너나 뷰포트 크기가 변경되더라도 지정된 가로 대 세로 비율을 유지하면서 요소의 크기를 조정 이미지, 비디오, 미디어 콘텐츠의 반응형에 유용selector {    aspect-ratio: width / height; }    - 16 / 9: 요소를 16:9 비율로 설정 너비를 100%로 설정하면 높이는 자동으로 비율에 맞춰 조정됨.box { aspect-ratio: 16 / 9; width: 100%; background-color: lightblue;}  - 1 / 1: 요소를 1:1 비율로 설정 /* 1:1 비율을 유지하면서 최대 너비가 800px로 설정됨 */.vid..

transition 속성: 요소의 상태가 변경될 때, 변경이 즉시 이루어지지 않고 부드럽게 애니메이션 효과를 통해 이루어지도록 하는 속성  - transition-property: 애니메이션을 적용할 CSS 속성을 지정all: 모든 속성에 효과 지정 (기본값) width, height, background-color 등  a { transition-property: width, background-color, transform;}   - transition-duration: 전환이 완료되는 데 걸리는 시간을 설정 시간 단위는 초(s) 또는 밀리초(ms)a { transition-property: width, background-color, transform;}   - transition-timin..

논리 연산자 AND 연산자 &&: 둘 다 true면 true우선순위: AND(&&) > OR(||)  ✨ AND 연산자로 첫 번째 false 찾기 AND 연산자가 여러 개인 경우, 첫 번째  falsy 반환 falsy가 없다면 마지막 값을 반환 result = value1 || value2 || value3; (1) 왼쪽부터 피연산자를 boolean형으로 변환하며 true 찾기(2) false면 연산을 멈추고 해당 피연산자의 기존값을 반환 (더 이상 진행하지 않는다.)(3) false가 없으면 마지막 피연산자 반환// 첫 번째 피연산자가 truthy이면,// AND는 두 번째 피연산자를 반환합니다.alert( 1 && 0 ); // 0alert( 1 && 5 ); // 5// 첫 번째 피연산자가 fals..

alert: 확인 버튼만 있는 모달창에 문자열 설정alert("Hello");    prompt: 확인 & 취소 버튼이 있는 모달창의 문자열과 입력창의 초깃값 설정사용자가 입력창에 입력한 문자열을 반환 (입력을 취소한 경우는 null 반환)prompt(문자열, 기본값); let age = prompt('나이를 입력해주세요.', 100);     confirm: 확인 & 취소 버튼이 있는 모달창에 질문 문자열과 버튼 결과값을 출력boolean형으로 반환: 사용자가 확인 버튼을 누르면 true, 그 외의 경우는 false 반환let isBoss = confirm("당신이 주인인가요?");    alert, prompt, confirm을 이용한 상호작용 ko.javascript.info

if 문if ( 조건식 ) {     ...} else if (조건식) {     ...} else {     ...} let year = prompt('ECMAScript-2015 명세는 몇 년도에 출판되었을까요?', '');if (year 2015) { alert( '숫자를 좀 더 내려보세요.' ); } else { alert( '정답입니다!' );}   boolean형 사용0, 빈 문자열(""), null, nudefined, NaN 👉 false (falsy 값)이 외의 값 👉 true (truthy 값)if (1) { // 1은 truthy입니다. ...}if (0) { // 0은 falsy입니다. ...}   조건부 연산자 ?: 조건식이 true면 (true일 때 실행), fal..

기본 연산자 피연산자: 연산을 수행하는 대상 단항 연산자: 피연산자가 1개let x = 1;x = -x;alert( x ); // -1 이행 연산자: 피연산자가 2개let x = 1, y = 3;alert( y - x ); // 2 수학 연산자덧셈: +뺄셈: -곱셈: *나눗셈: /나머지: %a % b = a를 b로 나눈 나머지를 정수로 반환alert( 5 % 2 ); // 1 (5 % 2 = ...1)alert( 8 % 3 ); // 2 (8 % 3 = ...2) 거듭제곱: **a ** b = a를 b번 곱한 값이 반환alert( 2 ** 2 ); // 4 (2 * 2)alert( 2 ** 3 ); // 8 (2 * 2 * 2) 이항 연산자 + : 문자열 병합"문자열" + "문자열" = 병합 *..

변수명 변환 ctrl + shift + t translator - Visual Studio MarketplaceExtension for Visual Studio Code - translate for Koreanmarketplace.visualstudio.com 주석  단을 나누는 주석 ctrl + y Comment Divider - Visual Studio MarketplaceExtension for Visual Studio Code - Divide your code by sections with styled separators.marketplace.visualstudio.com    중첩 주석 ctrl + alt + / Nested Comments - Visual Studio MarketplaceExt..