TIL JavaScript from Dream Coding(6)

Array

1. Declaration

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

// Index position
const fruits = ['🍎', '🍌'];
console.log(fruits); // ["🍎", "🍌"]
console.log(fruits.length); // 2
console.log(fruits[0]); // 🍎
console.log(fruits[1]); // 🍌
console.log(fruits[2]); // undefined
console.log(fruits[fruits.length -1 ]); // 🍌

---

2. Looping over an array

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
fruits.forEach(fruit => console.log(fruit);); // ["🍎", "🍌"]

---

3. Addtion, deletion, copy

note!! shift, unshift are slower than pop, push

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();
console.log(fruits); // ["🍎","🍌"]

unshift : add an item to the beginning

fruits.unshift('🍓','🍋');
console.log(fruits); // ["🍓","🍋","🍎","🍌"]

shift : remove an item from the beginning

fruits.shift();
fruits.shift();
console.log(fruits); // ["🍎","🍌"]

splice : remove an item by index position

fruits.push('🍓','🍑','🍋');
console.log(fruits); // ["🍎","🍌","🍓","🍑","🍋"]

a.
fruits.splice(1); // 지우고 싶은 인덱스 번호부터 전부 삭제
console.log(fruits); // ["🍎"]

b.
fruits.splice(1, 1); // 지우고 싶은 인덱스 번호, 삭제할 개수
console.log(fruits); // ["🍎","🍓","🍑","🍋"]

c.
fruits.spice(1, 1, '🍏', '🍉') // 지우고 싶은 인덱스 번호, 삭제할 개수, 그 위치에 삽입 할 요소
console.log(fruits); // ["🍎","🍏","🍉","🍓","🍑","🍋"]

concat : combine two arrays

const fruits2 = ['🍐','🥥'];
const newFruits =  fruits.concat(fruits2);
console.log(newFruits); // ["🍎","🍌","🍓","🍑","🍋","🍐","🥥"]

---

4. Searching

Find the Index

console.log(fruits); // ["🍎","🍌","🍓","🍑","🍋"]

// indexOf (Number)
console.log(fruits.indexOf('🍎')); // 0
console.log(fruits.indexOf('🍋')); // 4
console.log(fruits.indexOf('🥝')); // -1 // * 해당하는 값이 없을 경우 -1 출력

// includes (Boolean)
console.log(fruits.includes('🍓')); // true
console.log(fruits.includes('🍇')); // false

// lastIndexOf
console.log(fruits); // ["🍎","🍌","🍓","🍑","🍋"]
fruits.push('🍎');
console.log(fruits);  // ["🍎","🍌","🍓","🍑","🍋","🍎"]
console.log(fruits.indexOf('🍎')); // 0
// indexOf 는 제일 첫번째로 해당하는 값을 만나면 그 값을 return 한다.
console.log(fruits.lastIndexOf('🍎')); // 5
// lastIndexOf 는 제일 마지막번째로 해당하는 값을 만나면 그 값을 return 한다.

5. Array APIs

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

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

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

// Q4. make new array without the first two elements
{
  const array = [1, 2, 3, 4, 5];
  
  // * splice 는 배열 자체를 수정하고, slice는 배열에서 원하는 부분만 return 해서 받아오고 싶을 때 사용한다.
  const result = array.slice(2, 5); // 마지막 index는 배제되어 출력
  console.log(result); // [3, 4, 5]
  console.log(array); // [1, 2, 3, 4, 5]
}


class Student {
  constuctor(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
{
  const result = students.find(student => student.score === 90);
  console.log(result);
}

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

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

// Q8. check if there is a student with the score lower than 50
{
  // 배열 중에 하나만 만족되는 지 확인할 때는 some
  const result = students.some(student => student.score < 50)
  console.log(result); // true
  
  // 배열 중에 모든 요소가 만족되는 지 확인할 때는 every
  const result2 = !students.every(student => student.score >= 50);
  console.log(result2); // ture

// Q9. compute students' average score
{
  const result = student.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 = student
    .map(student => student.score)
    .filter(score => score >= 50)
    .join();
  console.log(result);
}
  
// Bonus! do Q10 sorted in ascending order
// result should be : '45, 66, 80, 88, 90'
{
  const result = student
    .map(student => student.score)
    .sort((a, b) => a - b)
    .join();
  console.log(result);
}