“ 지연되는 프로젝트에 인력을 더 투입하면 오히려 더 늦어진다. ”
- Frederick Philips Brooks
Mythical Man-Month 저자
자바스크립트 시험 입니다.
같이 풀어볼까요?
✈01. 결괏값을 작성하시오.
{
(function(){
console.log("함수가 실행되었습니다.");
})();
}🏴. 정답
정답 : 함수가 실행되었습니다
🏁. 즉시실행함수
즉시실행 함수(IIFE, Immediately Invoked Function Expression)는 함수를 정의한 후 바로 실행하는 JavaScript 함수입니다. 함수를 익명 함수로 선언하고, 소괄호로 감싸서 함수를 실행합니다. 이를 통해 함수를 정의한 후 바로 실행할 수 있습니다.
IIFE를 사용하는 가장 일반적인 이유는 전역 스코프 오염을 방지하기 위해서입니다. IIFE를 사용하면 함수 내에서 선언된 변수는 해당 함수의 스코프 내에서만 유효하기 때문에, 전역 스코프에서 변수명 충돌이 발생하는 것을 방지할 수 있습니다.
또한 IIFE를 사용하면, 함수 내에서 선언된 변수들이 다른 함수에서 접근할 수 없으므로, 코드의 모듈화나 라이브러리와 같은 모듈에서 사용될 수 있도록 하는 등의 용도로도 활용될 수 있습니다.
✈02. 결괏값을 작성하시오.
{
function func(str = "함수가 실행되었습니다."){
document.write(str);
}
func();
}🏴 정답
정답 : 함수가 실행되었습니다
🏁. 파라미터함수
파라미터 함수(Parameter function)는 함수를 정의할 때, 함수의 매개변수(parameter)를 정의하는 것을 말합니다. 파라미터 함수는 함수를 호출할 때, 인자(argument)를 전달할 수 있으며, 이 인자는 함수 내부에서 매개변수(parameter)로 사용됩니다.
function functionName(parameter1, parameter2, ...) {
// 함수 내용
}-위의 예제에서 functionName은 함수 이름을 나타내며, parameter1, parameter2, ... 등은 함수의 매개변수를 나타냅니다.
✈03. 결괏값을 작성하시오.
{
let sum = 0;
for(var i=1; i<=10; i+=2) {
sum += i;
};
document.write(sum);
}🏴 정답
정답 : 25
🏁. for문
1+3+5+7+9 = 25
✈04. 다음의 결괏값을 보고 빈칸을 작성하시오.
{
const obj = {
a: 100,
b: 200,
c: "javascript"
}
const { a, b, c } = _______;
document.write(a);
document.write(b);
document.write(c);
//100
//200
//javascript
}🏴 정답
정답 : obj
🏁. 객체구조분해할당
-obj에 저장된 객체에서 상수(변수)로 다시 할당하는 방식입니다.
객체 obj를 정의하고, 구조분해할당을 사용하여 객체 내부의 a, b, c라는 속성에 각 변수 a, b, c를 할당하고 출력문에 변수를 사용하여 값을 불러옵니다.
#GPT
객체 구조 분해 할당(Object Destructuring Assignment)은 객체의 속성을 개별 변수로 분해하는 기능을 제공하는 ES6의 기능입니다. 이를 통해 객체의 속성을 추출하여 변수로 할당할 수 있습니다.
객체 구조 분해 할당은 객체의 일부 속성만을 선택적으로 추출하여 변수에 할당할 수 있습니다.
객체 구조 분해 할당은 코드의 가독성을 높여주고, 변수를 선언하고 초기화하는 작업을 간소화해주는 장점이 있습니다.
✈05. 다음의 결괏값을 보고 빈칸을 작성하시오.
{
const objA = {
a: 100,
b: 200
}
const objB = {
c: "javascript",
d: "jquery"
}
const spread = {______, ______}
document.write(spread.a);
document.write(spread.b);
document.write(spread.c);
document.write(spread.d);
//100
//200
//javascript
//jquery
}🏴 정답
정답 : ...objA, ...objB
🏁. 객체펼침연산자
객체 펼침 연산자(Object Spread Operator)는 JavaScript에서 새로운 객체를 만들거나, 객체를 병합할 때 사용할 수 있는 문법입니다. 이 연산자는 ... 기호를 사용하여 표현합니다.
객체에서도 펼침 연산자가 사용되며 새로운 상수에 저장가능하며 저장과 동시에 추가가 가능합니다. obj에 저장된 값을 새로운 상수인 spread에 저장하는데 저장과 동시에 추가가 가능하며 새롭게 선언된 상수를 통해 출력까지 가능합니다.
✈06. 다음의 결괏값이 나오도록 보기에서 빈칸에 해당되는 것을 모두 고르시오
{
if( _____ ){
document.write("조건문이 실행되었습니다.(true)");
} else {
document.write("조건문이 실행되었습니다.(false)");
}
//document.write("조건문이 실행되었습니다.(false)");
//보기
//true, false, 1, "1", "", 0, null, undefined, [], {}
}🏴 정답
정답 : false, 0, null, undefined, ""
🏁. if문
if문은 가장 간단한 조건문입니다
주어진 조건이 참이면 true, 아니면 false를 출력합니다
true조건 : 1, 2, "0"(문자), "1"(문자), "ABC"(문자), 0<10(비교연산자), [](배열), {}(객체), true
false조건 : 0, null, undefined, false, ""(문자열 안이 빈칸인 경우:빈문자열)며, 이 인자는 함수 내부에서 매개변수(parameter)로 사용됩니다.
✈07. 다음의 if문은 삼항 연산자로 변경하시오.
{
if( num == 100 ){
document.write("true");
} else {
document.write("false");
}
}🏴 정답
정답 : ( num == 100 ) : "true" ? "false" ;
🏁. 삼항연산자
삼항 연산자는 코드를 간결하게 만들 수 있으나, 사용이 과도하면 가독성이 떨어지기 때문에 적절한 상황에서 사용하는 것이 좋습니다.
JavaScript에서 삼항 연산자는 condition ? expr1 : expr2의 형식을 갖습니다. condition은 불리언 값으로 평가되는 표현식입니다. condition이 true인 경우 expr1이 반환되고, false인 경우 expr2가 반환됩니다.
let age = 20;
let message = (age >= 18) ? "성인입니다." : "미성년자입니다.";
console.log(message);위의 코드에서 age가 18 이상인 경우 message는 "성인입니다."가 되고, 그렇지 않은 경우 message는 "미성년자입니다."가 됩니다.
✈08. 결괏값을 작성하시오.
{
for(var i=1; i<=1; i++){
document.write(i);
for(var j=1; j<=5; j++){
document.write(j);
}
}
}🏴 정답
정답 : 1, 1, 2, 3, 4, 5
🏁. 중첩 for문
for문 안에 새로운 for문이 있는 형태이며 맨 위의 for문을 먼저 실행 시킨 다음 참일 경우 아래의 중첩 for문으로 넘어와서 조건이 참일 때 까지 실행 시키고 난 후 다시 처음 for문으로 돌아가서 실행하는 방식으로 반복하는 구조 입니다.
✈09. 다음의 결괏값을 보고 빈칸을 작성하시오
{
const num = [100, 200, 300, 400, 500];
for(let i=0; i<num.length; i++){
document.write(_______);
}
//100 200 300 400 500
}🏴 정답
✈10. 다음의 결괏값을 보고 빈칸을 작성하시오
{
const num = [100, 200, 300, 400, 500];
num.forEach(function(el){
document.write(________);
});
//100 200 300 400 500
}🏴 정답
정답 : el
🏁. forEach문
forEach() 메서드는 JavaScript 배열의 각 요소에 대해 제공된 함수를 한 번씩 실행하는 기능을 제공합니다. 이 메서드는 배열 요소를 수정하지 않으며, 배열을 순환하며 각 요소에 대해 콜백 함수를 호출합니다.
arr.forEach(function callback(currentValue, index, array) {
// 실행될 코드
});여기서 arr은 forEach() 메서드를 호출하는 배열을 나타내며, callback은 각 배열 요소에 대해 호출될 함수를 나타냅니다. callback 함수는 다음과 같은 매개변수를 받습니다.
- currentValue: 현재 배열 요소의 값
- index (선택적): 현재 배열 요소의 인덱스
- array (선택적): forEach() 메서드가 호출된 배열
let arr = [1, 2, 3, 4, 5];
arr.forEach(function(value) {
console.log(value);
});
//출력
1, 2, 3, 4, 5forEach() 메서드를 사용하면 반복문을 통해 배열의 요소를 처리하는 코드를 간결하게 작성할 수 있습니다. 또한, forEach() 메서드는 일반적으로 for 루프보다 더 간결하고 가독성이 좋은 코드를 작성할 수 있습니다.
✈11. 다음을 보고 리턴값을 생략하여 한줄로 표현하시오!
{
const func = str => {
return str;
}
}🏴 정답
정답 : const func = str => str;
🏁. 익명함수 + 매개변수함수 + 리턴값 + 괄호생략 + 리턴생략
✈12. 다음의 결괏값을 보고 빈 칸을 채우시오.
{
const num = [100, 200, 300, 400, 500];
for(let index of _____ ){
document.write(index);
}
//결과값
//100 200 300 400 500
}🏴 정답
정답 : num
🏁. for-of문
for-of문은 JavaScript에서 사용되는 반복문 중 하나입니다.
이 반복문은 배열과 같은 iterable 객체에서 각 요소를 반복하며 실행됩니다.
for (let element of iterable) {
// 반복 실행할 코드
}
//예문
const arr = ['apple', 'banana', 'orange'];
for (let element of arr) {
console.log(element);
}
// 출력: apple, banana, orangefor-of문은 ES6에서 도입되었으며, for-in문과 다르게 객체의 속성을 순회하는데 사용되지 않습니다.
for-in문은 객체의 속성을 반복하며, for-of문은 iterable 객체의 요소를 반복합니다.
✈13. 다음의 결괏값을 보고 빈 칸을 채우시오.
{
function func(){
let i = 5, j = 4, k = 1, l, m;
l = i > 5 || j != 0;
m = j <= 4 && k < 1;
document.write(l);
document.write(m);
}
func();
}🏴 정답
정답 : true , false
🏁.
l = i > 5 || j != 0; 🔈 | 는 or 이므로 j=4로 true니까 true,
m = j <= 4 && k < 1; 🔈 &&는 둘다 같아야하는 조건인데, k=1으로 틀리므로 false
✈14. 결괏값을 작성하시오.
{
const arr = [100, 200, 300, 400, 500];
const text = arr.push(600);
document.write(arr);
const arr2 = [100, 200, 300, 400, 500];
const text2 = arr2.unshift(600);
document.write(arr2);
}🏴 정답
정답 : 100, 200, 300, 400, 500, 600 / 600, 100, 200, 300, 400, 500
🏁. 배열 메서드 push(), unshift()
JavaScript의 push() 메소드는 배열의 끝에 하나 이상의 요소를 추가하는 함수입니다.
JavaScript의 unshift() 메소드는 배열의 맨 앞에 하나 이상의 요소를 추가하는 함수입니다.
✈15. 결괏값을 작성하시오.
{
const obj = {
a: 100,
b: 200
};
for(let key in obj) {
console.log(key);
}
}🏴 정답
정답 : a, b
🏁. for-in문
for-in문은 JavaScript에서 사용되는 반복문 중 하나입니다. 이 반복문은 객체의 속성을 반복하며 실행됩니다.
for (let key in object) {
// 반복 실행할 코드
}여기서 key는 객체의 속성 이름을 차례로 나타내며, object는 반복될 객체를 나타냅니다. 이 객체는 JavaScript에서 모든 객체가 될 수 있습니다.
const obj = { name: 'John', age: 30, occupation: 'developer' };
for (let key in obj) {
console.log(key + ': ' + obj[key]);
}
// 출력: name: John, age: 30, occupation: developerfor-in문은 객체의 속성을 반복하기 때문에, 배열이나 문자열과 같은 iterable 객체에서는 사용하지 않습니다. for-in문을 사용할 때는 객체의 프로퍼티를 순회하며, 자신이 예상하지 못한 프로퍼티까지도 순회할 가능성이 있으므로 주의가 필요합니다. 또한 for-in문은 객체의 속성을 반복할 때 순서가 보장되지 않습니다. 따라서 순서가 중요한 경우에는 다른 반복문을 사용해야 합니다.
✈16. 결괏값을 작성하시오.
{
let num = 0;
while(false){
num++;
if( num == 3 ){
continue;
}
if( num > 6 ){
break;
}
}
console.log(num);
}🏴 정답
정답 : 0
처음부터 false이므로 0
🏁. while()문
while문은 조건이 참인 동안 반복하는 제어문입니다.
while문은 반복을 계속할지 여부를 결정하는 조건식이 중요하기 때문에 조건식이 항상 false가 되지 않도록 주의해야 합니다. 그렇지 않으면 무한 루프에 빠질 수 있습니다.
✈17. 결괏값을 작성하시오.
{
let a, b, result;
a = 7, b = 4
result = a & b;
console.log(result, a, b)
}🏴 정답
정답 : 4, 7, 4
🏁. 비트연산자
비트 연산자는 이진수로 표현된 숫자를 대상으로 하는 연산을 수행하는 JavaScript 연산자입니다. 이진수는 0과 1의 비트로 구성된 숫자 체계를 사용하여 숫자를 표현합니다. 이진수 연산은 CPU와 같은 하드웨어 수준에서 사용되며, 비트 연산자는 이러한 하드웨어 연산을 에뮬레이션하는 데 사용됩니다.
JavaScript에서는 다음과 같은 다섯 가지 비트 연산자를 지원합니다.
- & (Bitwise AND): 두 숫자의 비트가 모두 1인 경우에만 1을 반환합니다.
- | (Bitwise OR): 두 숫자의 비트 중 하나라도 1인 경우 1을 반환합니다.
- ^ (Bitwise XOR): 두 숫자의 비트가 다른 경우 1을 반환합니다.
- ~ (Bitwise NOT): 피연산자의 모든 비트를 반전시킵니다. (0을 1로, 1을 0으로 바꿉니다.)
- << (Bitwise Left Shift): 첫 번째 피연산자의 비트를 두 번째 피연산자로 지정한 수만큼 왼쪽으로 이동시킵니다. (오른쪽 끝에는 0이 추가됩니다.)
- >> (Bitwise Right Shift): 첫 번째 피연산자의 비트를 두 번째 피연산자로 지정한 수만큼 오른쪽으로 이동시킵니다. (왼쪽 끝에는 부호 비트가 추가됩니다.)
const a = 5; // 이진수 0101
const b = 3; // 이진수 0011
console.log(a & b); // 1 (0101 & 0011 = 0001)
console.log(a | b); // 7 (0101 | 0011 = 0111)
console.log(a ^ b); // 6 (0101 ^ 0011 = 0110)
console.log(~a); // -6 (~0101 = 1010, -6은 2의 보수로 표현됩니다.)
console.log(a << 1); // 10 (0101을 왼쪽으로 1비트 이동하면 1010이 됩니다.)
console.log(a >> 1); // 2 (0101을 오른쪽으로 1비트 이동하면 0010이 됩니다.)비트 연산자는 보안, 네트워크 프로그래밍, 암호화 등과 같은 분야에서 사용됩니다.
✈18. 결괏값을 작성하시오.
{
let a = 1, b = 2, c = 3, result;
result = ++a + b++ + ++c;
console.log(result);
console.log(a);
console.log(b+c);
console.log(c);
}🏴 정답
정답 : 8, 2, 7, 4
🏁. ++연산자(전치, 후치)
전치 후치 연산자는 JavaScript에서 변수 값을 증가 또는 감소시키는 연산자입니다.
전치 연산자는 변수를 먼저 증가시키고, 그 다음에 변수 값을 사용합니다. 후치 연산자는 변수 값을 먼저 사용하고, 그 다음에 변수를 증가시킵니다.
전치 연산자는 ++ 기호를 사용하며, 후치 연산자는 -- 기호를 사용합니다.
전치 후치 연산자는 코드를 작성할 때 주의해야 합니다. 다른 코드와 함께 사용하면 코드의 가독성이 떨어지고, 버그가 발생할 가능성이 높아집니다. 가능하면 전치 후치 연산자를 단독으로 사용하는 것이 좋습니다.
✈19. 결괏값을 작성하시오.
{
let data = [70, 80, 75, 60, 90];
let best = 0;
let score = 0;
for(let i=0; i<data.length; i++){
if(data[i]>80) {
best++;
}
if(score < data[i]) {
score = data[i];
}
}
console.log(best, score)
}🏴 정답
정답 : 1, 90
🏁. 가장 높은 점수 한명을 추출하는 문제
- best : 1,
- score = 70 // data[0]
-> score = 70 < 80 // data[1] : true : score = 80
-> score = 80 < 75 // data[2] : false : score = 80
-> score = 80 < 60 // data[3] : false : score = 80
-> score = 80 < 90 // data[4] : true : score = 90
= score : 90
✈20. 결괏값을 작성하시오.
{
function func(num1, num2){
if(num1 > num2) return num1
else return num2
}
console.log(func(10, 23) + func(40, 50))
}
🏴 정답
정답 : 73
🏁. 단순 계산문제
- 23 + 50