만약, main.js를 종료하면 더이상 접근이 불가능해진다. -> js파일이 서버로서 작동하고 있다는 것을 알 수 있다.
2. JavaScript - 기초문법
[1. JavaScript - JS의 특징]
1. JS의 역사 2008년 V8엔진 출시(super fast, 컴파일러와 메모리 관리 시스템) => js를 웹에서 끌어내서 따로 써볼까? (2009년 Node.js 등장) -- 하나의 언어로 Front, End, DB(MongoDB) = FullStack -- 이후 프론트엔드 프레임워크(React, Vue등)의 대중화, SPA(Single Page Application) 개발의 활성화 -- 현재 : JS는 프론트 엔드와 백 엔드 개발 분야에서 널리 사용되고 있으며, Node.JS를 이용한 서버 개발도 발히 이루어지고 있다.
2. JS 언어의 특징 [객체 지향 프로그래밍 지원] (객체지향 : 데이터와 함수를 객체라는 그룹으로 묶어 처리 / 절차지향 : 순서대로 실행되는 일련의 과정으로 프로그래밍) 객체를 생성하고 관리하는 데에 강점. 복잡한 기능 구현 가능. 중괄호({})를 통해 객체 생성, 속성을 쉼표(,)로 구분. 속성은 이름과 값을 지니닌다. 이름은 문자열로, 값은 여러 데이터 타입으로. 객체 내부의 함수는 메소드라 부르며 속성의 값으로 메소드를 추가할 수 있음. 객체를 만들어 필요한 속성과 메소드를 추가하여 사용.
[동적 타이핑] 변수 선언시 타입을 지정하지 않음. 이는 런타임 시점에 변수에 할당되는 값에 따라 데이터 타입이 자동으로 결정된다는 뜻. (변수가 불러와 졌을때 타입이 결정된다.)
(런타임 시점 : 프로그램이 실행되는 동안의 시점. = 코드가 실행되는 동안에 발생하는 시점 / 컴파일 시점)
[함수형 프로그래밍 지원] 자바 스크립트는 함수를 사용해서 프로그래밍할 수 있다! 함수를 일급 객체로 취급하고, 고차 함수를 지원한다. 이는 코드의 재사용성과 가독성이 높아진다는 뜻. (일급 객체 : 함수를 일반 값과 마찬가지로 취급할 수 있다.) (고차 함수 : 함수를 인자로 받거나, 함수를 변수로 받는 함수. )
[비동기 처리] 처리가 병렬로 이루어진다. -> 속도가 빠른 이유
[클라이언트 측 및 서버 측 모두 지원] Node.js를 사용한 서버 구축 가능. 풀스택 개발에 자바스크립트를 활용할 수 있다!
[2. JavaScript - 기본 문법]
(1) 변수 와 상수 변수 - 모든 프로그래밍 언어는 값을 메모리에 저장하고, 저장된 값을 읽어 재사용 하기 위해 변수를 이용. 변수의 주요 5개념 - 이름(고유명), 값(저장된 값), 할당(저장), 선언(사용하기 위한 행위), 참조(할당된 값을 read)
변수 선언 키워드 - var, let, const + <변수명> var : 옛날 방식, 여러 번 선언해도 오류가 발생하지 않는다. 가장 마지막에 선언한 값으로 선언됨. let : 변수 선언(선언 이후 변경 가능). 같은 이름이 변수 두 번 선언시 오류 발생. const : 상수 선언(선언 이후 변경 불가능). 같은 이름이 변수 두 번 선언시 오류 발생. 선언되지 않은 변수 사용시, 참조 에러 발생.
[1. JS의 특징] JS는 프론트엔드/백엔드 모두에서 널리 사용되고 있는 언어이다. -> 배울 필요가 있다. JS는 객체 지향, 동적 타이핑, 함수형 프로그래밍, 비동기 처리, 클라이언트 서버 지원을 특징으로 한다. -> 파이썬이랑 거의 유사한데? / 웹개발을 파이썬으로 못하는건 아니지만, JS가 더 쉽고 빠르다. 마찬가지로 JS로 인공지능 개발을 못하는건 아니지만, 파이썬이 더 잘한다.(Pytorch는 신이고 무적이다)
[2. 기본 문법] (1) 변수와 상수 let 변수선언, const 상수선언 (2) 자료형 1. 숫자형 - 정수형(Integer), 실수형(Float), 지수형(Exponential), NaN, Infinity(+), Infinity(-) - (python의 int, float과 함수로 표현되는 값들...) 2. 문자열 (== python str) 3. 불리언 (Boolean, python과 동일) 4. undefined 5. null 6. 객체(Object) - 객체 리터럴, 생성자 함수, 프로토타입, class로 생성 / python에선 class로 생성 - 일단 예제에선 파이썬의 딕셔너리와 같은 형태를 가지지만, 이런저런 부분이 다르다. 따옴표 생략이라던가... 7. 배열(Array) - 파이썬에서 배열은 numpy로 지원하는 n*n형태의 배열을 말한다. 바닐라 파이썬의 리스트와 비슷한 느낌으로 쓰는건가?
let myVariable = "Hello, world!"; // 변수 선언 및 문자열 데이터 타입으로 할당
console.log(typeof myVariable); // "string" 출력
myVariable = 123; // 숫자 데이터 타입으로 할당
console.log(typeof myVariable); // "number" 출력
myVariable = true; // 불리언 데이터 타입으로 할당
console.log(typeof myVariable); // "boolean" 출력
고차함수 예시
function operate(func, a, b) {
return func(a, b);
}
function add(a, b) {
return a + b;
}
function multiply(a, b) {
return a * b;
}
console.log(operate(add, 2, 3)); // 5
console.log(operate(multiply, 2, 3)); //
변수 선언 예시
// var로 변수 선언
var myVar = "Hello World";
console.log(myVar); // "Hello World"
// let으로 변수 선언
let myLet = "Hello World";
console.log(myLet); // "Hello World"
// const로 상수 선언
const myConst = "Hello World";
console.log(myConst); // "Hello World"
2. 문자열
// 길이(length) 확인
let str = "Hello, world!";
console.log(str.length); // 13
// 결합(concaternation)
let str1 = "Hello, ";
let str2 = "world!";
let result = str1.concat(str2);
console.log(result); // "Hello, world!"
// 자르기(substr, slice)
let str = "Hello, world!";
console.log(str.substr(7, 5)); // "world"
console.log(str.slice(7, 12)); // "world"
// 검색(search)
let str = "Hello, world!";
console.log(str.search("world")); // 7
// 대체(replace)
let str = "Hello, world!";
let result = str.replace("world", "JavaScript");
console.log(result); // "Hello, JavaScript!"
// 분할(split)
let str = "apple, banana, kiwi";
let result = str.split(",");
console.log(result); // ["apple", " banana", " kiwi"]
3. 불리언
// 조건문과 논리 연산자에서의 불리언 연산자 사용 예시
let a = 1;
let b = 2;
if (a==b){
console.log("same");
}
else {
console.log("diffrent");
}
console.log(a**b); // false
