본문 바로가기

언어공부/JavaScript&jQuery

자바 스크립트(JavaScript), 자바와 자바스크립트의 차이점, 자바스크립트 작성 방식 (외부, 내부, 인라인)

자바 스크립트(JavaScript)

  • 자바 스크립트는 동적인 웹페이지를 만들기 위해서 가장 많이 사용되는 자바 스크립트이다.
  • 1995년 동적인 웹페이지를 만들기 위해서 네비게이터 웹브라우저를 만든 넷츠게이프사와 선마이크로 시스템사에서 공동으로 개발된 사용자 스크립트 언어이다.
  • 자바와 달리 변수의 자료형을 선언할 필요가 없다. 변수에 저장되는 값에 의해서 자료형이 결정된다.
  • 모든 명령어가 영문 대소문자를 구분한다.
  • 이전의 자바스크립트는 클라이언트(사용자) 컴퓨터에서만 작동하는 언어였지만, 현재 노드(Node).js를 사용할 경우 백엔드 프로그램 언어와 같이 서버(server)에서도 작동한다.

자바와 자바스크립트의 차이점

특징 자바 언어 자바 스크립트
언어 종류 소스 파일을 컴파일 하여 실행하는 컴파일 언어 브라우저가 소스 코드를 직접 해석하여 실행하는 스크립트 언어
실행 방식 자바 가상 머신 위에서 실행 브라우저 위에서 실행
작성 위치 별도의 소스파일에 작성 HTML 코드내에 삽입
변수 선언 변수의 자료형을 미리 선언해야 함. 변수 자료형을 미리 선언하지 않음

자바스크립트 작성 방식

1. 내부 자바스크립트

 

<body>
</body>
<script> //내부 자바 스크립트
자바스크립트 코드
</script>

 

2. 외부 자바스크립트

 

<body>
</body>
<script src="my.js"></script>//외부 자바 스크립트
//src 경로 설정 확인 잘해야함.

 

3. 인라인 자바스크립트

 

<body>
<button type="button" onclick="alert('안녕하세요');">클릭</button>
</body>

 

위에서 onclick부분이 자바스크립트 인라인 이벤트 핸들러이다. 

여기서 javascript: 를 사용할 경우 해당 구문이 스크립트로 평가된다.

 

<a href="javascript:window.history.back();" class="btn" onclick="return confirm('정말로 취소하시겠습니까?')">취소</a>
<a href="javascript:'취소'" class="btn" onclick="return confirm('정말로 취소하시겠습니까?')">취소</a>

 

첫 번째는 href="javascript:window.history.back();"로 confirm에서 확인을 누르면 스크립트의 윈도우 함수가 실행되어 해당 페이지에서 한 페이지 뒤로가게 되며, 두 번째는 href="javascript:'취소'"로 confirm에서 확인을 누르면 화면의 내용이 빈페이지에서 취소라는 글만 보이게 된다.

 

제일 좋은 방법은 외부 자바스크립트로 자바스크립트파일을 따로 만들어 해당 파일의 경로를 추가하는 방법이다.