자바스크립트의 배열

박희수·2023년 11월 9일
0
post-thumbnail

자바스크립트의 배열이란?

  • 배열은 다수의 데이터를 저장하고 처리할 때 유용하게 쓰일 수 있다.
  • 자바스크립트의 배열은 길이를 설정하지 않아도 원하는 인덱스에 값을 바로 추가할 수 있고, 타입도 지정되어 있지 않기 때문에 다양한 타입도 동시에 담을 수 있다.

✅ 기본적인 배열의 특징

1. 원하는 길이를 정해줄 수 있다. 
    var ar = new Array(10); 
    console.log(ar.length); // 10

2. 다시 값을 바꿔줄 수도 있다.     
   ar = new Array("월","화","수");
   console.log(ar.length);

   길이를 다시 지정, 뒤의 데이터들은 잘려서 출력된다. 
   ar.length = 2;
   console.log(ar); 

3. var ar = new Array(10).fill(); 
   fill()을 이용하여 공간이 채워진다. 그러나 값은 없다.

   ar.forEach(function (v,i){
      console.log(i);
   }); // 값이 없어서 출력이 안된다.

🤓 배열과 함께 사용하는 다양한 함수

var datas = [];
datas[0] = 10;
console.log(datas);

var datas1 = [20, 5, 6, 12, 10];
console.log(datas1);

➡️ push를 이용해서 data1에 19라는 값을 추가
datas1.push(19);
console.log(datas1);

➡️ join을 이용해 모든 데이터를 콜론으로 구분하여 반환
console.log(datas1.join(":"));

➡️ slice(begin, end)
console.log(datas1.slice(1, 3));
console.log(datas1.slice(1));

➡️ forEach(callback) : 반복문
datas1.forEach(function (v) {
  console.log(v);
});
➡️ datas1의 v(값)을 순서대로 출력시킨다.

➡️ 콜백함수에 datas1(ar) 이라는 배열객체를 받아줄 수 있다.
datas1.forEach(function (v, i, ar) {
  //   console.log(v * v);
  ar[i] = v * v;
});
console.log(datas1);

➡️ indexOf(값) : 값을 해당 Array에서 찾은 뒤 인덱스 번호 리턴, 못찾으면 -1 리턴
console.log(datas1.indexOf(100));

➡️ map(callback) : 기존 값을 원하는 값으로 변경하여 리턴
datas1
  .map(function (v) {
    return v * 2;
  })
  .forEach(function (v, i, ar) {
    console.log((datas1[i] = ar[i]));
  });
console.log(datas1);

➡️ filter(callback) : 리턴이 true인 값만 추출
datas1 = datas1.filter(function (v) {
  return v % 10 == 0;
});
console.log(datas1);
profile
프론트엔드 개발자입니다 :)

0개의 댓글