7. JavaScript 관련 퀴즈
1) The quick brown fox 문장을 camelCase(낙타 표기법)로 작성하시오.
2) let fruits = ['Apple', 'Banana', 'Cherry']; 데이터를 활용하여 'Banana'를 콘솔 출력하시오.
3) 불린 데이터(Boolean)에서 거짓을 의미하는 데이터는?
4) '값이 의도적으로 비어있음'을 의미하는 데이터는?
5) {}가 사용되는 데이터의 종류는?
6) let obj = {abc: 123}; console.log(obj.xyz); 해당 코드를 통해 콘솔 출력될 값(데이터)은?
7) 값(데이터)을 재할당할 수 없는 변수 선언 키워드는?
8) 함수에서 값(데이터)을 반환하기 위해 사용하는 키워드는?
9) sum(2, 4); 위 함수 호출에서 2, 4를 무엇이라 하는가?
10) function sum(a,b) { return a + b; } 해당 함수 선언의 a, b와 같이, 함수 호출에서 전달받은 인수를 함수 내부로 전달하기 위한 변수를 무엇이라 하는가?
11) 이름이 없는 함수를 무엇이라 하는가?
12) hello 이름의 함수 표현을 작성하고 호출하시오.
const hello = function () {};
hello();
13) const user = { getName: function () {}; } 해당 코드의 getName과 같이 함수가 할당된 객체 데이터의 속성(property)을 무엇이라 하는가?
14)조건이 참(true)인 조건문을 작성하시오.
15) 가져온 자바스크립트 파일을 HTML 문서 분석 이후에 실행되도록 지시하는 HTML 속성(Attribute)은?
16) div class가 box이고 내용이 BOX라고 들어있는 HTML 요소의 내용(Content)을 콘솔 출력하시오.
const boxEl = document.querySelector('.box');
console.log(boxEl.textContent);
17) 값(데이터)을 재할당할 목적의 변수 선언 키워드는?
18) const boxEl = document.querySelector('.box'); 해당 코드의 boxEl 요소에 클릭(Click) 이벤트를 추가하여 클릭 시 'Hello~'를 콘솔 출력하시오.
boxEl.addEventListener('click', fucntion () {
console.log('Hello~');
});
19) 두 개의 div 요소에 각각 내용이 1, 2가 들어있을 때, 2개의 div 요소에 자바스크립트로 class="hello"를 추가하시오.
const divEls = document.querySelectorAll('div');
divEls.forEach(function (divEl) {
divEl.classList.add('hello');
});
20) 'OROSY'.split('').reverse('').join(''); 해당 코드와 같이 메소드에 이어 작성하는 방법을 무엇이라 하는가?
21) cosnt boxEl = document.querySelector('.box'); 해당 코드의 boxEl 요소에 HTML 클래스 속성의 값으로 'active'가 포함되어 있으면, '포함됨!'을 콘솔 출력하시오.
if (boxEl.classList.contains('active')) {
console.log('포함됨!');
}