mystery

디버깅은 스크립트의 에러를 검출해 제거하는 일련의 과정을 의미합니다! 모던 브라우저나 호스트 환경 대부분은 개발자 도구안에 디버깅 툴을 구비해 놓았습니다! 디버깅 툴을 사용 하면 디버깅이 쉬워지고 실행 단계별 동작을 코드 단위로 추적할 수 있습니다~ Source 패널 1. 파일 탐색 영역 - 페이지 구성에 쓰인 모든 리소스를 트리 형태로 보여줍니다 2. 코드 에디터 영역 - 1번 영역에서 선택한 파일의 소스 코드를 보여줍니다. 편집이 가능합니다. 3. 디버깅 영역 - 디버깅 관련 기능을 제공합니다. console Esc를 누르거나 console탭에 가면 콘솔 창을 열 수 있습니다. 간단한 코드를 짜고 실행할 수 있습니다. breakpoint breakpoint 란 자바스크립트의 실행이 중단되는 코드 지점..

함수 표현식 함수를 만드는 방법은 2가지 입니다. 함수 선언식( Function Declaration ), 함수 표현식( Function Expression ) 자바스크립트는 함수를 특별한 종류의 '값' 으로 취급합니다 그렇기 때문에 변수에 값을 할당하듯 함수를 할당할 수 있습니다. let hello = function(){ console.log("hello") } hello() // hello 함수는 hello변수에 할당된 '값'이기 때문에 출력이 가능합니다. 함수 코드가 문자형으로 변경되어 출력됩니다. console.log(hello)// ---> ƒ (){ // ---> console.log("hello") // ---> } 함수가 '값' 이기 때문에 변수를 복사해 다른 변수에 할당할 수 있습니다!..

함수선언식 function 키워드, 함수이름, 괄호안에 넣은 매개변수를 차례대로 써서 만든 함수. function hello(){ console.log("hello") } hello() 함수 내부에서 함수 외부의 변수에 접근 및 수정이 가능하다. let msg = "hello" function hello(){ msg = "bye" console.log(msg) } console.log(msg) // "hello" 함수 호출 전 hello() // "bye" 함수 호출 console.log(msg) // "bye" 함수 호출 후 함수 내부에 외부 변수의 이름과 동일한 변수가 선언되어 있다면, 함수에서 외부 변수를 사용할 수 없습니다. let msg = "hello" function hello(){ let ..

do....while do{ console.log("HI!") } while(condition) 조건(condition)의 truthy 여부와 상관없이 본문을 최소 한번은 실행하고 싶을 때 사용합니다. 보통 잘 쓰지는 않는다고 합니다. for for (begin; condition; step) { // 본문(body) } begin은 시작 시 한 번 실행됩니다. condition은 반복바다 확인 할 조건입니다. false가 된 순간 멈춥니다. body는 condition이 truthy이면 실행됩니다. step은 본문(body)실행 후 실행됩니다. for문 구성 요소 생략하기 for문은 구성 요소 생략이 가능합니다. let i = 0 for(; i < 3 ; i++){ // begin을 생략했습니다. 본문..

null 병합 연산자 ( ?? ) null 병합 연산자를 사용하면 여러 피연산자 중 값이 할당되어 있는 변수를 찾을 수 있습니다. let a = null let b = 1 console.log(a ?? b) //1 null 병합 연산자는 왼쪽 피연산자의 값이 null과 undefined가 아니면(값이 할당되어 있으면) a를 리턴하고 그 외의 경우에는 b를 리턴합니다 let a = null; let b = 2 let c = null; console.log(a ?? b ?? c) //2 왼쪽부터 차례대로 a ?? b의 결과는 a가 null이므로 b가 남고 b ?? c의 결과는 b에 값이 할당되어 있으므로 b가 리턴됩니다. null 병합 연산자( ?? )와 OR 연산자( || )의 차이점 - null 병합 연..

자바스크립트에는 OR( || ) , AND(&&) , NOT( ! ) 논리 연산자가 있다. OR( || ) 연산자 OR 연산자는 인수 중 하나라도 true면 true를 반환하고 그렇지 않으면 false를 반환한다. 피 연산자가 boolean형이 아니라면 boolean형으로 변환된다. OR 연산자는 첫 번째 truthy를 찾을 때 사용할 수 있다. 가장 왼쪽부터 시작해 평가하고, 피연산자를 boolean형 으로 변환 후 값이 true이면( true를 발견하면 ) 즉시 연산을 종료하고 해당 피연산자를 변환 전 값으로 리턴한다. 피연산자 중 truthy가 없다면 가장 마지막 피연산자를 리턴한다. console.log( 1 || 0 ); // 1 1은 truthy 임으로 1을 리턴한다. console.log( ..

if 문의 괄호 안에서도 표현식을 평가한다. 이후 그 결과를 boolean 값으로 변환한다. - 숫자 0 , 빈 문자열 "" , null , undefined , NaN은 boolean으로 변환시 모두 false 이다. falsy값 이라고 부른다. - 이 외의 값은 boolean으로 변환시 true 이다. truthy값 이라고 부른다. 조건부 연산자 ( ? ) aka. ternary operator 자바스크립트에서 피연산자를 3개나 받는 연산자는 조건부 연산자가 유일합니다. 피연산자가 3개 이므로 삼항 연산자 라고도 불립니다. let passedTest = 80

비교 연산자 ( == , = , !=) 다른 연산자와 마찬가지로 값을 반환합니다. 그 값은 boolean ( true , false ) 입니다. let result = 1 'A') // true 유니코드에서는 A~Z 순으로 점점 큰 인덱스 값을 가집니다 console.log('a' > 'A')// true 유니코드에서는 소문자가 대문자보다 더 큰 인덱스 값 입니다 console.log('Bee' > 'Be') // true 첫 글..

피연산자를 하나만 받는 연산자를 단항 연산자라고 부른다. 피연산자를 2개 받는 연산자를 이항 연산자라고 부른다. 1. 마이너스 연산자 ( - ) 단항 마이너스 연산자는 부호를 뒤집어 준다. 이항 마이너스 연산자는 뺄샘을 해준다. let num = 1; num = -num; console.log(num) // -1 2. 플러스 연산자 ( + ) 단항 플러스 연산자는 피연산자가 숫자일 경우 아무런동작을 하지 않는다. 단항 플러스 연산자는 피연산자가 숫자가 아닌경우 숫자형으로의 변환이 일어난다. 단항 플러스 연산자( + ) 하나로 Number( ... ) 와 같은 일을 할 수 있다. let num1 = 1 console.log(+num1) // 1 -> number let num2 = -1 console.lo..

모달(modal) = 메세지가 있는 작은 창 이라는 뜻 , 페이지의 나머지 부분과 상호작용 불가능 하다는 의미 내포 alert, prompt, confirm 함수 실행시 제약사항 2가지 - 모달 창의 위치는 브라우저가 결정. 보통 중앙에 위치한다. - 모달 창의 모양은 브라우저마다 다르고 수정할 수 없다. prompt 실행하면 텍스트 메세지와 입력필드 , 확인 , 취소 버튼이 있는 모달 창을 띄워준다. let result = prompt(title, [default]); 매개변수는 2가지 이다. title -> 사용자에게 보여줄 텍스트 메세지 default -> 입력필드에 나타낼 초깃값 ( 선택값 ) default를 감싸는 [ ] 는 필수값이 아닌 선택값이라는 것을 의미한다. 사용자가 입력필드에 값을 입..