- How the browser renders the document
- Receives the data (bytes) from the server.
- Parses and converts into tokens (<, TagName, Attribute, AttributeValue, >).
- Turns tokens into nodes.
- Turns nodes into the
DOM
tree.
- Builds
CSSOM
tree from thecss rules
.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
let constraints = {video: true}; | |
(async () => { | |
try{ | |
await navigator.mediaDevices.getUserMedia(constraints).then(function (param, streams) { | |
throw error | |
if (getLocalStream) { | |
/*mediaDevices체크 */ | |
let videoTracks = streams.getVideoTracks(); | |
let audioTracks = streams.getAudioTracks(); | |
console.log('dev test selected camera : ' + videoTracks[0].label); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//Shorthend property names | |
//변수명과 키값이 같은 경우 생략이 가능하다. | |
const name = 'Sori'; | |
const age = '32'; | |
const sori = { | |
name: name, | |
age: age | |
}; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
navigator.mediaDevices.enumerateDevices() will return an empty label attribute value | |
if the permission for accessing the mediadevice is not given. | |
Try using it after getUserMedia. | |
**/ | |
(async () => { | |
await navigator.mediaDevices.getUserMedia({audio: true, video: true}); | |
let devices = await navigator.mediaDevices.enumerateDevices(); | |
console.log(devices); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
json 모르던 사실 | |
1. json안에서 함수사용가능하지만 stringify후 object로 바꾸면 함수는 사라진다. | |
2. stringify사용시 특정 값만 나오게 할수 있다. | |
3. stringify사용시 콜백함수를 사용할 수 있다. | |
**/ | |
json = JSON.stringify(rabbit); | |
json = JSON.stringify(rabbit, ['name','color','size']); | |
json = JSON.stringify(rabbit, (key, value) => { |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
1. 프로미스를 반환할 수도 있다. | |
2. then후에 반아오는 변수가 하나일 경우는 생략할 수 있다. | |
**/ | |
const getHen = () => | |
new Promise((resolve, reject) => { | |
setTimeout(() => resolve('닭'), 1000); | |
}); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
head안에 async를 넣으면 html parcing과 병렬로 실행된다. | |
head안에 differ를 넣으면 html parcing을 끝내고 실행된다. | |
usestrict 사용 | |
typescript를 사용할때는 필요없지만 | |
javascript는 많이 유연한 언어로 ecmascript5를 사용하겠다는 이야기 | |
예를 들어 선언되지도 않은 변수를 불러와도 문제가 없었지만 usestrict를 사용하면 에러가 발생한다.더욱 엄격해지는것. | |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
async function getApple() { | |
await delay(1000); | |
return '사과'; | |
} | |
async function getBanana() { | |
await delay(1000); | |
return '바나나'; | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(async () => { | |
try{ | |
await (() => { | |
console.log( 'try await'); | |
throw error; | |
console.log('after throw error'); | |
})(); | |
// throw error; | |
// await (() =>{console.info('after throw error')})(); | |
return '사과'; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// This is from my comment here: http://wolfram.kriesing.de/blog/index.php/2008/javascript-remove-element-from-array/comment-page-2#comment-466561 | |
/* | |
* How to delete items from an Array in JavaScript, an exhaustive guide | |
*/ | |
// DON'T use the delete operator, it leaves a hole in the array: | |
var arr = [4, 5, 6]; | |
delete arr[1]; // arr now: [4, undefined, 6] |