나디아 성장 일기

지역 변수: 함수 내에서 선언한 변수 (함수 내에서만 접근 가능)function showMessage() { let message = "안녕하세요!"; // 지역 변수 alert( message );}showMessage(); // 안녕하세요!alert( message ); // ReferenceError    전역 변수: 함수 외부의 변수전역 변수의 오염을 막아야 한다❗함수 내부 👉 외부 변수 사용⭕함수 외부 👉 내부 변수 사용❌let userName = 'John';function showMessage() { let message = 'Hello, ' + userName; alert(message);}showMessage(); // Hello, John  함수에서 외부 변수를 수정할 수 있..

for문 : 조건이 true면 코드 실행 for (let i = 0;  i {                 ...}구성 요소  begini = 0시작 숫자 / 반복문 진입 시 딱 한 번 실행된다.conditioni 반복 조건 / false면 반복문을 멈춘다.bodyalert(i)본문 / 조건식이 true일 동안 실행, 출력stepi++본문 출력 후 실행 for (let i = 0; i    continue;: 현재 반복문을 빠져나온다. (다음 반복으로 넘어간다.)for (let i = 0; i   in문: key 값이 object(객체) 안에 있는지 확인key in object prototype(부모) 안에 내용까지 확인해줌(객체의 속성(property) 포함 여부 확인)const javaScript ..

while문: 조건식이 true면 코드 실행while (조건식) {        ...}let i = 0;while (i  * 이터레이션(iteration, 반복): 반복문 본문이 한 번 실행되는 것    do while문: 코드를 먼저 실행하고 조건식 평가최소 한 번은 먼저 실행해야 할 때 사용do {     ...} while (조건식);let i = 0;do { alert( i ); i++;} while (i    break;: 반복문을 즉시 중단하고 빠져나온다.let sum = 0;while (true) { let value = +prompt("숫자를 입력하세요.", ''); if (!value) break; // (*) sum += value;}alert( '합계: ' + sum ); ..

switch문: 특정 변수를 다양한 상황에서 비교할 수 있다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( "어떤 값인지 파악이 되지 않습니다." );}    switch문은 일치 비교(===)로 조건을 확..

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..