[JavaScript] JavaScript란 무엇인가?

카테고리 : 프로그래밍 언어
태그: javascript · 변수 · 스코프 · 할당 · 변수의 선언 방법
등록일: 2022년 09월 07일
최근 업데이트: 2022년 09월 07일

JavaScript란 무엇인가?

개발자가 만든 문서에 방문자가 방문하여 어떤 동작을 취했을 때, 그 동작에 대응하여 반응이 일어날 수 있도록 해주는 언어

자바스크립트 언어는 컴퓨터와 사람이 함께 알아들을수 있는 약속된 언어로 웹과 함께 등장한 언어다. 지금은 자바스크립트가 웹브라우저만 제어하기 위한것만 사용하는 것이 아니라 웹 서버를 동작하기 위한 도구로써 사용되고 서버 사이드 스크립트라고 합니다. 대표적인 기술로 자바, 파이썬 , php등이 있는데 그중 node.js이는 웹브라우저와 웹서버를 함께 사용할수 있는 것이 자바스크립트로 만들수 있다는 장점이 있습니다.

JavaScript(프로그램 언어)

자바스크립트 언어의 규칙 문법에 맞춰 코드 작성 이렇게 작성된 코드는 자바스크립트를 해석하고 실행할수 있는 어떤 환경에서 실행

스크립트언어 -어떤 어플리케이션에서 코드를 해석하고 실행할수 있는 어떤 엔진이 존재해서 그 스크립트로 해당 애플리케이션을 제어하기 위한 용도로 사용하기 위한 프로그램 언어

인터프린트 언어-그리고 자바스크립트 엔진은 소스 코드를 한나하나씩 읽으면서 바로 바로 해석하고 실행하는데 이러한 특징을 가진 프로그램언어를 인터프린터 언어라고 합니다

자바스크립트는 이런 스크립트 언어의 특징과 인터프린터 언어의 특징을 가진 언어

이러한 자바스크립트헤석하고 실행하는 스크립트 엔진을 가지고 있는 대표적인 애플리케이션이 웹브라우저입니다.

자바스크립트가 널리 사용되고 있는 이유도 웹브라우저에서 사용하고 있기 때문

웹브라우저가 좋아지고 유저의 눈이 높아지면서 웹브라우저에서 자바스크립트의 역활은 엄청나게 중요해 짐

또한 크롬브라우저에서 사용하는 자바스크립트 엔진을 이용해서 서버 사이트 애플리케이션을 만들수 있는 Node.js 가 등장

자바스크립트의 최초의 목적과 다르게 이제는 웹브라우저에서만 사용되는 언어가 아닙니다.

이밖에 데스크탑에서 만들수 있는 electron이 있음

모바일 애플리 케이션을 만들수 있는 아이오니 , 네이티브스크립트, React Native등이 있음

이렇게 이제는 자바스크립트로 할수 없는 분야는 없을 정도로 많은 분야에서 사용됩니다.

웹프론트엔드 벡엔드, 데스크탑 모바일 등 많은 분야에서 사용되고 있기 때문에 자바스크립트 기초를 탄탄히 다룰수 있도록 바랍니다.

Various JavaScript Runtime

각종 웹브라우저, Node.js, Electron…

스크립트 언어인 자바스크립트가 실행되는 Runtime 환경은 여러가지가 있습니다.

크롬, 파이어폭스,사파리, 엣지에 데스트탑 환경이 있고 Node.js처럼 서버로 활용되는 Runtime 환경도 있음 V8에 영향을 받지만 데스크탑 에플리케이션 환경은 Electron도 자바스크립트 Runtime환경입니다.

ecma-international에서 표준관리 이렇게 다양한 환경에서 사용되는 자바스크립트는 그 문법을 표준화하고 관리하고 있음

ecma-international 정보통신을 표준화 관리하는 비영리 표준화 기구임

자바스크립트 언어의 특징 1. 인터프린터 언어(작성된 순서대로 윗줄부터 순차대로 구문 분석, 코드에 문제가 생기면 에러가 발생한 행 전까지 구문 분석하고 에러 발생한 다음 줄부터는 구분 분석 안함) -즉 소스 코드를 한나하나씩 읽으면서 바로 바로 해석하고 실행하는데 이러한 특징을 가진 프로그램언어를 인터프린터 언어라고 합니다 2. 클라이언트 스크립트 언어(서버에서 실행되는 것이 아니라 사용자 컴퓨터에서 실행, 그래서 서버의 부하룰 줄일 수 있다.) 3. 객체 기반 언어(다양한 객체가 존재하며, 그에 해당하는 다양한 기능(메서드)들이 존재.)4. 공개된 언어(외부로 분리할 수 있으나 완벽히 숨길 수는 없습니다.)5. 다양한 라이브러리를 활용할 수 있습니다.(대표적인 라이브러리 언어는 제이쿼리, 자바스크립트로 구현하기 힘든 것들을 쉽게 구현할수 있도록 만들어 놓은 프로그래밍 언어.)

JavaScript 기초 문법

<script type="text/JavaScript"> //<![CDATA[ document.write("안녕하세요."); //]]> </script>

Expression (표현식)

값을 만들어내는 간단한 코드를 표현식 이라고 합니다.

예시 - F12 개발자 모드에서 console창 true 엔터 true가 나오고 26은 26 12+56+23은 91이 나오는데 이러한 것들을 표현식이라고 함

표현식은 값을 만들어 내기 때문에 함수의 인자로 사용할 수 있습니다.

예시 -alert(“Hello”+”javascript”)

Statement(예문)

하나 혹은 여러 개의 표현식이 모여 문장을 이룹니다.
모든 표현식은 문장이 될수 있습니다.
(보통) 문장의 끝에는 세미 콜론을 붙입니다.

예시 - true; ,100+90+4;도 문장입니다.

var name=”Mark”

한줄에 문장이 하나인 경우에는 세미 콜론을 붙이지 않아도 문제가 없습니다.
하지만 관례적으로 붙입니다.
한줄에 여러 문장을 적을 경우, 세미 콜론으로 문장을 구분해야 합니다.
마지막 문장은 세미 콜론을 붙이지 않아도 문제가 없습니다.
여러 문장을 사용할 경우 마지막 문장의 결과가 반환됩니다.
조건문(if), 반복문(for)도 문장입니다.
이 경우에는 마지막 } 뒤에 세미콜론을 붙이지 않습니다.

표현식이 모여서 문장이 되고 문장들이 모여 만들고자 하는 프로그램이 됩니다.

;(세미콜론을 사용할때와 하지 않았을때의 차이점? 자바스크립트는 enter를 사용하면 내용이 끝난것으로 인지하여 ;을 사용하지 않아도 내용이 끝남 이지만 한문장에 여러개의 문법을 사용할때는 꼭 세미콜론을 사용해야만 문법오류가 나지 않음)

유효성 검사시 오류를 막는 CDATA 구문 내부형으로 작성된 스크립트에서 Html 태그를 포함하게 되면 정상 작동은 할지라도 브라우저의 유효성 검사기들은 오류를 지적함 (외부형일떄는 문제 없음)

Comments 주석

소스 코드에서 프로그램에 영향을 주지 않고, 무시되는 부분
보통은 소스코드를 이해할 수 있도록 돕는 역할로 사용
//한줄 주석
/* */ 여러줄 주석

키워드와 예약어 keywords & Reserved Words

keywords

자바스크립트에서 특정한 목적을 위해 사용하는 단어
이러한 키워드들은 예약어(?)로 지정되어 있습니다.

키워드란 - var 같은 변수를 선언할때 사용하는 키워드 , reture

Reserved Words-이미 특정한 목적을 위해 사용하기 때문에 사용할 수 없는 예약어

프로그램을 작성할때 변수명, 함수명 등 이름으로 사용할 수 없는 단어 for, else if등

Future Reserved KeyWords - 앞으로 특정한 목적을 위해 사용할 가능성이 있어서 사용할 수 없는 예약어

int, long, short, super, export, double등등 사용할수 없음

Identifier(식별자)

코드 내의 변수, 함수, 혹은 속성을 식별하는 문자열 대소문자를 구별함

var name(식별자)= ‘Mark’(값)
function hello(){} - hello라는 이름으로 식별할수 있다고 해서 식별자라 함
‘유니코드문자’, ‘$’, ‘_’,’숫자(0~9)’를 사용할 수 있지만 숫자로 시작할수 없습니다.
‘예약어’는 사용할 수 없고, ‘공백 문자’도 사용할 수 도 없습니다.

javaScript variable name validator

프로그램에서 사용하는 변수나 함수의 이름을 짓는 것은 언제나 어려운 일입니다.
의미없는 이름은 사용하지 않고, 역할에 맞는 적절한 이름을 짓도록 노력해야 합니다.

변수와 상수

const 상수를_지칭하는 이름

const 상수를지칭하는이름 = 값;
상수를 선언하면서 바로 값을 할당하는 방법
let변수를지칭하는이름
변수를 선언하는 방법

호이스팅

아래있는 선언(만)을 끌어올리다.

함수 호이스팅
변수 호이스팅
var name; console.log(name); name=’mark’; console.log(name); name=’Woongjae’
{}안에서만 사용가는한 범위

				//블럭
				//const name='mark';

var의 유효 범위
함수 스코프

		//함수 먼저

		function hello1(){
			console.log('hello1');
		}
		hello1();

		//함수의 호출을 먼저
		hello2();
		function hello2(){
			console.log('hello2');
		}

		//둘다 실행됨

		//var 호이스팅
		age=6;
		age++;
		console.log(age);
		var age;

		-- -------------
		console.log(name);//undefined
		name='Mark';
		console.log(name);//mark;

		var name;

		-----------
		console.log(name);//undefined
		name='Mark';
		console.log(name);//mark;

		var name='jeehyun'; // 변수 선언만 끌어 올림 이름을 나타내지 못함

		------------let를 선언하면  호이스팅 문제가 사라짐

[JavaScript] JavaScript란 무엇인가?

DONGNYEONG FRONTELIO

Error

Templates (for web app):

Error