JavaScript Arrays

김서하·2021년 4월 7일
0

JavaScript

목록 보기
6/11
<배열>
 목록을 만드는 방법, 
 모든 데이터 유형(문자열, 숫자 및 불리언 포함) 저장 가능, 
 순서 지정됨(각 항목에는 번호가 매겨진 위치존재)

<배열 만들기>
 배열은 대괄호 []와 내부내용으로 표시,
 배열 내의 각 콘텐츠 항목은 엘리먼트,
 배열 내부에는 세가지 엘리먼트 존재,
 배열 내부의 각 요소는 다른 데이터 유형!
 let newYearsResolutions =
 ['Keep a journal', 'Take a falconry class',  
 'Learn to juggle'];
 
<엘리먼트 엑세스>
  배열의 각 요소에는 '인덱스'라고하는 번호가 매겨진 위치 존재.
  인덱스를 사용하여 개별 항목에 엑세스 가능
  JavaScript의 배열은 인덱스가 0, 즉 위치 0이 1임!
  배열 첫 번째 항목의 위치에느 0이 있다.
  const hello = 'Hello World';
  console.log(hello[6]);
  // Output: W
  다른 예
  const famousSayings = ['Fortune favors the 
  brave.', 'A joke is a very serious thing.', 
  'Where there is love there is life.'];

  const listItem = famousSayings[0];
  console.log(famousSayings[0]);
  // Output: Fortune favors the brave.
  console.log(famousSayings[2]);
  // Output: Where there is love there is life.
  console.log(famousSayings[3]);
  // Output: undefined
  
<엘리먼트 업데이트>
 let seasons = ['Winter', 'Spring', 'Summer',    
 'Fall'];
 
 seasons[3] = 'Autumn';
 console.log(seasons); 
 //Output: ['Winter', 'Spring', 'Summer',
  'Autumn']
    
<let, const 있는 배열>
   const배열의 내용은 변경가능하지만, 
   새 배열이나 다른 값 재할당x
   let condiments = ['Ketchup', 'Mustard', 'Soy 
   Sauce', 'Sriracha'];

   const utensils = ['Fork', 'Knife', 
   'Chopsticks', 'Spork'];

   condiments[0] = 'Mayo';
   console.log(condiments);//Output: ['Mayo', 
   'Mustard', 'Soy Sauce', 'Sriracha']

   condiments = ['Mayo'];
   utensils[3] = 'Spoon';

   console.log(condiments);//Output: ['Mayo']
   console.log(utensils);//Output: ['Fork', 
   'Knife', 'Chopsticks', 'Spoon']
   
<.length> - 배열 개수
 const newYearsResolutions = ['Keep a journal', 
 'Take a falconry class'];
 
 console.log(newYearsResolutions.length);
 // Output: 2
   
<.push()> - 배열 끝에 항목 추가
 const itemTracker = ['item 0', 'item 1', 
 'item 2'];
 
 itemTracker.push('item 3', 'item 4');
 
 console.log(itemTracker); 
 // Output: ['item 0', 'item 1', 'item 2', 
   'item 3', 'item 4'];
     
<.pop()> - 마지막 항목 제거
 const newItemTracker = ['item 0', 'item 1', 
 'item 2'];
 
 const removed = newItemTracker.pop();
 
 console.log(newItemTracker); 
 // Output: [ 'item 0', 'item 1' ]
 console.log(removed);
 // Output: item 2
 다른 예
 const chores = ['wash dishes', 'do laundry',  
 'take out trash', 'cook dinner', 'mop floor'];

 chores.pop();

 console.log(chores);// Output: [ 'wash dishes', 
 'do laundry', 'take out trash', 'cook dinner' ]
 
 <다양한 array>
 .join(), .slice(), .splice(), .shift(), 
 .unshift(), 및 .concat()
 
 *.shift()* - 첫 번째 항목 제거
 const groceryList = ['orange juice', 'bananas', 
 'coffee beans', 'brown rice', 'pasta', 'coconut 
 oil', 'plantains'];

 groceryList.shift();
 console.log(groceryList); // Output:
 [ 'bananas',
  'coffee beans',
  'brown rice',
  'pasta',
  'coconut oil',
  'plantains' ] 
  
  *.unshift()* - 첫 번째 항목에 삽입
  const groceryList = ['orange juice', 'bananas', 
  'coffee beans', 'brown rice', 'pasta', 'coconut 
  oil', 'plantains'];

  groceryList.unshift('popcorn');
  console.log(groceryList); // Output: 
  [ 'popcorn',
  'orange juice',
  'bananas',
  'coffee beans',
  'brown rice',
  'pasta',
  'coconut oil',
  'plantains' ] 
  
*.slice* - 선택(한 줄로 작성)
 const groceryList = ['orange juice', 'bananas',  'coffee beans', 'brown rice', 'pasta', 'coconut 
 oil', 'plantains'];

 console.log(groceryList.slice(1, 4)); // Output:
 [ 'bananas', 'coffee beans', 'brown rice' ]
 
*.indexOf()* - 몇 번째인지
 const groceryList = ['orange juice', 'bananas', 
 'coffee beans', 'brown rice', 'pasta', 'coconut 
 oil', 'plantains'];

 const pastaIndex = groceryList.indexOf('pasta');

 console.log(pastaIndex); // Output: 4
 
<배열과 함수>
 const flowers = ['peony', 'daffodil',
 'marigold'];
 
 function addFlower(arr) {
   arr.push('lily');
 }
 
 addFlower(flowers);
  
 console.log(flowers); // Output: ['peony',  'daffodil', 'marigold', 'lily']
 다른 예
 const concept = ['arrays', 'can', 'be', 
 'mutated'];

 function changeArr(arr){
   arr[3] = 'MUTATED';
 }

 changeArr(concept);
 console.log(concept); // Output: [ 'arrays', 
 'can', 'be', 'MUTATED' ]

 function removeElement(newArr){
   newArr.pop();
 }
 removeElement(concept);
 console.log(concept); // Output: [ 'arrays', 
 'can', 'be' ]
 
<중첩 배열> - 배열에 다른 배열이 포함된 경우
 const nestedArr = [[1], [2, 3]];
 
 console.log(nestedArr[1]); // Output: [2, 3]
 console.log(nestedArr[1][0]); // Output: 2
 다른 예
 const numberClusters = [[1,2], [3,4],[5,6]];
 
 const target = numberClusters[2][1];
 console.log(target); // Output: 6
 
profile
개발자 지망생 서하입니당

0개의 댓글