1. 반복문 대체

let person = {
 name : "김효영",
 age : 25,
 tall : 175
};

const personKeys= Object.keys(person);
//Object.keys 함수에 person을 인자로 넣어주게 되면 이 객체의 '키'들을 순회하면서 '배열'로 출력하게 된다.

const personValues = Object.values(person);
// 이렇게 하면 person 객체의 'values'들을 순회하면서 '배열'로 출력하게 된다.

2. 배열의 내장함수

1) forEach

const arr = [1, 2, 3, 4];

arr.forEach((elm)=> console.log(elm))
// arr.forEach 이 내장함수를 쓰면 arr의 요소를 하나하나 출력한다. 

//위의 코드를 함수선언식으로 바꾸면
arr.forEach(function (elm) {
  console.log(elm)
  // forEach 내장함수로 콜백함수에서 매개변수인 elm에 배열의 요소를 순서대로 하나하나 받아서 콘솔창에 출력하는 것이다.
})

2) map

-> 새로운 배열을 생성

const arr = [1,2,3,4];
const newArr = arr.map((elm)=> {
  return elm *2
})
// map이라는 내장함수는 원본 배열의 모든 요소를 순회하면서 연산을 해서 리턴된 값들만을 따로 
//배열로 추려내서 반환할 수 있게 해주는 함수이다. 

console.log(newArr); // [2,4,6,8]
// arr의 각 요소들이 2씩 곱해진 값이 나온다. 

3) includes

배열 안에 그 요소가 있는지 알려주는 내장함수이다.

const arr = [1,2,3,4];

let number = 3;

console.log(arr.includes(number)); // true
//includes 내장함수는 전달받은 인자가 arr 배열안에 존재하는지를 boolen 타입으로 출력해준다. 
// '==='과 같은 역할은 한다. 

4)indexOf

배열 안에 그 요소가 존재하면 몇번째 index에 존재하는 알려주는 내장함수

const arr = [1,2,3,4];

let number = 3;

console.log(arr.indexOf(number)); // 2
// 만약 indexOf 내장함수는 전달받은 인자가 arr 배열안에 몇번째에 위치하는 알려준다.
// 만약 전달받은 인자가 배열안에 없으면 '-1'을 출력한다. 

5)findIndex

객체배열에서 특정 요소가 몇번째 index에 있는지 알려주는 함수

const arr = [
  {color: "red"},
  {color: "black"},
  {color: "blue"},
  {color: "green"},
  {color: "blue"}

];

let number = 3;

console.log(arr.findIndex((elm) => elm.color === "red"));
// findIndex의 파라미터로 콜백함수를 전달해서 arr의 요소들을 한번씩 순환해서 color의 value가 red인 요소의 index를 출력한다. 

//위의 코드는 아래와 같다.
console.log(
  arr.findIndex((elm) => 
                return elm.color === "red"));

console.log(arr.findIndex((elm) => elm.color === "blue")); // 2
// findIndex는 제일 먼저 만나는 요소의 index를 반환한다. 그래서 4번째는 출력이 안된다.

6) find

객체배열의 특정 요소에 직접 접근할 수 있는 함수

const arr = [
  {color: "red"},
  {color: "black"},
  {color: "blue"},
  {color: "green"}
];

console.log(arr.find((elm) => elm.color === "blue"));
//콘솔창에 {color: "blue"}이 출력

7)filter

-> 배열을 필터링하는 함수, filter은 전달하는 콜백하는 함수가 true를 반환하는 모든 요소를 배열로 반환하는 내장함수이다.
-> 새로운 배열을 생성

const arr = [
  {num: 1, color: "red"},
  {num: 2,color: "black"},
  {num: 3,color: "blue"},
  {num: 4,color: "green"},
  {num: 5,color: "blue"}
];

console.log(arr.filter((elm) => elm.color === "blue"));

//아래같이 출력
//[{num: 3,color: "blue"}, {num: 5,color: "blue"}]

8)slice

배열을 자르는 내장함수, 새로운 배열을 생성

const arr = [
  {num: 1, color: "red"},
  {num: 2,color: "black"},
  {num: 3,color: "blue"},
  {num: 4,color: "green"},
  {num: 5,color: "blue"}
];

console.log(arr.slice());
//파라미터가 빈배열일 경우 arr배열을 그대로 출력한다. 

console.log(arr.slice(0,2));
//[{num: 1, color: "red"}, {num: 2,color: "black"}]
// index가 인것부터 index가 1인것까지 출력한다. 
// arr.slice(0(start),2(end))
// start index(0)는 포함하지만 end index(2)는 포함하지 않고 그 전까지인 index(1)까지 출력한다. 

9) concat

배열을 붙이는 내장함수

const arr1 = [
  {num: 1, color: "red"},
  {num: 2,color: "black"},
  {num: 3,color: "blue"}
];

const arr2 = [
  {num: 4,color: "green"},
  {num: 5,color: "blue"}
]

console.log(arr1.concat(arr2))
// arr1 배열 요소 뒤로 arr2의 배열 요소가 붙어 하나의 배열로 만들어 준다. 

10) sort

-> 배열을 정렬하는 내장함수. 원본배열을 재배열
-> 문자열 기준으로 재배열한다.

let chars = ["나", "다", "가"];

chars.sort();

console.log(chars);
//["가", "나", "다"]


//*숫자를 입력받아서 sort로 재배열하기 위해서는 *
let number = [0,1,3,2,10,30,20];

const compare = (a,b) => {
   
  if(a>b){
    return 1;
    // 작다.
  }
  // a가 b보다 더 뒤에 있어야 한다는 것을 뜻한다
   // a와 b에 각각 0,1를 넣어주면 1이 0보다 크니깐 
  
  if(a<b){
    return -1
    //크다
  }
  // 작은 값이 더 앞으로 가야한다는 뜻
  
  return 0;
  //같다
}
//같을 떄는 자리를 안바꾸게 된다. 

console.log(number) [0,1,2,3,10,20,30] // 오른차순으로 정렬


// * 내림차순으로 정렬하고 싶으면*
const compare = (a,b) => {
   
  if(a>b){
    return -1;
    // 작다.
  }
  // a가 b보다 더 뒤에 있어야 한다는 것을 뜻한다
   // a와 b에 각각 0,1를 넣어주면 1이 0보다 크니깐 
  
  if(a<b){
    return 1
    //크다
  }
  // 작은 값이 더 앞으로 가야한다는 뜻
  
  return 0;
  //같다
}
//같을 떄는 자리를 안바꾸게 된다. 

console.log(number) [30,20,10,3,2,1,0] // 내림차순으로 정렬

11) join

배열 내의 모든 요소들을 문자열로 합치는 내장함수

const arr = ["김효영", "님", "안녕하세요", "또오셨군요"];

console.log(arr.join()); //김효영,님,안녕하세요,또오셨군요 

console.log(arr.join(" ")); //김효영 님 안녕하세요 또오셨군요 

console.log(arr.join("a")) //김효영a님a안녕하세요a또오셨군요