도도의 IT이야기
[자바스크립트 기본] 자바스크립트의 정의와 web API 본문
자바스크립트란?
자바스크립트는 복잡한 로직을 적용하여 "살아 숨쉬는" 웹페이지를 만드는 프로그래밍 언어입니다. 서버쪽에서 실행되는 언어가 아니라 사용자의 컴퓨터에서 실행되는 언어이기 때문에 클라이언트 언어라고도 합니다.
HTML은 "정보"
CSS는 "디자인"
JAVASCRIPT는 "행동"
하지만 요즘 JavaScript가 엄청나게 발전했기 때문에 HTML과 CSS의 위치를 위협하고 있습니다.
자바스크립트의 날개 Web API
자바스크립트는 web API라는것을 탑재한 언어입니다.
Web API 는 클라이언트 쪽에서 사용하는 API를 가르킵니다.
그럼 API가 뭔데?
API (Application Programming Interface)
식당에 있다고 상상해봅시다. "오늘은 흠... 어린이 돈까스가 먹고 싶군"이라는 생각이 들어 웨이터를 부릅니다. 웨이터에게 "어린이 돈까스 먹을래요!"라고 말하자 웨이터는 주문을 받고 주방으로 가서 주문을 알립니다. 주방에서 뚝딱뚝딱 요리를 만든 다음에 웨이터가 돈까스를 가지고 옵니다.
여기서 우리가 돈까스를 먹기 위해 몇가지 행동을 했을까요? 단 하나 밖에 없습니다 - 웨이터에게 주문을 알리는 것 뿐이죠. 식당 주인이 돈까스 장인이라서 직접 사육한 최고의 고기를 사용해 이 세상에서 유일한 레시피로 이 돈까스를 만들었을지도 모릅니다. 하지만 우리는 이 돈까스가 주방에서 어떠한 방식으로 요리 됬는지 모르고 알 필요도 없습니다. 중요한건 우리가 돼지를 잡고 숙성시키고 요리를 해서 돈까스를 만든게 아니라 그저 웨이터에게 주문을 하자 돈까스가 내 앞에 도착했다는 사실이죠.
이 예제에서 웨이터가 API의 역활을 하고 있는 것 입니다. 즉 API란 굉장히 어렵고 복잡한 기능을 쉽게 사용할 수 있게 해주는 것입니다.
실제 프로그래밍을 예로 들자면 우리가 화상채팅 앱을 만들고 있다고 해봅시다. 화상채팅앱이니 카메라의 기능이 필수겠지요? 그럼 우리가 직접 카메라 인터페이스와 소프트웨어를 만드는게 좋을까요 아니면 삼성이나 애플이 제공하는 카메라의 기능을 탑재하는 것이 좋을까요? 당연히 제공되는 카메라를 사용하는게 대부분 좋을겁니다. 그래서 우리는 수천 수만줄의 카메라 인터페이스를 위한 코드를 칠 필요없이 "삼성의 카메라를 사용하고 싶다!"라는 카메라API를 통해 손쉽게 빌트인 카메라를 우리 코드에 사용할 수 있는 것 입니다.
WEB API
web api 또는 브라우저 API는 브라우저 이미 정의된 빌트인 기능들을 뜻합니다. 예를 들면 이런것들:
alert('hi');//우리가 alert는 정의한적은 없지만 알아서 화면 중앙에 경고창이뜬다
//이렇게 많은 함수와 코드들을 우리에 숨겨 사용자가 편하게 사용하게 만든것을 API라고 할수 있음.
document.querySelector('#target');//역시 querySelector라는 함수를 정의한적이 없다.
//브라우저에서 이미 빌트인으로 우리를 위해 준비되어 있기 때문에 API임.
그럼 저는 이런 생각이 들었습니다.
let str = "hello";
str.toUpperCase();//결과: HELLO
위의 예제 처럼 우리는 toUpperCase라는 함수를 정의한적 없지만 그냥 문자열뒤에 사용하니 hello를 HELLO로 수정했습니다. 그럼 toUpperCase()도 web API일까요? 아닙니다. 여기서부턴 제 생각이지만 toUpperCase()는 웹브라우저에 내장된 빌트인 기능이 아니라 자바스크립트 라는 언어 안에있는 String 객체 안에 있는 method이기 때문에 web API가 아니고 그냥 API입니다.
'IT > 자바스크립트' 카테고리의 다른 글
[자바스크립트 기본]객체,생성자,프로토타입,프로토타입 체인 (1) | 2020.05.08 |
---|---|
Object.prototype.toString() 메서드 (0) | 2020.05.07 |
[자바스크립트 기본] 문법과 리터럴 (0) | 2020.05.07 |
[자바스크립트 기본-1] 우선 웹이란 무엇일까? (0) | 2020.05.06 |
콜백의 개념. 비동기적과 동기적 콜백의 차이점 (2) | 2020.05.05 |