틀린 문제를 꼼꼼히 살펴보고 다시는 틀릴 일 없게 잘 기억해둡시다!

자바스크립트 테스트 - 데이터 불러오기
01. 다음의 출력값을 보고 빈칸을 채우시오!
{
var x = 100;
var y = 200;
var z = "javascript";
console.log(__);
console.log(__);
console.log(__);
//100
//200
//300
}
02. 다음의 출력값을 보고 빈칸을 채우시오!
{
let x = 100;
let y = 200;
let z = "javascript";
x = ___;
y = ___;
z = ___;
console.log(x);
console.log(y);
console.log(z);
//300
//400
//jquery
}
300, 400, "jquery"
03. 다음의 출력값을 보고 빈칸을 채우시오!
{
let x = 100;
let y = 200;
let z = "javascript";
x ___ 300;
y ___ 400;
z ___ "jquery";
console.log(x);
console.log(y);
console.log(z);
//400
//-200
//javascriptjquery
}
+=, -=, +=
04. 다음의 출력값을 보고 빈칸을 채우시오!
{
const arr = ________();
arr[0] = 100;
arr[1] = 200;
arr[2] = "javascript";
console.log(arr[0]);
console.log(arr[1]);
console.log(arr[2]);
//100
//200
//javascript
}
new Array
05. 다음의 출력값을 보고 빈칸을 채우시오!
{
const arr = [___________________];
console.log(arr[0]);
console.log(arr[1]);
console.log(arr[2]);
//100
//200
//javascript
}
100, 200, "javascript"
06. 다음의 출력값을 보고 빈칸을 채우시오!
{
const obj = new Object();
obj[0] = 100;
obj[1] = 200;
obj[2] = "javascript";
console.log(______);
console.log(______);
console.log(______);
//100
//200
//javascript
}
obj[0], obj[1], obj[2]
07. 다음의 출력값을 보고 빈칸을 채우시오!(console.log를 사용할 것)
{
const obj = new Object();
obj.a = 100;
obj.b = 200;
obj.c = "javascript";
_____________________
_____________________
_____________________
//100
//200
//javascript
}
console.log(obj.a);
console.log(obj.b);
console.log(obj.c);
08. 다음의 출력값을 보고 빈칸을 채우시오!
{
const obj = {____________________};
console.log(obj.a);
console.log(obj.b);
console.log(obj.c);
//100
//200
//javascript
}
a: 100, b: 200, c: "javascript"
09. 다음의 출력값을 보고 빈칸을 채우시오!
{
const obj = [
{a:100, b:200},
{c:"javascript"}
];
console.log(________);
console.log(________);
console.log(________);
//100
//200
//javascript
}
obj[0].a , obj[0].b, obj[1].c
10. 다음의 출력값을 보고 빈칸을 채우시오!
{
const obj = {
a: 100,
b: [200, 300],
c: "javascript"
}
console.log(________);
console.log(________);
console.log(________);
//200
//300
//200300
}
obj.b[0], obj.b[1], obj.b
11. 다음의 출력값을 보고 빈칸을 채우시오!
{
const a = 100;
const b = 200;
const c = "javascript";
const obj = { _________ }
document.write(obj.a);
document.write(obj.b);
document.write(obj.c);
//100
//200
//javascript
}
a, b, c
12. 다음의 출력값을 보고 빈칸을 채우시오! (오답)
{
const obj = {
a: 100,
b: [200, ____],
c: "javascript",
d: _________(){
document.write("javascript가 실행되었습니다.");
},
e: function(){
document.write( _______ + "가 실행되었습니다."); //변수값 사용
},
f: function(){
document.write( _______ + "가 실행되었습니다."); //this를 사용
}
}
document.write(obj.a);
document.write(obj.b);
document.write(obj.b[0]);
document.write(obj.b[1]);
document.write(obj.c);
obj.d();
obj.e();
obj.f();
//100
//200,300
//200
//300
//javascript
//javascript가 실행되었습니다.
//javascript가 실행되었습니다.
//javascript가 실행되었습니다.
}
300, functionm obj.c, this.c
오답노트
여기서 바보같은 실수를 .. ㅜㅜ
this.c를 this라고만 적었습니다.
this의 개념이나 쓰임을 아직 모르는 듯 싶으니 정확히 짚고 넘겨보겠습니다!
😣this
- this란 JavaScript 예약어.
- this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수(self-reference variable)이다.
- this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다.
- this는 자바스크립트 엔진에 의해 암묵적으로 생성된다.
- this는 코드 어디서든 참조할 수 있다.
- 하지만 this는 객체의 프로퍼티나 메서드를 참조하기 위한 자기 참조 변수이므로
일반적으로 객체의 메서드 내부 또는 생성자 함수 내부에서만 의미가 있다. - 함수를 호출하면 인자와 this가 암묵적으로 함수 내부에 전달된다.
- 함수 내부에서 인자를 지역 변수처럼 사용할 수 있는 것처럼, this도 지역 변수처럼 사용할 수 있다.
- 단, this가 가리키는 값, 즉 this 바인딩은 함수 호출 방식에 의해 동적으로 결정된다.
- 크게 전역에서 사용할 때와 함수안에서 사용할 때로 나눌 수 있다.
😣여기서 바인딩이란?
- 식별자와 값을 연결하는 과정을 말한다.
- 변수선언은 변수 이름과 확보된 메모리 공간의 주소를 바인딩하는 것이다.
- this 바인딩은 this(키워드로 분류되지만 식별자의 역할을 한다.)와 this가 가리킬 객체를 바인딩하는 것이다.
this만 쓰지 않고 뒤에 꼭 객체의 키 값(이름)을 적어줘야한다는 걸 꼭 익혀야겠습니다!
13. 다음의 결괏값을 완성하시오.
{
for( let i=1; i<10; i++){
if(i % 2 == 0) {
document.write(i);
}
}
}
2468
14. 다음의 결괏값을 완성하시오.
{
for( let i=1; i<10; i++){
if( true ) {
document.write(i);
}
}
}
123456789
15. 다음의 결괏값을 완성하시오.
{
const func = function(){
document.write("함수가 실행되었습니다.");
}
func();
}
함수가 실행되었습니다.
16. 다음의 결괏값을 완성하시오.
{
if( 1 ){
document.write("조건문이 실행되었습니다.(true)");
} else {
document.write("조건문이 실행되었습니다.(false)");
}
}
조건문이 실행되었습니다.(true)
17. 다음의 결괏값을 완성하시오.
{
let num = 10;
if( num == 100 ){
document.write("조건문이 실행되었습니다.(1)");
if( num == 100 ){
document.write("조건문이 실행되었습니다.(2)");
if( num == 100){
document.write("조건문이 실행되었습니다.(3)");
}
}
} else {
document.write("조건문이 실행되었습니다.(4)");
}
}
조건문이 실행되었습니다.(4)
18. 다음의 결괏값을 완성하시오.(오답)
{
let num = 10;
(num == 100) ? document.write("true") : document.write("false");
}
false
오답노트
ㅋㅋㅋ..또 멍청한 실수를 해버렸습니다...
이번 문제는 삼항연산자에 관한 문제였는데
결과값을 적어야하는 걸 실행문 전체를 쓰고 자빠졌으니....
다 풀고 항상 다시 한 번 보는 습관을 가져야겠습니다!!!
😣삼항 연산자 작성법
(조건문) ? true실행문 : false실행문
19. 다음의 결괏값을 완성하시오.
{
let num = 0;
while( num <= 5 ){
document.write( num + ". 반복문이 실행되었습니다.");
num++;
}
}
0. 반복문이 실행되었습니다.
1. 반복문이 실행되었습니다.
2. 반복문이 실행되었습니다.
3. 반복문이 실행되었습니다.
4. 반복문이 실행되었습니다.
5. 반복문이 실행되었습니다.
20. 다음의 결괏값을 완성하시오.
{
const str = [100, 200, 300, 400, 500];
str.forEach((element, index, array) =>l {
document.write(element);
document.write(index);
document.write(array);
});
}
100 0 100 200 300 400 500
200 1 100 200 300 400 500
300 2 100 200 300 400 500
400 3 100 200 300 400 500
500 5 100 200 300 400 500
문제들과 답을 다시 살펴보며 공부해봅시다~
아좌좌
!