Coding = Coder
Programming = Programmer
코더와 프로그래머의 차이가 없다.
코딩이란? 수행되어져야 하는 명령을 컴퓨터에 전달하는 커뮤니케이션이다.
컴퓨터는 0과 1만 알 수 있다.
현재는 컴퓨터가 알 수 있는 16진수로 사용하고 있다.
사람이 사용하는 언어와 컴퓨터가 사용하는 기계어를 연결해주는 행동이 컴파일이다.
프로그램 언어는 OS에 명령하게 되고 OS는 H/W에 명령하게 된다.
명령 계층이 존재하는 것을 플랫폼이라 한다.
Syntax는 문법 Semantics는 의미라고 해석한다.
Hello World는 관습적인 코딩이다.
console.log('hello world');"hello world"를 출력하는 Javascript 코드이다.
언어란 문법이 맞는 것은 당연하고 문맥에도 맞아야한다.
int x = "five";문법에는 맞지만 의미론적으로 다른 코드이다.
int함수는 숫자를 입력해야 하지만 문자열을 입력해서 코드는 잘 못 된 코드이다.
문법에 부합하는 것은 물론이고 수행하고자 하는 바를 정확히 수행하는 것이 중요하다.
요구사항이 실현되어야 의미가 있다.
모든 프로그래밍 언어에는 변수와 값, 키워드(명령), 연산자(연산 또는 평가(boolean)), 표현식(하나의 값을 만들어냄), 조건문과 반복문(흐름제어), 구문, 함수(구문의 집합), 객체 배열등의 자료구조를 제공한다.
웹브라우저에서 동작하는 유잃한 언어는 HTML, CSS, Javascript가 유일하다.
Javascript는 navigator 2를 위하여 개발한 언어이다.
jQuery의 등장으로 프로그래밍이 쉬워졌다.
Javascript는 C언어 계열의 언어이다.
Major 언어들은 대부분 C언어 계열이다.
Javascript는 인터프리터 언어로써 컴파일이 필요없어 HTML 파일 안에 직접 기술이 가능하다.
Javascript는 프로토타입 기반의 객체지향 언어이다.
Node.js의 등장으로 다양한 환경에서 사용이 가능하다.
웹 서버 주소의 뒷 쪽 상세 주소가 없다면 index.html파일로 응답한다.
HTML실행 시 script태그를 만나면 자바스크립트가 실행된다.
script태그 위치는 body태그 바로 위에 넣는 것은 참신한 아이디어이다.
script태그는 head이외의 다른 body태그 안에 넣어도 실행이 가능하다.
script태그는 위치에 의미가 있다.
Javascript의 원래 명칭은 ECMAscript이다.
ECMAscript6버전부터 매년 버전업이 되고있다.
ECMAscript6도 브라우저 별 지원이 안되는것이 있다.
ECMAscript6를 사용하려면 babel을 사용하면 된다.
<!DOCTYPE html>
<html>
<body>
<h1 id="demo">My Web Page</h1>
<button type="button" onclick="myFunction()">Click me</button>
<script>
function myFunction() {
var myHeader = document.getElementById('demo');
myHeader.innerHTML = 'Hello world!';
}
</script>
</body>
</html>button을 클릭하게 되면 myFunction()함수를 실행해야한다.
프로그래밍 언어에서의 '='는 우변에 있는 값을 좌변에 할당한다는 의미이다.
<script src="extern.js"></script>위 코드처럼 사용하면 외부의 Javascript파일을 불러 올 수 있다.
<script async src="extern.js"></script>
<script defer src="extern.js"></script>병목현상을 방지하기 위해 async, deger 요소를 사용하여 병목현상을 제거 할 수 있다.
async - html 파서가 script태그를 만나서 sript가 진행되고 script가 끝나게 되면 html 파싱이 멈추고 script가 실행 된 후 진행된다.
defer - html 파서가 script태그를 만나도 멈추지 않고 병렬로 진행된다. html파싱이 끝나자마자 진행된다.
각 명령울 statement(구문)이라 하며 구문이 실행되면 무슨일이 일어난다.
구문은 값, 연산자, 표현식, 키워드, 주석으로 구성되며 세미콜론으로 끝나야한다.
구문은 중괄호{}로 그룹화 할 수 있다.
{}는 code block이라 한다.
함수 없이 코드블럭만 존재 할 수 있다.
컴퓨터는 실수와 정수로 구분된다.
값, 변수, 연산자의 조합이며 조합을 통해 하나의 값을 만든다.
문자열은 문자끼리 합칠 수 있다.
변수는 값을 일시적인 값을 저장 또는 참조하기 위해 사용된다.
사람이 알 수 있는 이름(identifier)이다.
어떤 이름을 사용하는 것(naming)이 가장 중요하다.
var x; //변수의 선언과 초기화(undifined가 자동 할당 됨)
x = 6; //정수값의 할당(선언된 변수에 처음 할당하면 초기화 라고 한다.)- 기본 자료형
- boolean (참, 거짓)
- null
- undefined
- Number (숫자)
- String (문자열)
- Stmbol (New in ECMAScript 6)
- Object(객체) 객체의 값엔 어떠한 값이 올 수 있다. 문자열, 함수, 숫자 등등이 올 수 있다.
연산자는 하나 혹은 그 이상의 값을 하나의 값으로 만들 때 사용한다.
우변에 있는 값을 좌변에 할당한다.
우변에 함수값이 있다면 계산을 완료하고 좌변에 할당된다.
수행되어야 할 동작을 규정한 것이다.
가장 자주 사용하는 키워드는 var이다.
한줄 주석을 사용 할 떄에는 //를 사용한다.
여러줄 주석을 사용 할 떄에는 /* 개행 */을 사용한다.
자료형은 데이터의 성질을 의미한다.
숫자는 들어 갈 수 있는 한계가 있다.
데이터마다 크기가 다르기때문에 값에 따라 자바스크립트의 행동이 달라진다.
Javascript는 동적 타이핑 언어이다.
변수의 타입 선언이 없어도 할당되는 과정에서 자동으로 자료형이 결정된다.
console.log(type of 변수);변수의 타입을 확인하고 싶으면 위 코드를 사용한다.
기본 자료형
boolean - true, false
null - null
undefined - undefined
Number - 숫자
String - 문자형
객체형
Object
논리적인 요소를 나타내며 true or false 두가지 값을 가진다.
null,undefined, 숫자 0은 false로 간주한다.
null 타입은 딱 한가지 값 null을 가질 수 있다.
null은 앞의 지시관계를 끊고싶을 때 사용한다.
undefined는 명시적으로 할당 할 때만 사용하기 때문에 실무에선 할당하지 않는다.
null은 모두 소문자를 사용해야 한다.
var foo = null;
console.log(typeof foo); // object변수에 null 할당되면 object로 표현된다. 설계상의 오류이다.
null 타입 변수인지 확인할 때 typeof 연산자를 사용하면 안되고 일치 연산자(===)를 사용하여야 한다.
값을 할당하지 않는 변수는 undefined 값을 가진다.
선언되었지만 값이 할당 되지 않는 변수이다.
var foo;
console.log(foo); // undefined
foo = {
name: 'Lee',
gender: 'male'
}
console.log(foo.bar); // undefined값이 없으면 undefined로 반환한다.