JS | Array

Array

1. Declaration

const arr1 = new Array();
const arr2 = [1, 2];

2. Index position

const fruits = ['🍎', '🍌'];
console.log(fruits);
console.log(fruits.length);
console.log(fruits[0]);
console.log(fruits[fruits.length - 1]);            // array의 index는 0부터 시작

3. Looping over an array

mission. print all fruits
a. for
for (let i = 0; i < fruits.length; i++) {
    console.log(fruits[i]);
}

b. for of
for (let fruit of fruits) {
    console.log(fruit);
}

c. forEach        => callback 함수를 받아온다.
fruits.forEach((fruit) => console.log(fruit);

4. Addition, Deletion, copy

// push: add an item to the end
fruits.push('🍅','🍋');
console.log(fruits);            // ['🍎', '🍌', '🍅', '🍋'

// pop: remove an item from the end
fruits.pop();
console.log(fruits);            //  ['🍎', '🍌', '🍅']

fruits.pop();
fruits.pop();
console.log(fruits);            //  ['🍎']

//unshift: add an item to the beginning
fruits.unshift('🍍', '🍈');
console.log(fruits);            // ['🍍', '🍈', '🍎']

//shift: remove an item from the beginning
fruits.shift();
console.log(fruits);            // ['🍈', '🍎']

note!! shift, unshift are slower than pop, push
이미 data가 존재하는 앞쪽 부분을 수정하기 위해 array 전체가 수정되어야 하기 때문에 속도가 느려진다.

Array Quiz

// Q1. make a string out of an array
{
  const fruits = ['apple', 'banana', 'orange'];
}

// Q2. make an array out of a string
{
  const fruits = '🍎, 🥝, 🍌, 🍒';
}

// Q3. make this array look like this: [5, 4, 3, 2, 1]
{
  const array = [1, 2, 3, 4, 5];
}

// Q4. make new array without the first two elements
{
  const array = [1, 2, 3, 4, 5];
}

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', 28, false, 80),
  new Student('C', 30, true, 90),
  new Student('D', 40, false, 66),
  new Student('E', 18, true, 88),
];

// Q5. find a student with the score 90
{
}

// Q6. make an array of enrolled students
{
}

// Q7. make an array containing only the students' scores
// result should be: [45, 80, 90, 66, 88]
{
}

// Q8. check if there is a student with the score lower than 50
{
}

// Q9. compute students' average score
{
}

// Q10. make a string containing all the scores
// result should be: '45, 80, 90, 66, 88'
{
}

// Bonus! do Q10 sorted in ascending order
// result should be: '45, 66, 80, 88, 90'
{
}

Array Quiz my answer

Q1. 
{
  const fruits = ['apple', 'banana', 'orange'];
  const string = fruits.toString();
}
*********************************************************
Q2.
{
  const fruits = '🍎, 🥝, 🍌, 🍒';
  const arr = [];

  for (i=0; i < fruits.length; i +=4 ) {
    let item = fruits.slice(i, i+2);
    arr.push(item);
  }
  console.log(arr);
}
*********************************************************
Q3.
{
  const array = [1, 2, 3, 4, 5];
  const reverseArray = [];

  for(let i = array.length; i > 0; i--){
      let item = array.slice(i-1, i);
    reverseArray.push(item.toString());
  }

  console.log(reverseArray);
}

*********************************************************
Q4.
{
const array = [1, 2, 3, 4, 5];

const arr = [];

for ( i=0; i < 3; i++) {
    let lastItem = array.pop();
  arr.push(lastItem);
}
arr.reverse();

*********************************************************
Q5.
const result = students.find( ({score}) => score === 90);

*********************************************************
Q6.

*********************************************************
Q7.
function getField(input, field) {
    let output = [];
  for ( let i = 0; i < input.length; i++) {
      output.push(input[i][field]);
  }
  return output;
}

const answer = getField(students, "score");
*********************************************************

Q8.
const result = students.filter( stu => stu.score < 50);
*********************************************************

Q9.
let sum = 0;
for ( let i=0; i < students.length; i++) {
  sum += students[i]['score'];
}
let avg = sum / students.length;
console.log(avg);
*********************************************************

Q10.
let arr = [];
let result = 0;
for ( let i=0; i < students.length; i++) {
  arr.push(students[i]['score']);
  result = arr.toString();
}
console.log(result);
*********************************************************

Q.Bounes
let arr = [];
let result = 0;
for ( let i=0; i < students.length; i++) {
  arr.push(students[i]['score']);
  arr.sort();
  result = arr.toString();
}
console.log(result);

Array Quiz regular answer

// Q1. make a string out of an array
{
  const fruits = ['apple', 'banana', 'orange'];
  const result = fruits.join(`,`);
}

// Q2. make an array out of a string
{
  const fruits = '🍎, 🥝, 🍌, 🍒';
  const result = fruits.split(',');
}

// Q3. make this array look like this: [5, 4, 3, 2, 1]
{
  const array = [1, 2, 3, 4, 5];
  const result = array.reverse();
}

// Q4. make new array without the first two elements
{
  const array = [1, 2, 3, 4, 5];
  const result = array.slice(2,5);
}

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', 28, false, 80),
  new Student('C', 30, true, 90),
  new Student('D', 40, false, 66),
  new Student('E', 18, true, 88),
];

// Q5. find a student with the score 90
{
    consst result = students.find((student) => student.score === 90;); 
}

// Q6. make an array of enrolled students
{
    const result = students.filter((student) => students.enrolled);
}

// Q7. make an array containing only the students' scores
// result should be: [45, 80, 90, 66, 88]
{
    const result = students.map((student) => student.score);
}

// Q8. check if there is a student with the score lower than 50
{
    const result = students.some((student) => student.score < 50);

        const result = students.every((student) => student.score < 50);
}

// Q9. compute students' average score
{
    const result = students.reduce((prev, curr) => prev + curr.score, 0);
        console.log(result / students.length);
}

// Q10. make a string containing all the scores
// result should be: '45, 80, 90, 66, 88'
{
    const result = students.map((student) => student.score).join());
}

// Bonus! do Q10 sorted in ascending order
// result should be: '45, 66, 80, 88, 90'
{
    const result = students
        .map(student => student.score)
        .sort((a, b) => a - b)
        .join();
    }
}

Q4. 에서처럼 splice를 사용하여 새로운 배열을 만들게 되면 기존 배열 또한 splice를 사용하여 만든 새 배열과 같아진다.
map: array 안의 요소들을 callback 함수에서 return된 값으로 대체 해준다.
some: array의 요소 중에서 callback 함수가 return이 true인 요소가 있는지 확인해준다.
every: array의 모든 요소가 callback 함수의 return이 true인지 확인해준다.
Q10. API 들을 섞어서 사용할 수도 있다.

Q10.. E.g make a string containing all the scores
// result should be: '45, 80, 90, 66, 88'
{
    const result = students
            .map((student) => student.score)
            .filter(score => score >= 50)
            .join());
}