프로그램 언어
- 컴퓨터에게 작업을 지시(수학적인 마인드 : 절차적으로) -> 영어로 지시(일정부분 암기)
프로그램 언어 종류
- 컴파일 언어 - 소스코드 -> (컴파일) -> 실행코드 -> (실행)
스크립트보다 속도는 빠르나 편리성이 약함
c/Java - 스크립트 언어 - 소스코드 -> (실행)
편리함
Javascript/Python
*문법 - 제대로 모르면 준법정신 가지고 있어야 한다.
프로그램 언어로 만들 수 있는 프로그램
- 윈도우즈 프로그램 - window / linux / macOS에 인스톨(압축해제)해서 실행하는 프로그램
CUI(Charactor User Interface) - 명령프롬포트 안에서 실행하는 프로그램(가장 기본적)
GUI(Grapic User Interface) - 메모장, 브라우저 등2. 웹 프로그램 - 브라우저 내부에서 실행되는 프로그램(대표적으로 html/Javascript)
3. 모바일 프로그램
Java Script
자바스크립트(JavaScript)는 객체(object) 기반의 스크립트 언어
HTML : 웹의 내용을 작성
CSS : 웹 디자인
자바스크립트로는 웹의 동작을 구현 가능
주로 웹 브라우저에 많이 쓰이나, Node.js와 같은 프레임워크를 사용시 서버 측 프로그래밍에서도 사용 가능
MS - Jscript / 기타업체 - Javascript(Mocha -> livescript -> Javascript)
->> ECMAScript(자바스크립트 기반으로 표준화된 스크립트 언어)
구글이 표준화를 넘어 자바스크립트 해석엔진을 개량해서 오픈소스로 뿌림(v8 엔진)
ES6버전부터 굉장히 발전적(모던(신형) 자바스크립트) - 2020버전까지 나옴
==> 크롬을 OS 처럼 사용
ECMAScript/V8 용어와 뜻 기억(중요!!)
<style type=text/css>~~~</style> --> css에서 사용
<script type="text/javascript">~~</script> -->자바 스크립트에서 사용Java Script 용어들
alert - 메시지 창 생성해줌
<body>
<script type="text/javascript">
//메시지 창 생성
alert('Hello Javascript');
</script>
</body>
console.log(디버깅 위한 출력)/document.write(화면 출력)
브라우저 f12 콘솔 화면에 찍힌다!
<body>
<script type="text/javascript">
//디버깅(에러 수정)을 위한 출력(f12 콘솔 창에 보이는 것)
console.log('<b>Hello Javascript</b>'); -->기능 안 먹음(확인 용)
// html 출력(브라우저에 보이는 것)
document.write('<b>Hello Javascript</b>'); -->화면 구현(기능 먹음)
</script>
</body>표
<script type="text/javascript">
// html 출력(브라우저에 보이는 것)
document.write('<table border="1">');
document.write('<tr>');
document.write('<td>1열</td>');
document.write('<td>2열</td>');
document.write('<td>3열</td>');
document.write('</tr>');
document.write('</table>');
</script> --> html문법을 쓰나 사용 방식이 조금 다르다.head/body에서의 쓰임 용도(가장 많이 쓰인다)
<head>
<script type="text/javascript">
//선언적인 내용 주로 씀
</script>
</head>
<body>
<script type="text/javascript">
//출력할 내용
</script>
</body>외부 파일 불러와서 쓰기
-->js파일
<body>
<script type="text/javascript" src="./default.js"> -->src로 외부 js파일 불러오기
</script>
</body>프로그램 언어 문법 -> 정보처리
1. 저장소
자료형
진리값(true/false) - boolean/bool
숫자 - 정수(integer) / 실수(float/double)
문자열(String)
정의되지 않은 자료형(undefined)
생성되지 않은 자료형(null)
함수(function)
객체(object)
자료형 형태로 저장(공간)을 만든다.
변수(variable) - 내용 변경이 가능한 저장 공간
상수(constant) - 내용 변경이 불가능한 저장 공간
저장 공간(변수) 이름(식별자 규칙)
1. 대,소문자 가림
2. 예약어 사용 불가
3. 공백문자 사용 불가, 특수문자는 -와 $만 됨
4. 숫자로만 사용 불가
-->잘못 쓰면 에러 생김
표기법(code convention)
1. 변수
파스칼 표기법(첫글자 대문자 ex> Pascal Case)
헝가리안 표기법(자료형 유추 단어 + 변수 단어 : ex> strName, bBusy 등)
표기 - 예전에는 let const없이 쓰거나 var를 썼다.
-script type아래에 'use strict'를 적으면 예전 문법 사용을 방지할 수 있다.
let 변수명
변수명 = 값; (오른쪽에서 왼쪽으로 값 대입, 값에 따라 변수의 자료형태 자동결정)
console.log(변수명) : 변수의 내용값 출력
<body>
<script type="text/javascript">
let data1; //변수의 선언 (보통 선언은 head에서 한다)
data1=10; //값을 할당(대입)
let data2= 20; //선언 할당 동시
//let data1 = 15; <<중복 선언 불가
console.log( data1 ); //변수 내용 출력
console.log( data2 );
</script>
</body>
- 상수 - Screaming Snake Case 표기법(구분자 _ , 모두 대문자로)
표기 - const 상수명
const 변수명 = 값; (선언과 할당 동시에, 재할당 불가)
<body>
<script type="text/javascript">
const DATA1 = 10; //상수는 선언, 할당 동시에
console.log(DATA1);
//DATA1 = 20;
//console.log(DATA1); //재할당 불가
let data2 = 10;
data2 = 20; //재할당 가능
console.log(data2);
</script>
</body>
자료형 파악하기
boolean 자료형
<body>
<script type="text/javascript">
'use strict'
let bool1 = true; (진리값, 대문자 x)
console.log(typeof bool1); //자료형을 알아보는 방법
</body>
숫자(integer/float/double) 자료형
<body>
<script type="text/javascript">
'use strict'
let num1 = 10;
let num2 = 3.14;
let num3 = 3.14e3;
console.log(num1);
console.log(num2);
console.log(num3);
console.log(typeof num1);
console.log(typeof num2);
console.log(typeof num3);
</script>
</body>
2진수/8진수/16진수 표기법
<body>
<script type="text/javascript">
'use strict'
let num11 = 0b101; //2진수
let num12 = 0o73; //8진수
let num13 = 0x2a; //16진수
console.log(num11);
console.log(num12);
console.log(num13);
</script>
</body>
문자형
<body>
<script type="text/javascript">
'use strict'
//문자열(String) or 문자(charater)
let str1 = "Hello String";
let str2 = 'Hello String';
console.log(str1);
console.log(str2);
console.log(typeof str1);
console.log(typeof str2);
</script>
</body>
