Study & Project ✏️/JavaScript 🐥

JS array 입문!

JM 2021. 12. 25. 20:35
반응형

출처. https://www.youtube.com/watch?v=yOdAVDuHUKQ 

 

다른 언어를 아니깐 그냥 술술 들렸다.

그래도 항상 자만하지 말고 처음부터 끝까지 듣기로 했으니 화이팅!

//Array!
'use strict';

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

// 2. Index position
const fruits = ['apple', 'banana'];
console.log(fruits);    //["apple", "banana"]
console.log(fruits.length);    //2
console.log(fruits[0]);    //apple
console.log(fruits[1]);    //banana
console.log(fruits[2]);    //undefined
console.log(fruits[fruits.length - 1]);    //last index

// 3. 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(function (fruit, index, array) {
    console.log(fruit, index, array);    //"apple", 0, ["apple", "banana"]
    //"banana", 1, ["apple", "banana"]
});

// c. Anonymous Function can use Arrow Function
fruits.forEach((fruit, index, array) => console.log(fruit, index, array));

// 4. Addtion, deletetion, getComputedStyle
// push: add an item to the end
fruits.push('strawberry', 'peach');
console.log(fruits);    //["apple", "banana", "strawberry", "peach"]

// pop: remove an item from the end
fruits.pop();
console.log(fruits);    //["apple", "banana", "strawberry"]

// unshift: add an item to the beginning
fruits.unshift('peach');
console.log(fruits);    //["peach", "apple", "banana", "strawberry"]

// shift: remove an itme from the beginning
fruits.shift()
console.log(fruits);    //["apple", "banana", "strawberry"]

// note!! shift, inshift ar slower than pop, push
// why? 기존의 배열 값들을 옮겨줘야 하기 때문에!

// splice: remove an item by index position
fruits.push('peach', 'lemon');
console.log(fruits);    //["apple", "banana", "strawberry", "peach", "lemon"]
fruits.splice(1);   //["apple"]
fruits.splice(1, 1);    //["apple", "strawberry", "peach", "lemon"]
fruits.splice(1, 1, 'watermelon');    //["apple", "watermelon", "peach", "lemon"]

// combine two arrays
const fruits2 = ['coconat', 'pear'];
const newfruits = fruits.concat(fruits2);
console.log(newfruits);    //["apple", "watermelon", "peach", "lemon", "coconat", "pear"] 뒤에 붙임

// 5. Searching
// indexOf: find the index
// includes
console.log(newfruits.indexOf('apple'));    //0
console.log(newfruits.includes('banana'));   //false
console.log(newfruits.indexOf('banana'));   //-1 없음

// lastIndexOf
console.log(newfruits);    //["apple", "watermelon", "peach", "lemon", "coconat", "pear"]
fruits.push('apple');   //["apple", "watermelon", "peach", "lemon", "coconat", "pear", "apple"]
console.log(newfruits.indexOf('apple'));    //0
console.log(newfruits.lastIndexOf('apple'));    //6 마지막부터 검색

잊지 말아야 할 것!

1. array선언 방식

const arr1 = new Array();

const arr2 = [1, 2];

2. loop 방법

for, for of, forEach

3. push, pop, unshift, shift, splice, concat, indexOf, includes, lastIndexOf

JS의 array API들

'Study & Project ✏️ > JavaScript 🐥' 카테고리의 다른 글

JS JSON 입문!  (0) 2021.12.28
JS 배열 API 공부  (0) 2021.12.27
JS Class 입문!  (0) 2021.12.25
JS Object 입문!  (0) 2021.12.24
JS function 입문!  (0) 2021.12.23