이 repo는 Frontendmasters 코스와 관련이 있습니다.
개념을 더 잘 이해하기 위해 질문과 추가 리소스를 찾을 수 있습니다.
이 Advanced Web Dev 퀴즈는 웹 개발자가 매일 다루는 광범위한 것들을 다룹니다. 목표는 수년에 걸쳐 잊어 버렸거나 단순히 자주 노출되지 않는 특정 개념을 소개하는 것입니다.
재미있게 보내십시오. 그리고 오늘은 새로운 것을 배울 것입니다! 행운을 빌어요! ?
켈 이 repo에는 답변 (!)이 포함되어 있지 않으며 질문의 주제에 대한 질문과 유용한 리소스 만 포함합니다!
답변을보고 각 질문에 대한 시각화 된 설명을 보려면 Frontendmasters 코스를보십시오! |
|---|
개요
- 질문 1 :
async 및 defer 실행 순서 - 질문 2 : 렌더링 파이프 라인 및 합성
- 질문 3 : 도메인 요청 해결
- 질문 4 : Call Stack & Event Loop
- 질문 5 : 자원 힌트
- Quesiton 6 : 객체 참조 및 파괴
- 질문 7 :
PerformanceNavigationTiming - 질문 8 : 캐시 지시문
- 질문 9 : 쓰레기 수집
- 질문 10 : 애니메이션 비용
- 질문 11 : 이벤트 전파
- 질문 12 : CSS 특이성
- 질문 13 :
WeakMap - 질문 14 : 웹 생명
- 질문 15 : 컨텐츠 보안 정책
- 질문 16 : 참조 정책
- 질문 17 : 발전기
- 질문 18 : 약속 방법
- 질문 19 : 역전 캐시
- 질문 20 : XSS, MITM, CSRF, 클릭 잭킹
- 질문 21 : 글꼴 전략
- 질문 22 : 쿠키
- 질문 23 : CSS 의사 선택기
- 질문 24 :
Strict-Transport-Security - 질문 25 : 렌더 레이어
- 질문 26 : 이미지 형식
- 질문 27 : Cors
- 질문 28 : 이벤트 루프
- 질문 29 : HTTP/1, HTTP/2, HTTP/3
- 질문 30 :
this 키워드
모든 질문
1. 적절한 실행 순서로 스크립트를 넣으십시오.
- A.
<script defer src="defer1.js" /> ( 300ms 의로드) - B.
<script defer src="defer2.js" /> ( 200ms 의로드) - C.
<script async src="async1.js" /> ( 300ms 의로드) - D.
<script async src="async2.js" /> ( 50ms 로드) - E.
<script async defer src="asyncdefer1.js" /> ( 60ms 의로드)
자원
답변:
추가 읽기 :
- https://html.spec.whatwg.org/multipage/scripting.html#attr-script-async
- https://javaScript.info/script-async-defer
- https://developer.mozilla.org/en-us/docs/web/html/element/script
2. 어떤 진술이 사실입니까?
- A. 렌더 트리에는 DOM과 CSSOM의 모든 요소가 결합되어 있습니다.
- B. 복합은 Z- 인덱스를 기반으로 층을 분리하는 과정이며, 화면에 표시된 최종 이미지를 형성하기 위해 결합됩니다.
- C. 레이아웃 프로세스는 렌더 트리의 시각적 요소에 색상과 이미지를 할당합니다.
- D. 퇴비 과정은 복합사 스레드에서 발생합니다
- E. 페이지에서 보이지 않는 요소 (예 :
display: hidden , 돔 트리의 일부가 아닙니다.
자원
답변:
추가 읽기 :
- https://www.chromium.org/developers/design-documents/graphics-and-skia/
- https://www.chromium.org/developers/design-documents/gpu-accelerated-compositing-in-chrome/
- https://chromium.googlesource.com/chromium/src/+/master/docs/how_cc_works.md
- https://docs.google.com/presentation/d/1bopxbgnrtu0ddsc144rcxayga_wf53k96imrh8mp34y
- https://developer.chrome.com/blog/inside-browser-part4/
- https://www.chromium.org/blink/
3. 간격을 채우십시오
- Browser sends request to [A]
- [A] queries [B]
- [B] responds with [C] IP address
- [A] queries [C]
- [C] responds with [D] IP address
- [A] queries [D]
- [D] responds with website's [E]
- 재귀 DNS 리졸버
- 루트 이름 서버
- IP 주소
- 최상위 도메인 이름 서버
- 자동 지정 이름 서버
자원
답변:
추가 읽기 :
- https://datatracker.ietf.org/doc/html/rfc1035
- https://www.liquidweb.com/kb/how-to-demystify-the-dns-process/
- https://www.cloudflare.com/learning/dns/what-is-dns/
- https://www.cloudflare.com/learning/dns/what-is-recursive-dns/
4. 무엇이 기록됩니까?
setTimeout ( ( ) => console . log ( 1 ) ) ;
Promise . resolve ( ) . then ( ( ) => console . log ( 2 ) ) ;
Promise . resolve ( ) . then ( ( ) => setTimeout ( ( ) => console . log ( 3 ) ) ;
new Promise ( ( ) => console . log ( 4 ) ) ;
setTimeout ( ( ) => console . log ( 5 ) ) ;
- A.
1 2 3 4 5 - B.
1 5 2 4 3 - C.
3 2 4 1 5 - D.
4 2 1 5 3 - E.
2 4 3 1 5
자원
답변:
추가 읽기 :
- https://tc39.es/ecma262/#sec-promise-objects
- https://dev.to/lydiahallie/javaScript-visual-promises-async-await-5gke
- https://developer.mozilla.org/en-us/docs/web/javaScript/reference/global_objects/promise
- https://web.dev/promises/
- https://javaScript.info/promise-basics
- https://javaScript.info/microtask-queue
5. 리소스 힌트를 정의와 일치시킵니다
- A.
dns-prefetch - B.
preconnect - C.
prefetch - D.
preload
- 현재 내비게이션에 필요한 중요한 리소스의 가져 오기 우선 순위.
- 백그라운드에서 도메인 이름 해상도를 수행합니다
- DNS 해상도 및 TCP/TLS 핸드 셰이크를 적극적으로 수행합니다
- 백그라운드에서 비 임계 리소스를 요청합니다
자원
답변:
추가 읽기 :
- https://html.spec.whatwg.org/#linktypes
- https://www.chromium.org/developers/design-documents/dns-prefetching/
- https://www.smashingmagazine.com/2019/04/optimization-performance-resource-hints/
- https://web.dev/preconnect-and-dns-prefetch/
- https://csswizardry.com/2019/01/bandwidth- 또는-latency-ter-to-optimise-why/
- https://www.splunk.com/en_us/blog/learn/preconnect-resource-hints.html
6. 출력은 무엇입니까?
const member = {
name : "Jane" ,
address : { street : "101 Main St" }
} ;
const member2 = { ... member } ;
member . address . street = "102 Main St" ;
member . name = "Sarah" ;
console . log ( member2 ) ;- A.
{ name: "Jane", address: { street: "101 Main St" }} - B.
{ name: "Jane", address: { street: "102 Main St" }} - C.
{ name: "Sarah", address: { street: "101 Main St" }} - D.
{ name: "Sarah", address: { street: "102 Main St" }}
자원
답변:
추가 읽기 :
- https://developer.mozilla.org/en-us/docs/glossary/shallow_copy
- https://developer.mozilla.org/en-us/docs/web/javascript/reference/operators/spread_syntax
7. PerformanceNavigationTimings 올바른 순서로 배치하십시오
- A.
loadEventStart - B.
domComplete - C.
domContentLoadedEventStart - D.
fetchStart - E.
connectEnd - F.
domInteractive
자원
답변:
추가 읽기 :
- https://www.w3.org/tr/navigation-timing-2/
- https://developer.mozilla.org/en-us/docs/web/performance/navigation_and_resource_timings
- https://web.dev/navigation-and-resource-timing/
8. 캐싱 지시를 정의와 일치시킵니다
- A.
no-cache - B.
must-revalidate - C.
no-store - D.
private - E.
stale-while-revalidate
- 사용하기 전에 Origin 서버로 오래된 응답을 확인합니다.
- Origin 서버로 캐시 된 응답을 검증하면서 오래된 컨텐츠를 제공합니다.
- 요청 또는 응답의 일부를 캐시하지 않습니다
- 여전히 신선한 경우에도 사용하기 전에 Origin 서버로 캐시 된 응답을 확인합니다.
- 공유 캐시의 캐싱을 방지합니다
자원
답변:
추가 읽기 :
- https://www.rfc-editor.org/rfc/rfc9111
- https://www.keycdn.com/blog/http-cache-headers
- https://www.cloudflare.com/learning/cdn/glossary/what-is-cache-control/
9.이 코드 블록에 대해 어떤 진술이 사실입니까?
function addMember ( name ) {
return { name , createdAt : Date . now ( ) }
}
let obj1 = addMember ( "John" ) ;
let obj2 = addMember ( "Sarah" ) ;
obj1 . friend = obj2 ;
obj2 . friend = obj1 ;
obj1 = null ;
obj2 = null ;- A.
obj1 및 obj2 쓰레기를 수집 할 수 없어 메모리 누출로 이어집니다. - B.
obj1 과 obj2 null 설정 한 직후에 수집됩니다. - C.
obj1 및 obj2 브라우저 탭을 닫은 후에 만 수집됩니다. - D.
obj1 및 obj2 다음 쓰레기 수집주기 동안 수집 할 수 있습니다.
자원
답변:
추가 읽기 :
- https://developer.mozilla.org/en-us/docs/web/javaScript/memory_management
- https://javaScript.info/garbage-collection
- https://github.com/thlorenz/v8-perf/blob/master/gc.md
- https://medium.com/@mmoshikoo/garbage-collector-in-v8-engine-1c582399837
10. 올바르게 나열된 렌더링 비용이있는 다음 속성을 애니메이션 할 때?
- A.
width : 레이아웃, 페인트, 복합재 - B.
opacity : 페인트, 복합재 - C.
background-image : 복합재 - D.
left : 레이아웃, 페인트, 복합재 - E.
transform : 페인트, 복합재
자원
답변:
추가 읽기 :
- https://www.chromium.org/developers/design-documents/gpu-accelerated-compositing-in-chrome/
- https://developer.chrome.com/blog/inside-browser-part3/
- https://www.smashingmagazine.com/2016/12/gpu-animation-doing-it-right/
- https://web.dev/avoid-large-complex-layouts-andlayout-thrashing/
- https://developer.chrome.com/blog/hardware-accelerated-animations/
11. 버튼을 클릭 할 때 무엇이 기록됩니까?
< div class = "outer" >
< div class = "inner" >
< button > Click me! </ button >
</ div >
</ div >
outer . addEventListener ( "click" , ( ) => log ( "A" ) , true ) ;
outer . addEventListener ( "click" , ( ) => log ( "B" ) ) ;
inner . addEventListener ( "click" , ( ) => log ( "C" ) , true ) ;
inner . addEventListener ( "click" , ( e ) => {
log ( "D" ) ;
e . stopPropagation ( ) ;
log ( "E" ) ;
} ) ;
button . addEventListener ( "click" , ( ) => log ( "F" ) ) ;
button . addEventListener ( "click" , ( ) => log ( "G" ) , true ) ;- A.
A B C D E F G - B.
A C G F D - C.
B D E F G C A - D.
A C G F - E.
A C G F D E
자원
답변:
추가 읽기 :
- https://www.w3.org/tr/dom-2-2-events/events.html#events-flow
- https://javaScript.info/bubbling-and-capturing
- https://developer.mozilla.org/en-us/docs/web/api/eventtarget/addeventlistener
12. 특이성을 올라가서 CSS 선택기를 주문하십시오
- A.
div h1.large-text::before - B.
div h1:first-child - C.
h1:not(.small-text) - D.
.large-text:nth-child(1) - E.
h1.large-text[id="title"] - F.
h1.large-text#title
자원
답변:
추가 읽기 :
- https://www.w3.org/tr/2018/rec-selectors-3-20181106/#specificity
- https://developer.mozilla.org/en-us/docs/web/css/specificity
- https://specificity.keegan.st/
13. 어떤 진술이 사실입니까?
const userTokenMap = new WeakMap ( ) ;
let user = {
name : "Jane Doe" ,
age : 24
} ;
userTokenMap . set ( user , "secret_token" ) ;- A.
userTokenMap 반복자 프로토콜을 구현합니다 - B.
user null 로 설정할 때 userTokenMap 반환합니다 0 - C. 사용자 객체가
null 로 설정된 경우 userTokenMap 항목을 수집 할 수 있습니다. - D.
[...userTokenMap] userTokenMap 항목 배열을 반환합니다
자원
답변:
추가 읽기 :
- https://read262.netlify.app/keyed-collection/weakmap-objects/
- https://javaScript.info/weakmap-weakset
- https://developer.mozilla.org/en-us/docs/web/javascript/reference/global_objects/weakmap
14. 웹 생명체를 올바른 설명과 일치시킵니다
- A. TTFB
- B. 피
- C. TTI
- D. TBT
- E. CLS
- F. INP
- 웹 페이지가 사용자의 첫 번째 상호 작용에 응답하는 데 걸리는 시간.
- 기본 스레드가 사용자 입력에 응답하는 것이 차단되는 시간.
- 사용자가 상호 작용 한 후 웹 페이지가 비주얼을 업데이트하는 데 걸리는 평균 시간.
- 서버가 요청에 응답하고 클라이언트에게 데이터를 다시 전송하는 데 걸리는 시간
- 웹 페이지가 완전히로드되고 사용자 입력에 응답하는 데 걸리는 시간.
- 웹 페이지 레이아웃의 안정성 또는 웹 페이지에서 발생하는 예기치 않은 레이아웃 이동이로드 될 때.
자원
답변:
추가 읽기 :
15. 다음 CSP 헤더로 어떤 리소스가 허용됩니까?
default - src "none" ; script - src "self" ; img - src "self" example . com ; style - src fonts . googleapis . com ; font - src fonts . gstatic . com ;
- A.
<script src="/js/app.js"></script> - B.
fetch("https://api.website.com/data") - C.
@font-face { url("fonts/my-font.woff") } - D.
<img src="data:image/svg+xml;..." /> - E.
<style>body { font-family: 'Roboto' }</style> - F.
<iframe src="https://embed.example.com"></iframe> - G.
<link rel="stylesheet" href="https://fonts.googleapis.com..> - H.
<video src="https://videos.example.com/..."></video>
자원
답변:
추가 읽기 :
- https://content-security-policy.com/
- https://developer.mozilla.org/en-us/docs/web/http/csp
- https://web.dev/csp/
16. 어떤 진술이 사실입니까?
- A.
rel="noopener" 원래 페이지가 새로 열린 페이지의 window 개체에 액세스하는 것을 방지하는 데 사용됩니다. - B.
rel="noreferrer" 새로 열린 페이지가 원래 페이지의 window 개체에 액세스하는 것을 방지하는 데 사용될 수 있습니다. - C.
rel="noopener" 및 rel="noreferrer" HTTPS에서만 사용할 수 있습니다. - D.
rel="noopener" 사용하여 Tabnabbing을 방지 할 수 있습니다 - E. 기본
Referrer-Policy no-referrer-when-downgrade 입니다
자원
답변:
추가 읽기 :
- https://www.w3.org/tr/referrer-policy/
- https://html.spec.whatwg.org/multipage/links.html#link-type-noopener
- https://html.spec.whatwg.org/multipage/links.html#link-type-noreferrer
- https://web.dev/referrer-best-practices/
17. 언제 "In log: My input!" 로그인 하시겠습니까?
function * generatorFunc ( ) {
const result = yield "My input!" ;
console . log ( "In log:" , result ) ;
return "All done!"
} ;
const it = generatorFunc ( ) ;- A.
it.next() - B.
it.next("My input!") it.next() - C.
it.next() it.next("My input!") - D.
it.next() it.next()
자원
답변:
추가 읽기 :
- https://developer.mozilla.org/en-us/docs/web/javaScript/guide/iterators_and_generators
- https://javaScript.info/generator
- https://exploringjs.com/es6/ch_iteration.html
- https://developer.mozilla.org/en-us/docs/web/javaScript/reference/global_objects/generator
- https://blog.logrocket.com/javaScript-ITerators-and-generators-a-complete-guide/
18. 약속 방법을 올바른 출력에 연결하십시오
const promises = [
new Promise ( res => setTimeout ( ( ) => res ( 1 ) , 200 ) ,
new Promise ( res => setTimeout ( ( ) => res ( 2 ) , 100 ) ,
new Promise ( ( _ , rej ) => setTimeout ( ( ) => rej ( 3 ) , 100 ) ,
new Promise ( res => setTimeout ( ( ) => res ( 4 ) , 300 )
] ;
Promise [ ❓ ]
. then ( res => console . log ( "Result: " , res ) )
. catch ( err => console . log ( "Error: " , err )
- A.
all - B.
any - C.
race - D.
allSettled
-
Result: 2 -
Error: 3 -
Result: [{}, {}, {}, {}] -
Result: 2
자원
답변:
추가 읽기 :
- https://javaScript.info/promise-basics
- https://developer.mozilla.org/en-us/docs/web/javaScript/reference/global_objects/promise
19. 다음 중 어느 값 중 어느 값이 귀하의 페이지를 BFCache에 자격 할 수 없게 만드는가?
- A.
unload - B.
pagehide - C.
onbeforeunload - D.
pageshow - E. 위의 모든 것
- F. 위의 어느 것도
자원
답변:
추가 읽기 :
- https://web.dev/bfcache/
- https://www.smashingmagazine.com/2022/05/performance-game-changer-back-forward-cache/
- https://nitropack.io/blog/post/back-forward-cache
20. 용어를 정의와 연결하십시오
- A. XSS
- B. CSRF
- C. UI 구제
- D. MITM
- 공격자가 다른 사람이 본 웹 페이지에 악의적 인 스크립트를 주입 할 수 있습니다.
- 변장 또는 숨겨진 요소와 상호 작용하도록 사용자를 속입니다
- 인증 된 세션을 이용하여 원치 않는 작업을 실행하도록 사용자를 속입니다.
- 공격자는 지식없이 두 당사자 간의 의사 소통을 가로 채고 수정할 수 있도록합니다.
자원
답변:
추가 읽기 :
- https://owasp.org/www-community/attacks/xss/
- https://owasp.org/www-community/attacks/csrf
- https://owasp.org/www-community/attacks/clickjacking
- https://www.imperva.com/learn/application-security/man-in-the-middle-attack-mitm/
- https://cheatsheetseries.owasp.org/cheatsheets/cross-site_request_forgery_prevention_cheat_sheet.html
- https://cheatsheetseries.owasp.org/cheatsheets/cross_site_scripting_prevention_cheat_sheet.html
21. 글꼴 전략을 정의에 연결하십시오
- A.
font-display: block - B.
font-display: swap - C.
font-display: fallback - D.
font-display: optional - E.
font-display: auto
- 사용자 정의 글꼴이 다운로드 될 때까지 보이지 않는 글꼴을 임시로 렌더링합니다.
- 사용자 정의 글꼴이 다운로드되는 동안 폴백 글꼴을 사용하고 사용 가능한 경우 사용자 정의 글꼴로 전환하십시오.
- 사용 가능한 경우 사용자 정의 글꼴 만 사용하십시오. 그렇지 않으면 폴백 글꼴을 사용하십시오.
- 브라우저가 글꼴 로딩에 가장 적합한 동작을 결정할 수 있습니다.
- 사용 가능한 경우 사용자 정의 글꼴을 사용하십시오. 사용자 정의 글꼴을 사용할 수없는 경우 폴백 글꼴을 사용하십시오.
자원
답변:
추가 읽기 :
- https://developer.mozilla.org/en-us/docs/web/css/@font-face/font-display
- https://css-tricks.com/almanac/properties/f/font-display/
22. 다음 쿠키 헤더에 대해 어떤 진술이 사실입니까?
Set - Cookie : my - cookie = "value" ; Domain = "website.com" ; Secure ; HttpOnly ;
- A.이 쿠키는
www.website.com 에서 액세스 할 수 있지만 blog.website.com 은 아닙니다. - B.이 쿠키는
website.com 도메인에서 클라이언트 측만 설정할 수 있습니다. - C.이 쿠키는 세션 쿠키처럼 취급됩니다
- D.이 쿠키는 다른 웹 사이트에서
www.website.com 으로 탐색 할 때 전송됩니다.
자원
답변:
추가 읽기 :
- https://httpwg.org/http-extensions/draft-ietf-httpbis-rfc6265bis.html#name-overview
- https://resources.infosecinstitute.com/topic/securing-cookies-httponlyecure-flags/
- https://developer.mozilla.org/en-us/docs/web/http/cookies
- https://developer.mozilla.org/en-us/docs/web/http/headers/set-cookie
23. 첫 번째 목록 항목 <li>One</li> 를 대상으로하는 데 사용할 수있는 CSS (Pseudo) 셀렉터 중 어느 것이 있습니까?
< div >
< ul >
< li > One </ li >
< ul >
< li > Two </ li >
< li > Three </ li >
</ ul >
</ ul >
< ul >
< li > Four </ li >
</ ul >
</ div >- A.
ul:first-child > li - B.
ul:first-child + li - C.
ul:first-child > li:first-child - D.
ul:first-of-type > li:first-of-type - E.
ul:first-child + li:first-child
자원
답변:
추가 읽기 :
- https://developer.mozilla.org/en-us/docs/web/css/css_selectors
- https://developer.mozilla.org/en-us/docs/web/css/pseudo-classes
- https://www.w3.org/tr/selectors-4/#pseudo-classes
24. 다음 헤더의 사실은 무엇입니까?
Strict - Transport - Security : max - age = 31536000 ; includeSubdomains ;
- A. 헤더는 도메인 및 하위 도메인에서 1 년 동안 HTTPS를 시행합니다.
- B.
max-age 만료되면 브라우저는 HTTP로 기본값을받습니다 - C. 브라우저가 헤더를 읽을 때마다
max-age 새로 고침됩니다. - D. 하위 도메인에 대한 불안한 요청이 허용됩니다
자원
답변:
추가 읽기 :
- https://cheatsheetseries.owasp.org/cheatsheets/http_strict_transport_security_cheat_sheet.html
- https://developer.mozilla.org/en-us/docs/web/http/headers/strict-transport-security
25. 다음 중 요소가 자체 RenderLayer로 홍보되는 원인은 무엇입니까?
- A.
z-index: 1 - B.
translate3d: (0, 0, 0) - C.
will-change: transform - D.
transform: rotate(45deg) - E.
position: fixed - F.
position: absolute
자원
답변:
추가 읽기 :
- https://www.chromium.org/developers/design-documents/gpu-accelerated-compositing-in-chrome/
- https://surma.dev/things/forcing-layers/
- https://web.dev/speed-layers/
- https://www.chromium.org/developers/design-documents/graphics-and-skia/
26. 이미지 형식을 설명과 일치시킵니다
- A. JPEG
- B. PNG
- C. 웹
- D. AVIF
- 손실 및 무손실 압축, HDR 및 WCG를 지원하며 투명성을 지원합니다.
- 손실과 무손실 압축, 투명성을 지원하며 점진적인 렌더링을 지원합니다.
- 무손실 압축, 고품질은 투명성, 더 큰 파일 크기를 지원합니다
- 손실 압축은 점진적인 렌더링을 지원합니다
자원
답변:
추가 읽기 :
- https://developer.mozilla.org/en-us/docs/web/media/formats/image_types
- https://www.smashingmagazine.com/2021/09/modern-image-formats-avif-webp/
27. 다음 CORS 구성에 대해 무엇이 사실입니까?
Access - Control - Allow - Origin : https : / / www . website . com
Access - Control - Allow - Headers : Content - Type
Access - Control - Allow - Methods : *
Access - Control - Expose - Headers : X - Custom - Header
Access - Control - Max - Age : 600
- A. 프리 플라이트 요청이 필요합니다
- B.
https://www.website.com 의 요청 만 허용됩니다 - C. 쿠키 요청이 허용됩니다
- D. 실제 응답은 600ms로 캐시됩니다
- E.
X-Custom-Header 유일하게 포함 된 응답 헤더입니다 - F.
GET , POST , PATCH 및 PUT 메소드가 허용되지만 DELETE 되지 않습니다.
자원
답변:
추가 읽기 :
- https://www.w3.org/tr/2020/spsd-cors-20200602/
- https://fetch.spec.whatwg.org/#http-cors-protocol
- https://developer.mozilla.org/en-us/docs/web/http/cors
28. 무엇이 기록됩니까?
setTimeout ( ( ) => console . log ( 1 ) ) ;
( async ( ) => {
console . log ( 2 ) ;
await Promise . resolve ( ) ;
console . log ( 3 ) ;
} ) ( )
Promise . resolve ( ) . then ( ( ) => Promise . resolve ( ) . then ( ( ) => console . log ( 4 ) ) )- A.
1 2 3 4 - B.
2 4 3 1 - C.
2 3 4 1 - D.
2 3 1 4
자원
답변:
추가 읽기 :
- https://tc39.es/ecma262/#sec-promise-objects
- https://dev.to/lydiahallie/javaScript-visual-promises-async-await-5gke
- https://developer.mozilla.org/en-us/docs/web/javaScript/reference/global_objects/promise
- https://web.dev/promises/
- https://javaScript.info/promise-basics
- https://javaScript.info/microtask-queue
29. 어떤 진술이 맞습니까?
- A. HTTP/2는 단일 TCP 연결을 통해 동시에 여러 요청 및 응답을 허용합니다.
- B. HTTP/3은 HTTPS에서만 사용할 수 있습니다
- C. HTTP/2는 HTTP/1.1과 호환됩니다
- D. HTTP/1.1은 여러 요청을 동시에 처리하려면 여러 TCP 연결이 필요합니다.
자원
답변:
추가 읽기 :
- https://www.section.io/engineering-education/http3-vs-http2/
- https://www.cloudflare.com/learning/performance/http2-vs-http1.1/
- https://www.cloudflare.com/learning/performance/what-is-http3/
30. 무엇이 기록됩니까?
const objA = {
type : "A" ,
foo ( ) {
console . log ( this . type )
}
}
const objB = {
type : "B" ,
foo : objA . foo ,
bar : ( ) => objA . foo ( ) ,
baz ( ) { objA . foo ( ) }
}
objB . foo ( ) ;
objB . bar ( ) ;
objB . baz ( ) ; - A.
A B B - B.
B A A - C.
A A A - D.
A undefined A - E.
B undefined B
자원
답변:
추가 읽기 :
- https://tc39.es/ecma262/#sec-function-environment-records-getthisbinding
- https://developer.mozilla.org/en-us/docs/web/javascript/reference/operators/this
- https://javaScript.info/object-methods
