📌학습 내용
📖 조건문
💡 if문
조건이 참일 경우에 { } 구문이 실행됨
논리 구조를 만듦
💡 else문
조건이 거짓이어서 { } 구문이 실행되지 않을 때 실행되는 구문
💡 else if문
여러 개의 조건을 설정하고자 할 때 사용
주의할 점: 조건 중 가장 먼저 나오는 '참'만 실행됨
💡 중첩if문
모호한 조건 설정으로 발생할 수 있는 오류를 줄이기 위해 사용
예) 아래에서 a = b의 경우에는 조건의 참과 거짓에 오류 발생
💡 거짓이 되는 상황 - 중요!
false, 빈 문자열 "", 숫자 0, null, undefined
실무에서 많이 사용됨
💡 삼항 연산자
if ~ else구문과 같은 구조를 만드는 연산자
한 줄 짜리 간단한 조건의 if문을 삼항 연산자로 쓰면 가독성이 좋아짐
? - 조건이 참일 때 출력되는 것
: - 거짓일 때 출력되는 것
💡 조건문으로 로그인 기능 구현
var userPw = prompt("비밀번호를 입력해 주세요.");
var userId = prompt("아이디를 입력해 주세요.");
if(userId === "doraemon" && userPw === "12345") {
alert("로그인되었습니다.")
} else {
alert("아이디 또는 비밀번호가 틀렸습니다.")
}
prompt
사용자로부터 정보를 전달받을 팝업을 브라우저에 띄우는 메서드
팝업의 디자인은 브라우저마다 다름
prompt는 입력받은 데이터를 문자로 인식한다.
숫자 데이터를 전달하려고 하면 아래와 같이parseInt로 문자->숫자 전환이 필요함if(userId === "doraemon" && parseInt(userPw) === 12345) { alert("로그인되었습니다.") } else { alert("아이디 또는 비밀번호가 틀렸습니다.") }
alert
사용자에게 브라우저가 현재 어떤 상태를 나타내는지 알려주는 메서드
📖 전역 / 지역 변수
함수를 기준으로 구분됨
💡 전역 변수
모든 범위에 영향을 미치는 변수
함수 안과 밖으로 영향을 줌
💡 지역 변수
특정 범위에 영향을 미치는 변수
함수 안에서 만들어져 함수 안에서만 영향력을 미침
주의점 1) 지역 변수 선언할 때 var 꼭 붙이기
주의 2) 기준이 될 함수가 없다면 { } 안에 있는 변수라도 전역 변수임
참고(1)
모든 전역변수는 브라우저의 요소들과 자바스크립트 엔진, 그리고 모든 변수를 담고 있는 객체인window의 기본 property에 자동으로 할당된다.
객체
window
https://www.zerocho.com/category/JavaScript/post/573b321aa54b5e8427432946
참고(2)
최신 JS 버전인 es6에서는 변수를 만들 때 var 이외에 let, const를 사용해 만들 수 있는데 이들을 사용할 때는 전역/지역 변수의 기준이 함수가 아님. 일단 참고만 할 것.
📖 스코프
변수가 영향력을 발휘할 수 있는 유효 범위
💡 스코프 체인
일종의 리스트로서 전역 객체와 중첩된 함수의 스코프의 레퍼런스를 차례로 저장하고, 각각의 스코프가 어떻게 연결(chain)되고 있는지 보여줌
식별자를 찾을 때 일단 자신이 속한 스코프에서 찾고 그 스코프에 식별자가 없으면 상위 스코프에서 다시 찾아 나감 (안쪽 -> 바깥쪽으로)
💡 렉시컬 스코핑
함수는 서로의 스코프에 접근할 수 없다...
...고만 설명하셨는데 추가적인 설명이 필요할 것 같음
렉시컬 스코핑
https://www.zerocho.com/category/JavaScript/post/5740531574288ebc5f2ba97e
📖 호이스팅
'끌어올리기': 선언들을 끌어올려서 해당 유효 범위의 최상단에 선언하는 것
💡 변수 호이스팅
전역변수는 문서의 어느 곳에서나 접근 가능함
아래쪽에서 호출을 하더라도 변수 선언을 가장 위로 끌어올리는 것을 의미함
그러나 변수 초기화에는 적용되지 않으며, 변수 선언과 초기화를 동시에 해도 선언만 적용됨
💡 함수 호이스팅
함수 호출이 위에 있어도 함수가 끌어올려져 오류 없이 작동함
주의점
변수를 만들어 함수 자체를 값으로 할당해 함수 호출을 할 수 있는데, 이 경우에는 변수 호이스팅으로 인해 함수 호이스팅이 불가능함
📖 자주 사용되는 객체와 메서드
Math
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Math
parseInt()문자열을 정수 데이터로 바꾸고자 할 때
parseFloat()문자열을 실수 데이터로 바꾸고자 할 때
📌어려운 점
🤍
📌해결방법
🤍
📌느낀 점
팀플 시작하기 전에 진도를 얼른 빼야겠단 생각..!
