자바스크립트 기초 완벽 가이드: 코딩 입문자를 위한 첫걸음
“코딩 한번 배워볼까?” 하고 마음먹었다가 자바스크립트라는 단어 앞에서 멈칫한 적, 저는 여러 번 봤습니다. 웹 관련 일을 오래 하다 보니 이 언어를 아예 모르고 넘어가는 분들이 은근히 손해를 보더군요.
그래서 오늘은 이게 뭔지, 왜 알아두면 좋은지, 어떻게 시작하는지를 최대한 쉬운 말로 풀어보려 합니다.
자바스크립트란 무엇일까요
한마디로 웹사이트를 살아 움직이게 만드는 언어입니다. 버튼을 눌렀을 때 팝업이 뜨거나, 스크롤을 내리면 이미지가 스르륵 나타나는 것.
이런 게 다 이 언어의 몫이에요.
유래도 알아두면 재밌습니다. 1995년 브렌던 아이크(Brendan Eich)가 넷스케이프에서 만들었고, 이후 표준화 기구인 Ecma International이 이를 ECMAScript라는 공식 표준으로 정리했죠.
두 단어가 자주 붙어 다니는 이유가 여기 있습니다.
이름에 ‘자바’가 들어가서 자바(Java)와 헷갈리기 쉬운데, 사실 둘은 완전히 다른 언어입니다. 저도 초창기에 이걸 같은 계열로 오해했다가 한참 뒤에야 바로잡았어요.
이름만 비슷할 뿐 사촌도 아니라고 보시면 됩니다.
어디에서 쓰일까요
예전엔 웹 브라우저 안에서만 돌아갔습니다. 지금은 활용 범위가 훨씬 넓어졌어요.
- 웹 브라우저: 크롬, 사파리, 엣지 등 거의 모든 브라우저에서 실행됩니다.
- 서버: Node.js 덕분에 서버 프로그램도 만들 수 있어요.
- 앱과 그 외: 모바일 앱, 데스크톱 프로그램, 작은 임베디드 기기까지 손을 뻗쳤습니다.
그래서 오늘날 세계에서 가장 널리 쓰이는 언어 중 하나로 꼽힙니다. 제 경험으로는, 블로그 하나 운영하는 분이라도 이 흐름을 조금 알아두면 나중에 티스토리 스킨 만지거나 위젯 붙일 때 훨씬 덜 막막하더군요.
가장 먼저 배우는 기초 개념들
1. 변수: 값을 담는 상자
변수는 데이터를 담아두는 ‘상자’라고 생각하면 쉽습니다. 요즘은 주로 let과 const를 씁니다.
값이 바뀔 수 있으면 let, 한 번 정하고 바뀌지 않으면 const예요. 예전엔 var를 많이 썼는데, 지금은 되도록 앞의 둘을 권장하는 분위기입니다.
이 부분이 입문자들이 은근히 헷갈려 하는 지점이라, 처음부터 습관을 잡아두길 권합니다.
2. 자료형: 데이터의 종류
데이터에도 종류가 있습니다. 숫자(Number), 글자(String), 참/거짓(Boolean), 그리고 여러 값을 묶는 배열(Array)과 객체(Object) 정도죠.
처음엔 이만큼만 알아도 충분합니다.
3. 함수: 반복 작업을 묶는 도구
함수는 특정 작업을 하나로 묶어 이름을 붙여둔 것입니다. 필요할 때 그 이름만 부르면 되니, 같은 코드를 반복해서 칠 일이 줄어들죠.
코드를 깔끔하게 정리하는 핵심 도구라, 개인적으로는 이 개념을 잡는 순간 코딩이 좀 다르게 보이기 시작한다고 느꼈습니다.
계속 진화하는 언어
2015년 ES6(ECMAScript 2015)라는 큰 업데이트를 기점으로 훨씬 편리해졌습니다. 화살표 함수, let/const 같은 요즘 문법이 이때 자리를 잡았죠.
그 뒤로는 매년 6월마다 새 버전이 나옵니다. 가장 최근 정식 버전은 2025년 6월에 나온 ECMAScript 2025(16번째 판)이고, 다음 버전인 ECMAScript 2026도 2025년 12월에 확정됐어요.
새 기능이 계속 더해지면서도 기존 코드가 망가지지 않도록 하위 호환성을 지킨다는 게 이 언어의 큰 강점입니다. 오래된 자료를 봐도 대부분 지금 그대로 통한다는 뜻이라, 입문자 입장에선 오히려 마음이 놓이는 부분이죠.
어떻게 시작하면 좋을까요
거창한 준비는 필요 없습니다. 브라우저만 있으면 오늘 당장 손댈 수 있어요.
- 크롬 브라우저에서 F12를 눌러 개발자 도구의 ‘콘솔’을 열어보세요.
- 거기에
alert("안녕!")같은 간단한 코드를 입력해보세요. 결과가 바로 나옵니다. - 어느 정도 익숙해지면 무료 학습 사이트(MDN, W3Schools 등)로 차근차근 연습하면 좋습니다.
학습 방법에는 정답이 없습니다. 강의 영상으로 시작하는 분도 있고, 책이나 실습 위주로 파는 분도 있죠.
제 생각엔 남들 방식 따라가려 애쓰기보다 자기에게 맞는 결을 빨리 찾는 쪽이 오래갑니다.
마무리하며
웹을 움직이는 언어라는 점, 변수·자료형·함수라는 핵심 개념, 매년 조금씩 발전한다는 것까지 훑어봤습니다. 처음엔 낯설어도 코드 한 줄씩 직접 쳐보면 감이 생각보다 빨리 붙습니다.
저도 그랬듯이, 백 번 읽는 것보다 콘솔에 코드 한 줄 직접 입력해보기 한 번이 훨씬 남습니다. 오늘은 딱 그 한 줄부터 쳐보시길 권합니다.
그 작은 한 걸음이 시작점이 될 겁니다.
