🖥️FE🖥️

FE Conf Quiz

들눈 2023. 10. 26. 08:32
당근 FE
HTML

<dialog>, <fieldset>, <popover>, tabindex, contenteditable, <picture>, inputmode

JS

globalThis, Private Fields, Promise.allSettled(), Numeric Seperators, Arraty.prototype.at(), WeakMap/WeakSet, Error.prototype.cause, import.meta, for-await-of/ asynclterator, using/Symbol.dispose.

CSS

CSS Variables, grid-template, env(safe-area-inset-*), gap, aspect-ratio, backdrop-filter, object-fit, :focus-within, :placeholder-shown, @container, clamp(), @media(prefers-reduced-query-motion:reduce)

Browser API

ServiceWorkers, Intl, Web-animations, loading=lazy, Import Maps, Crypto.randomUUID(), WebAssembly, navigator.connection, IntersectionObserver, AbortController

React Meta Framework

Create React App, Next.js, Astro, GatsbyJS, Remix, Vike, fresh

FrameWork not React

Preact, Vue, Angular, Svelte, Lit, Solid.js, Qwik, Marko.js, Htmx,

Bundle

Webpack, Rollup, Vite, Parcel, Rspack

MonorepoTooling

Yarn Workspaces, Turborepo, Nx, Lerna, Rush, Moon,

Testing Framework

Jest, Vitest, Mocha, Node-Tap, Pupeeteer, Playwright, Cypress

Elice Coding FE
throw

Q. throw 키워드의 역할은 무엇인가요?
A. 아래 보기에서 골라주세요.

  1. 예외를 발생시키고 반드시 "try-catch" 블록에서 처리되어야 한다.
  2. 루프나 반복문 내부에서만 사용 가능하며, 함수 내에서는 사용할 수 없다.
  3. 숫자형 값을 예외로 던져야 하며, 문자열이나객체 등은 사용할 수 없다.
  4. 예외를 발생시키고 프로그램의 실행을 중단시킨다.
코드 출력-2

Q. 다음 코드의 출력 결과는 무엇인가요?
let x=10;
let y = "5";
let z=x+y--y;
console.log(z);
A. 아래 보기에서 골라주세요.

  1. 20
  2. 100
  3. 110
  4. 105
이벤트 루프

Q. 이벤트 루프(Event Loop)에 대한 설명으로 옳은 것은 무엇인가요?
A. 아래 보기에서 골라주세요

  1. 자바스크립트 코드를 실행하는 데 사용되는 엔진입니다.
  2. 비동기 코드의 실행을 관리하고, 콜백 함수를 호출하는 메커니즘입니다.
  3. 코드실행 중예외가 발생하면 호출되는 함수입니다.
  4. 반복적으로 코드를 실행하는 데 사용되는 루프입니다.
내부스타일시트

Q. 내부 스타일시트를 정의하는 데 사용되는 HTML 태그는 무엇인가요?
A. 아래 보기에서 골라주세요

  1. <style>
  2. <CSS>
  3. <script>
image 삽입

Q.다음 중 이미지를 삽입할 때 필요한 올바른 태그는 무엇일까요?
A. 아래 보기에서 골라주세요

  1. <img src="image.gif" alt="MyImage">
  2. <img href="image.gif" alt="Mylmage">
  3. <img alt="Mylmage">image.gif</img>
  4. <image src="image.gif" alt="Mylmage">
css comment

Q. CSS 파일에서 주석처리를 하려면 어떻게 해야할까요?
A. 아래 보기에서 골라주세요.

  1. 'this is a comment
  2. // this is a comment //
  3. /* this is a comment */
  4. // this is a comment
SVG

Q. SVG로정의된 그래픽은 어떤 형식인가요?
A. 아래 보기에서 골라주세요.

  1. XML
  2. CSS
  3. HTML
미디어쿼리

Q. mediaquery 작성 법에 대한 설명 중 잘못된 것은?
A. 아래 보기에서 골라주세요

  1. mobile우선으로 제작시 min-width를 사용한다.
  2. dekstop우선으로 제작시 max-width를 사용한다.
  3. 화면 크기와 디바이스 특성에 따라 스타일을 조절하는 데 사용한다.
  4. 여러 개의 조건이 mediaquery로 들어갈수없다.
코드 출력-3

Q. 다음 코드의 출력 결과는 무엇인가요?
console.log(1 < 2 < 3);
console.log(3 > 2 > 1);
A. 아래 보기에서 골라주세요.

  1. true, true
  2. true, false
  3. false, true
  4. false, false
import& export

Q. import와 export 구문은 무엇을 위해 사용되나요?
A. 아래 보기에서 골라주세요.

  1. HTML파일과 CSS 파일을 연결하기 위해 사용됩니다.
  2. 모듈 간의 데이터 공유를 위해 사용됩니다.
  3. 배열을 정렬하기 위해 사용됩니다.
  4. 데이터베이스에 연결하기 위해 사용됩니다.
함수인자

Q. 함수를 호출할 때 인자를 전달하지 않으면, 해당 매개변수는 어떤값을 가지게 될까요?
A. 아래 보기에서 골라주세요.

  1. 0
  2. null
  3. undefined
  4. 빈 문자열
자바스크립트개요

Q. 자바스크립트는 어떤 종류의 프로그래밍언어인가요
A. 아래 보기에서 골라주세요.

  1. 컴파일러 언어
  2. 인터프리터 언어
  3. 머신코드언어
  4. 어셈블리언어
css syntax

Q. 올바른 CSS 구문은 무엇인가요?
A. 아래 보기에서 골라주세요.

  1. body fcolor: black;]
  2. body:color=black;
  3. (body:color=black;)
  4. (body;color:black;]
tooltip

Q. 다음 글에 툴팁을 띄우기 위해서 "???"에 어떤 속성이 필요할까요?
< "???"="엘리스그룹 소개">
교육, 평가, 데이터 이 모든 걸 한
</p>

콜백 함수

Q. 콜백 함수에대한 설명으로올바르지 않은 것은?
A. 아래 보기에서 골라주세요.

  1. 콜백 함수는 다른 함수의 매개변수로 전달되어 실행될 수 있다.
  2. 콜백 함수는 비동기적인 작업을 다루는데 사용될 수있다.
  3. 콜백 함수는항상 동기적으로 실행된다.
  4. 콜백함수는다른 함수 내에서 호출될수있다.
외부 스타일 코드

Q.외부 스타일을 사용하기 위해 사용하는 태그명과 와 속성을 올바르게 나타낸 것은?
<태그명>
<link rel="stylesheet" 속성="경토
</태그명>
A. 아래 보기에서 골라주세요.

  1. head,src
  2. body, content
  3. head,href
  4. body,src
내장객체

Q. 실수 7.25를 반올림하여 정수로 변환하는방법 중 옳은 것을 고르시오.
A. 아래 보기에서 골라주세요.

  1. Math.ceil(7.25)
  2. Math.floor(7.25)
  3. Math.abs(7.25)
  4. Math.round(7.25)
URL

Q. 웹 페이지를 찾기 위한 주소인 URL의풀네임으로옳은 것은 무엇일까요?
A. 아래 보기에서 골라주세요.

  1. Uniform Resource Locator
  2. Uniform Resource Location
  3. Unique Resource Locator
클로저

Q. 클로저(Closure)란 무엇인가요?
A. 아래 보기에서 골라주세요.

  1. 함수가 호출될 때 생성되는 새로운 스코프
  2. 함수가 다른 함수 내부에서 정의된 경우 발생하는 오류
  3. 함수가 외부변수에 접근할 수 있는현상
  4. 함수가 실행되는 동안 발생하는 예외
this

Q. 화살표 함수를 사용할 때, this 키워드는 어떻게 동작하나요?
A. 아래 보기에서 골라주세요

  1. this 키워드는 화살표 함수 내에서 바인딩되지 않습니다.
    this 키워드는 화살표 함수에서만 사용할 수 있습니다.
    this 키워드는 항상 전역 객체를 가리킵니다.
    this 키워드는 화살표 함수 내에서 사용할 수 없습니다.
css 속성-4

Q. 텍스트의 각 단어가 대문자로 시작하게 하려면 어떻게 해야 할까요?
A. 아래 보기에서 골라주세요

  1. text-style:capitalize
  2. transform:capitalize
  3. text-transform:capitalize
비교 연산자

Q. "==="연산자는 어떤 종류의 비교를 수행하나요?
A. 아래 보기에서 골라주세요.

  1. 값과 타입 비교
  2. 값비교
  3. 타입비교
  4. 논리적 비교
input

Q. 입력양식 tag 사용자에게 편의성을 제공하기 위해 label tag를 사용합니다.아래의 (1),(2) 의 알맞은 답을 맞추세요. 이때 label tag의 (1) 속성과 input tag의 ( 2) 속성을 동일한 이름으로 해주어야 합니다.
A. 아래 보기에서 골라주세요

  1. id, for
  2. for, id
  3. for, class
  4. class, for
tag

Q. 특정 범위 내에서의 스칼라 값, 또는 백분율 값을 나타내는 HTML 요소는 무엇인가요?
A. 아래 보기에서 골라주세요.

  1. <gauge>
  2. <range>
  3. <measure>
  4. <meter>
호이스팅

Q. 자바스크립트의 'Hoisting'에 대한 설명으로 옳은 것은 무엇인가요?
A. 아래 보기에서 골라주세요

  1. 변수와 함수 선언을 스코프의 맨 위로 끌어올리는 현상입니다.
  2. 변수의 값을 미리 정의하지 않으면 에러가 발생합니다
  3. 함수가 호출되기 전에는 코드가 실행되지 않습니다.
  4. 모든 변수와 함수가 전역 스코프에서만 사용 가능합니다.