Node.js = JavaScript 런타임 = 다른 version의 JavaScript
+장점) 프론트엔드에서 빌드 툴에 이르기까지 현대 웹 개발에서 널리 사용되는 JavaScript를 사용 즉, 하나의 동일한 언어를 서버 사이드 코드에서도 사용 가능
* JavaScript : 브라우저에서 많이 사용하는 프로그래밍 언어로 도메인을 편집하거나, 브라우저에서 로딩된 페이지를 편집하거나, 팝업, 모달 또는 효과 등, 브라우저 interactive 사용자 인터페이스를 구현하는데 필수적인 요소
Node.js는 V8을 사용 (V8 : 구글에서 개발한 JavaScript 엔진으로 JavaScript를 브라우저에서 실행해줌)
Node code를 실행하는 방법
1.The REPL (Terminal에서 node 실행)
: Read, Evaluate, Print, Loop
2. Running Node.js Code (File로 code를 저장해서 실행)
first-app.js
console.log('Hello from Node.js');
terminal에서 실행
$ node first-app.js
Hello from Node.js
파일 시스템 모듈을 사용하여 (하드 드라이브에) 파일 생성하기
const fs = require('fs');
fs.writeFileSync('hello.txt','HEllo from Node.js');
JavaScript
변수, 함수 사용하기
var name = 'Max';
var age = 29;
var hobbies = true;
console.log(name);
function summerizeUser(userName, userAge, userHobby){
return (
'Name is '+ userName +
', age is ' + userAge +
' and the user has hobbies: ' + userHobby
);
}
console.log(summerizeUser(name, age, hobbies));
변수 선언 방법
const vs let
* const : 상수, 절대 변하지 않는 대상 (static과 유사?)
* let : 변경될 수도 있음
const name = 'Max';
let age = 29;
const hobbies = true;
화살표 함수
const summerizeUser = (userName, userAge, userHobby) => {
return (
'Name is '+ userName +
', age is ' + userAge +
' and the user has hobbies: ' + userHobby
);
};
//const add = (a,b) => {
// return a+b;
//};
const add = (a,b) => a+b;
const addOne = a => a+1;
const addRandom = () => 1+2;+장점) 짧은 코드, this
객체 생성 및 참조 유형
const person = {
name: 'Max',
age: 29
};
console.log(person);
const person = {
name: 'Max',
age: 29,
greet: () => {
console.log('Hi, I am ' + this.name);
}
};
person.greet();> Hi, I am undefined → 화살표 함수의 특성 때문
const person = {
name: 'Max',
age: 29,
greet: function() {
console.log('Hi, I am ' + this.name);
}
};
person.greet();> Hi, I am Max
const person = {
name: 'Max',
age: 29,
greet() {
console.log('Hi, I am ' + this.name);
}
};
person.greet();> Hi, I am Max
배열
const hobbies = ['Sports', 'Cooking', 1, true, {}];String, 숫자, Boolean, 객체나 다른 배열 저장 가능
for of loop
const hobbies = ['Sports', 'Cooking'];
for (let hobby of hobbies) {
console.log(hobby);
}> Sports
Cooking
배열 method
.
map() method: 배열 또는 값들을 변환해주며 기존의 것을 편집하는것이 x 새로운 배열을 생성
const hobbies = ['Sports', 'Cooking'];
console.log(hobbies.map(hobby => 'Hobby: ' + hobby));
console.log(hobbies);> [ 'Hobby: Sports', 'Hobby: Cooking' ]
[ 'Sports', 'Cooking' ]
push() : 기존 배열에 새로운 원소 추가
const hobbies = ['Sports', 'Cooking'];
hobbies.push('Programming');
console.log(hobbies);> [ 'Sports', 'Cooking', 'Programming' ]
연산자
... Spread : 기본 값을 절대 변경하지 않고 사본에 변경된 값을 더한 배열로 대체
연산자 (...) 뒤에 오는 배열이나 객체를 받아서 원소나 속성을 끄집어냄 즉, 배열의 원소나 객체의 속성을 스프레드 연산자 주위에 있는 대상에 추가
기존 배열의 원소 하나하나 끄집어내서 추가해서 새로운 배열 만들어냄
배열이나 객체에서 원소나 속성을 추출하는 데 사용
const hobbies = ['Sports', 'Cooking'];
const copiedArray = [...hobbies];
console.log(copiedArray);> [ 'Sports', 'Cooking' ]
... Rest : 인수 목록이나 함수에서 여러 인수를 하나의 배열로 묶는 데 사용
const toArray = (...args) => {
return args;
};
console.log(toArray(1, 2, 3, 4));> [ 1, 2, 3, 4 ]
Destructuring : 들어오는 객체에서 무엇을 필요로 하는지 어떤 값을 로컬 변수에 저장해서 이 함수에 사용할지 확실히 명시
// const printName = (personData) => {
// console.log(personData.name);
// }
const printName = ({ name }) => {
console.log(name);
}
printName(persion);
const { name, age } = person;
console.log(name, age);
const hobbies = ['Sports', 'Cooking']
const [hobby1, hobby2] = hobbies;
console.log(hobby1, hobby2);
비동기화 코드 : 즉시 실행되거나 끝나지 않고 시간이 소요
모든 동기화 코드가 종료된 뒤에 비동기화 코드 실행
//비동기화 코드
setTimeOut(() => {
console.log('Timer is done!');
}, 2000);
//동기화 코드
console.log('Hello!');
console.log('Hi!');> Hello!
Hi!
(출력 2초 후)
Timer is done!
const fetchData = callback => {
setTimeout(() => {
callback('Done!');
}, 1500);
};
setTimeOut(() => {
console.log('Timer is done!');
fetchData(text => {
console.log(text);
});
}, 2000);
console.log('Hello!');
console.log('Hi!');> Hello!
Hi!
(출력 2초 후)
Timer is done!
(출력 1.5초 후)
Done!
프로미스
const fetchData = callback => {
const promise = new Promise((resolve, reject) => {
setTimeout(() => {
callback('Done!');
}, 1500);
});
return promise;
};
setTimeOut(() => {
console.log('Timer is done!');
fetchData()
.then(text => {
console.log(text);
return fetchData();
})
.then(text2 => {
console.log(text2);
});
}, 2000);
console.log('Hello!');
console.log('Hi!');> Hello!
Hi!
(출력 2초 후)
Timer is done!
(출력 1.5초 후)
Done!
(출력 1.5초 후)
Done!