[JS]기본 문법

콘솔

브라우저의 디버깅 콘솔. 브라우저 안에 내장된 브라우저의 하위 객체이므로 

브라우저 객체를 통해 접근 가능함.

디버깅 콘솔: 개발자 도구의 console 

window.console = console(의미 동일함)

 

콘솔 객체는 윈도우의 하위 객체. 

콘솔은 다양한 메소드를 가지고 있음 

 

console 객체의 log 메소드

js 창에 입력:

window.console.log() 콘솔 창에 기록을 남기겠다

ex).window.console.log('daram'); / console.log('daram');

 

console.clear() 내용 지우기 

 

변수 선언 방식

let 변수이름; 변수 선언

변수=데이터; 변수 초기화

let 변수이름=데이터1; 동시에

 

숫자, 문자열 등 다양한 자료형 사용 가능

 

let messi=10;

console.log(messi);

 

상수 선언 방식

const 상수이름=데이터;

*선언과 동시에 초기화 할 것*

 

---

window.prompt(x)

사용자로부터 문자열을 입력받을 수 있는 다이얼로그 박스를 열어주는 메소드

x안에는 띄울 메시지를 전달할 수 있음

const result = prompt("안녕")

console.log(result)

//입력받은 내용 result로 저장한다

 

window.document

문서에 접근할 수 있음 

window.document는 현재 브라우저에 렌더링되고 있는 문서

다양한 API를 제공함

 

document.quertSelector();

전달받은 선택자와 일치하는 문서 요소 반환

 

document.getElementById();

아이디를 인자로 전달받음 

 

window.alert()

window.confirm() 확인, 취소 중 어떤 것을 누르느냐에 따라 true, false 가 반환된다 

---

템플릿 리터럴

표현식을 내장할 수 있는 문자열 표현법. 문자열의 내용에 데이터를 삽입한다는 것을 의미.

템플릿 리터럴로 표현한 문자열 내부에 플레이스홀더(&{})를 기입하고, 그 안에 데이터를 기입하면 

데이터는 문자열의 멤버가 된다 

 

기존 문자열은 따옴표를 이용해 표현했지만, 템플릿 리터럴은 백틱을 이용해 표현한다.

백틱: 물결키를 쉬프트 없이 누르면 입력 가능함

*백틱을 이용해 만든 문자열도 문자열이다* 

 

데이터를 반환하는 메소드 또한 데이터와 마찬가지로 취급할 수 있다

${prompt('안녕')} 도 데이터로 취급함 

 

let data="데이터"

const str1= `문자열 내부에 ${data}삽입하기`

console.log(str1)

위의 두 코드 활용하기

let result=prompt("당신의 이름은?");

console.log(`당신의 이름은 ${result}입니다`);

 

연산자 

산술 연산, 대입 연산

기존 언어와 크게 다른 부분은 없음. 그대로 적용하면 된다.

 

null 데이터가 없음을 나타내기 위해 사용하는 표현 수단

undefined 아직 데이터가 정의되지 않았음(초기화 과정이 생략되었기 때문)

boolean 데이터 타입 TF 둘 중 하나의 답만이 존재함(소문자로 써야 함)

데이터 타입 앞에 typeof 붙이면 데이터타입 출력됨

 

비교 연산

== 추상적 같음 비교: 자료형이 서로 다르더라도 같다고 판단 가능

=== 엄격한 같음 비교-자료형과 데이터가 모두 같아야 함

 

비교연산은 결과가 t 아니면 f로 반환된다

 

'3'과 3은 ==에서는 true ===에서는 false 

 

함수

*함수 선언식

function 함수명(){

}

호출이 선언보다 위에 있어도 괜찮음

 

*함수 표현식

const 함수명=function(){

}

함수 호출 시 함수명()

호출이 선언보다 위에 있으면 안됨

 

함수 이름 지을 때 명사보다는 동사로 된 이름 사용하고,

여러 단어가 섞인 경우 카멜표기법 사용하자 (두번째 단어 첫번째 문자 대문자로 표기하기)

 

function getThree(){

     return 3;

}

return 사용도 가능함