자바스크립트의 대표적인 메소드

alert() 

브라우저에 팝업 창을 띄워 메시지를 보여준다.

alert("bye JS");

 

console.log() 

브라우저의 콘솔에 메시지나 데이터를 출력한다. 주로 디버깅을 위해 사용

console.log("message in browser's consol");

 

setTimeout()

특정 코드를 일정 시간 후에 실행하도록 예약한다. 단위는 ms

예약 가능한 sleep() 같다.

setTimeout(funtion() {
	console.log("이 폭탄은 5초후에 폭파합니다...4...3..");
}, 5000);

 

 

setInterval()

일정 간격으로 반복적으로 실행되는 코드를 설정한다.

setInterval(Funtion() {
	console.log("0.5초마다 숨쉬기");
}, 500);

 

clearTimeout() / clearInterval()

setTimeout() 이나 setInterval()로 예약된 작업을 취소할 수 있다.

 

let boom = setTimeout(funtion() {
	console.log("이 폭탄은 5초후에 폭파합니다...4...3..");
}, 5000);

clearTimeout(boom); // 작업 취소됨

 

document.getelementById()

HTML에서 특정 id 값을 가진 요소를 가져온다.

여기서 id값이라 함은

웹사이트를 개발자 모드로 열었을때 나오는 HTML 태그의 id 부분이다.

다음 홈페이지를 예시로 사용법만 가볍게 써보면

// * 정확한 코드 아님 *
let aElement = document.getElementById('topaccessibility');
console.log(element.innerText);

이런 느낌이 될 것이다. 

 

addEventListener()

특정 요소(버튼과 같은)에 이벤트 리스너(클릭, 키 입력 등)를 추가한다. 

사용자가 해당 요소를 클릭하거나 마우스를 올리거나 키를 입력했을 경우 특정 행동을 할 수 있다.

let button = document.getElementById('firstButton');
button.addEventListener('click', function() {
	alert('클릭하셨군요?');
});

 

Array.push()

배열의 마지막에 새로운 요소를 추가한다.

 

Array.pop()

배열의 마지막 요소를 제거하고 그 값을 반환한다.

 

Array.shift()

배열의 첫 번째 요소를 제거하고 그 값을 반환한다.

 

Array.unshift()

기존 배열의 가장 앞에 새로운 요소를 추가한다.

 

Array.map() 

배열의 각 요소에 함수를 적용해서 새로운 배열을 반환한다.

파이썬에서 map과 람다를 섞어쓰는것과 유사한 느낌이다.

let number = [1, 2, 3];
let doubled = number.map(function(num) {
	retrun num*2;
});
consol.log(doubled);

만약 이걸 파이썬으로 한다면

number = [1, 2, 3]
doubled = list(map(lambda x : x*2, number))
print(doubled)

느낌이지 않을까?... 간만에 생각나는대로적은거라 기억이 애매하긴하다.

apply와 유사하기도 한것같다.

 

Array.filter()

배열에서 특정 조건을 만족하는 요소들만 필터링해서 새로운 배열로 반환한다.

let number = [30, 20, 10, 5, 3];
let ten = number.filter(function(num) {
	if (num==0) {
    	return num;
    }
});

 

JSON.stringify()

자바스크립트 객체 ( 키-밸류 쌍)나 배열을 Json 문자열로 변환해준다.

let obje = {name: "LG obje", price : "3000000"};
let jsonString = JSON.stringify(obje);
consol.log(jsonString); // '{"name" : "LG obje", "price" : "3000000"}'

 

 

JSON.parse()

위의 stringify()의 반대버전, Json문자열을 자바스크립트 객체로 변환해준다.

let jsonString = '{"name" : "LG obje", "price" : "3000000"}';
let obje = JSON.parse(jsonString);
consol.log(obje.price); // 3000000

 

 

이런 메소드들 말고도 자바스크립트만의 특수한 개념들 또한 존재하는것같다.

클로저 호이스팅... 역시 이름에 자바가 들어가서인지 매우 추상적이고 직관적이지 않은 용어들이다.

막상 문법은 C계열 같으면서...  시작하기 전에 정립하고 갈 개념이 많은 것 같다.