7. 콜백 함수
function callback() {
console.log("Queried the database and delivered data in
5 seconds");
}
console.log("User 1 made a request");
setTimeout(callback, 5000);
console.log("User 2 made a request");
setTimeout(callback, 5000);
…
11. 이벤트 처리
var events = require('events');
var eventEmitter = new events.EventEmitter(); //이벤트를
발생시키는 객체
var ringbell = function() {
console.log(“띵동");
}
eventEmitter.on('doorOpen', ringbell);
eventEmitter.emit('doorOpen');
12. fs모듈-텍스트파일읽기(비동기처리)
var fs = require('fs');
fs.readFile('input.txt', function(err, data){
if (err) {
console.log(err);
} else {
console.log("Async data is " + data.toString());
}
});
13. fs모듈-텍스트파일읽기(동기처리)
var fs = require('fs');
var data = fs.readFileSync('input.txt');
console.log("Sync data is " + data.toString());
console.log("This is the end");
14. fs모듈-스트림읽기
var fs = require('fs');
var readableStream = fs.createReadStream('input.txt');
var data = '';
readableStream.setEncoding('UTF8');
readableStream.on('data', function(chunk) {
data += chunk;
});
readableStream.on('end', function(){
console.log(data);
});
15. fs모듈-스트림쓰기
var fs = require('fs');
var writeData = "Hello World";
var writableStream = fs.createWriteStream('output.txt');
writableStream.write(writeData, 'UTF8');
writableStream.end();
writableStream.on('finish', function(){
console.log("Write completed");
});
16. fs모듈-파이프
var fs = require('fs');
var readableStream = fs.createReadStream('in.txt');
var writableStream = fs.createWriteStream('out.txt');
readableStream.pipe(writableStream);
36. 함수의 사용
// 인사말을 취득해서 DOM에 설정 --- (※4)
const root = document.querySelector('#disp')
const msg = getGreeting()
ReactDOM.render(msg, root)
// 인사를 하는 함수 --- (※5)
function getGreeting () {
// 랜덤한 값을 취득
const r = Math.floor(Math.random() * 3)
// 값에 해당하는 메시지 리턴
if (r == 0) return <p>수고하세요</p>
if (r == 1) return <p>안녕하세요</p>
if (r == 2) return <p>좋은 하루 되세요</p>
}
37. Jsx 임베딩
// 변수의 선언 --- (※1)
const item = "SD카드"
const value = 12000
// HTML태그안에 변수값을 입력 --- (※2)
const msg = <h1>{item} – {value}원</h1>
// render()함수로 그림 --- (※3)
const elm = document.getElementById("root")
ReactDOM.render(msg, elm)
38. Jsx 스타일 지정
// React로DOM을 변경한다
ReactDOM.render(
getDOM(),
document.getElementById(＇root＇)
)
// 요소를 리턴하는 함수
function getDOM() {
// 객체에 스타일 지정 --- (※1)
const css1 = { // css스타일 --- (※2)
＂color＂: ＇red＇,
＂background-color＂: ＇#f0f0ff＇,
＂font-size＂: ＇2em＇
}
// JSX로DOM을 지정
return (
<div>
<p style={css1}>오라클자바교육센터</p>
</div>
)
}
48. react 에서 state의 의미
• 상태를 가지고 그 상태가 계속 변하는 경우 state를 사용할 수 있다.
초기화
constructor에서
this.state = ...
• 상태를 갱신할 때는
• this.setState(...)
• 상태를 가져와 랜더링하고 싶을땐
• this.state.state명
• 이와는 반대로 props는 상태가 아니라 속성으로 계속 변하지 않을 때 사용한다.
67. Test-sagent.js
//기능을 읽어들임
const request = require('superagent')
//지정된 URL로부터 데이터를 취득
const URL = 'http://localhost:3000/fruits.json'
request.get(URL)
.end(callbackGet)
//데이터를 취득했을 때 처리
function callbackGet(err, res) {
if (err) {
//취득이 안되었을 때 처리
return
}
//여기는 취득했을 때 처리
console.log(res.body)
}
