기술면접_JavaScript_11_13
## 프론트엔드 개발자 입문(비동기처리) | Callback,Promise,Async,Await ### Contents 1...
배열이란?
배열은 일반적으로 동일한 타입의 자료를 담는 자료구조 (동적언어인 JavaScript의 경우, 다양한 타입의 자료를 담을 수 있으나 권장되지 않음)
생성·추가·삭제
/*1. declaration의 두 가지 방법*/
const array1 = new Array();
const array2 = [1,2];
/*2. index position*/
const fruits = ['apple','banana','pear'];
console.log(fruits[0]); //apple출력
console.log(fruits[fruits.length -1]); //pear출력
/*3. Looping over an array의 세 가지 방법*/
const fruits = ['apple','banana','pear'];
//for
fot (let i=0; i<fruits.length; i++){
console.log(fruits[i])
}
//for of (배열이 가진 모든 값들이 블럭을 돌 때마다 value에 할당되며 출력)
for (let fruit of fruits){
cosole.log(fruit);
}
//forEach (for문과 마찬가지로 반복적인 기능을 수행할 때 사용하며 전달한 콜백함수를 value마다 호출(parameter: value, index, array))
fruits.forEach(function (fruit, index, array) {
console.log(fruit); //출력결과 : apple, banana, pear
console.log('he'); //출력결과 : 세 개의 'he'출력
/*4. Addition*/
const fruits = ['apple','banana','pear'];
//push: add an item to the end
fruits.push('orange', 'strawberry')
//unshift: add an item to the beginning (slower than pop: add후 요소이동이 필요함으로)
fruits.unshift('orange', 'strawberry')
//splice: remove then add an item by index position (요소가 삭제된 자리에 value추가)
fruits.splice(1,2,'mango')
/*5. Deletion*/
//pop: remove an item from the end
fruits.pop('orange', 'strawberry')
//shift: remove an item from the beginning (slower than push: delete후 요소이동이 필요함으로)
fruits.shift('orange', 'strawberry')
//splice: remove an item by index position (parameter: start(몇 번째 index부터 지울건지), deleteCount(Optional이며 몇 개를 지울건지를 나타냄/지정하지 않을 경우, start이후 전체 index삭제))
fruits.splice(1,2)
/*6. Combine two arrays*/
const fruits1 = ['apple','banana','pear'];
const fruits2 = ['lemon','cherry'];
const newFruits = fruits1.concat(fruits2);
/*7. Searching*/
const fruits = ['apple','banana','pear','apple'];
console.log(fruits.indexOf('apple')); //value의 index searching
console.log(fruits.LastindexOf('apple')); //중복된value가 존재할 경우, 마지막의 index searching
console.log(fruits.includes('apple')); //array에 value포함여부 확인
/*1. Make a string out of an array*/
const fruits = ['apples', 'banana', 'orange'];
const result = fruits.join(); //optional: 괄호 안separator입력
/*2. Make an array out of a string*/
const fruits = ['apples', 'banana', 'orange'];
const result = fruits.split(,); //parameter: separator / optinal : 괄호 안 limit입력
/*3. Make this array look like this: [5,4,3,2,1]*/
const array = [1,2,3,4,5]
const result = array.reverse();
/*4. Make new array without the first two elements*/
const array = [1,2,3,4,5]
const result1 = array.splice(0,2); //기존 배열에서 0-2 index삭제
const result2 = array.slice(0.2) //기존 배열의 복사본에서 0-2 index삭제
/*-----------------------------------------------------------------------------------*/
class Student {
constructor(name, age, enrolled, score) {
this.name = name;
this.age = age;
this.enrolled = enrolled;
this.score = score;
}
}
const students = [
new Student('A', 29, true, 45),
new Student('B', 29, false, 80),
new Student('C', 29, true, 90),
new Student('D', 29, false, 66),
new Student('E', 29, true, 88)
];
/*5. Find a student with the score 90*/
const result = students.find(function(student, index){
console.log(student, index) //students에는 다섯개의 index가 포함되어 있으므로 다섯개 정보 출력
return student.score === 90; //score가 90인 첫 번째 value출력
});
//위 코드를 Arrow function으로 작성
const result = student.find(student) => student.score ===90;
/*6. Make an array of enrolled students*/
const result = students.filter(function(student){
return student.enrolled === true;
});
//위 코드를 Arrow function으로 작성
const result = students.filter((student) => student.enrolled)
/*7. Make an array containing only the student's scores (reuslt should be [45, 80, 90, 66, 88])*/
const result = students.map((student) => student.score);
//mapping: 배열 안 개별요소를 다른것으로 변환 (위 코드에서는 name,age,enrolled,score를 포함하고 있는 sutdent를 받아 student.score로 변환해준 것)
/*8. heck if there is a student with the score lower than 50*/
const result = student.some((student) => student.score < 50); //한 명이라도 50점 이하가 있다면 true
const result = student.every((student) => student.score < 50); //전체가 50점 이하라면 true
/*9. compute student's average score*/
const result = students.reduce((previous, current) => {
return previous + current.score;
},0) //0: initial value / reduce: 콜백함수는 배열안 모든 요소마다 호출되며 누적값을 출력
console.log(result/students.length);
document.querySelector('.button').addEventListener('click', function()) {
console.log('버튼 클릭 시 실행되는 코드')
} //function: 콜백함수 (addEventListener라는 함수의 파라미터에 들어가 있는 함수이므로)
setTimeout(function(){
console.log('1초 후 실행되는 코드')
}, 1000) //setTimeout: n초 뒤 코드를 실행시키는 기본함수로 콜백함수로 실행됨(즉, setTimeout에 콜백함수를 사용하여 나중에 호출(called back))
Avenco comes with a built-in contact form.