Javascript 배열(Array) – 배열과 객체 활용 3/3

by Posted on
Array and Object
(Array 와 Object 를 사용하여 데이터를 다뤄보자)

* array , Object : find , filter , map , some ,every

class Employee {
        no;
        name
        age;
        dept;
        dayoff;
        constructor(no ,name , age , dept , dayoff)
        {
            this.no = no;
            this.name = name;
            this.age = age;
            this.dept = dept;
            this.dayoff = dayoff;
        }
 }


// 배열 선언과 함께 초기화
var employees = [
            new Employee(1 , “test1” , 20 , “영업” , false) ,
            new Employee(2 , “test2” , 35 , “기술” , false) ,
            new Employee(3 , “test3” , 26 , “자재”  , false)
]

// push로 추가 삽입 하기 
employees.push(new Employee(4, “test4”, 51 , “인사” , true));
employees.push(new Employee(5 ,”test5″, 30 , “기술” , true));

// class 객체 생성후 push
let new_member = new Employee(6 , “test6” , 19 , “기술”  ,  false)
employees.push(new_member)

employees.forEach( (item , index, totObj) =>{
    console.log(item)
});

[
     {no: 1, name: ‘test2’, age: 35, dept: ‘기술’, dayoff: false}
{no: 2, name: ‘test2’, age: 35, dept: ‘기술’, dayoff: false}
     {no: 3, name: ‘test3’, age: 26, dept: ‘자재’, dayoff: false}
     {no: 4, name: ‘test4’, age: 51, dept: ‘인사’, dayoff: true}
     {no: 5, name: ‘test5’, age: 30, dept: ‘기술’, dayoff: true}
     {no: 6, name: ‘test6’, age: 19, dept: ‘기술’, dayoff: false}
]


ㆍFind (Return : 함수내 조건에 맞는 결과 있을시 최초 1개만 – 배열로)

// let 리턴 = 객체.find( (row항목 , 인덱스 , 객체원본)=> { 항목 == 조건 })
//  리턴   : “항목조건” 에 맞는  item객체 1개(최초) 만
//  없으면 : filterItem = undefined  
let findItem = employees.find( (item , idx , totObj) => {
    return item.dept === “기술”;
});
console.log(findItem);

{no: 2, name: ‘test2’, age: 35, dept: ‘기술’, dayoff: false}

 

// index 와 해당 배열 을 사용하지 않으므로 줄여쓰기

// item만 사용 , 1줄 코딩으므로 return 스킵 가능 (자동 return)
let findItem2 = employees.find( (item)=> item.dept === “기술” );

console.log(findItem2)

 {no: 2, name: ‘test2’, age: 35, dept: ‘기술’, dayoff: false}


ㆍFilter (함수내 조건에 맞는 결과 모두 리턴 – 배열로)
// let 리턴 = 객체.filter( (row항목 , 인덱스 , 객체원본)=> { 항목 == 조건 })
// 리턴   : “항목조건” 이 맞는 객체(item) 모두를 리턴

// 없으면 : filterItem = undefined

let filterItem = employees.filter ( (item,index , totOobj)=> {

    return item.age <= 20;
})
console.log(filterItem);
{no: 1, name: ‘test1’, age: 20, dept: ‘영업’, dayoff: false}
{no: 6, name: ‘test6’, age: 19, dept: ‘기술’, dayoff: false}
ㆍMAP (Return : callbackfn 에서 만들어진 객체를 리턴)
// 특정항목  배열로 만들기 map  활용
let deptList = employees.map( ( item , index , object) =>
{
        return item.dept;
})
console.log(deptList)

[‘영업’, ‘기술’, ‘자재’, ‘인사’, ‘기술’, ‘기술’]

let  selectItemList = employees.map( (item ,index , object) => {
    return { “이름” : item.name ,  “부서” : item.dept};  // 객체를 생성해버럼
})
console.log(selectItemList);

{이름: ‘test1’, 부서: ‘영업’}
{이름: ‘test2’, 부서: ‘기술’}
{이름: ‘test3’, 부서: ‘자재’}
{이름: ‘test4’, 부서: ‘인사’}
{이름: ‘test5’, 부서: ‘기술’}
{이름: ‘test6’, 부서: ‘기술’}


ㆍSome (Return :  조건에 맞는 항목이 1개라도 있으면 True , or False)
// SOME : (≠ Every) 항목 중 1개로도 조건을 만족하면 True or False
// let 리턴 = 객체.some( (row항목 , 인덱스 , 객체원본)=> { return 항목 == 조건 })
// 리턴   : “항목조건” 이 만족하는 항목이 1개라도 있으면 true  or  false

// let isExists2 = employees.some( (item) => item.age >= 50 )

let  isSatisfiedJustOne = employees.some( (item, index , Obj) =>
{
    return item.age > 50;
})

console.log(isSatisfiedJustOne);

True


ㆍEvery (Return : 조건에 모든 항목이 맞아야  True or False)

// EVERY : (≠ Some) 모든 항목의 조건이 만족해야 True or False
// let 리턴 = 객체.every( ( row항목  , 인덱스 ,객체원본 = > { return 항목 ===  조건 } ))
// 리턴 : “항목조건” 을 모든 항목이 만족해야 true or false

// 사원번호 10 이하 인지 : 전체 항목들의 사원번호가 10 이하여야 true

console.log(“——————————– every ———————————“)
let isSatisfiedAll = employees.every ( (item, index , obj) =>
{
    return item.no < 10;
})
console.log(isSatisfiedAll);
true

// 사원번호 10 이하 인지 : 전체 항목들의 사원번호가 10 이하여야 true

let isSatisfiedAll2 = employees.every ( (item, index , obj) =>
{
    return item.age < 50;
})
console.log(isSatisfiedAll2);
false  //   51 이 있음


ㆍReduce ( return : 최종 누적값(acc) 를 리턴)

// 배열.reduce(( 누적값, 현재항목, 인덱스, 요소) => { return 결과 }, 초기값 ); // 초기값은 누적값의 초기값
// 리턴값 : 다음의 “누적값” 이 됨 (최종 모든 루프가 끝나면 누적값 의 최종값이 리턴됨)
// 초기값 지정 X  – 누적값 최초에  배열 [0] 요가 들어감 1회 (맨 처음만 한번)
// 초기값 지정 O  – 누적값 최초값은 지정된 초기값이 들어감  1회(맨 처음만 한번)
// 계속해서 초기값을 받고싶을경우  : return 으로 받아옴
employees.reduce( (acc , curr ) =>
{
    console.log(“———— reduce start —————-“)
    console.log(acc);
    console.log(curr);
    // return 값이 없으므로 다음 acc 값은 undefined
});  // 누적변수(acc) 초기화 없음
———— reduce start —————-
 {no: 1, name: ‘test1’, age: 20, dept: ‘영업’, dayoff: false} // acc
 {no: 2, name: ‘test2’, age: 35, dept: ‘기술’, dayoff: false}
 ★ : acc(누적값)에 초기값이  없기때문에 0번째 요소가 1회 초기화됨,
 ———— reduce start —————-
 undefined // acc
 {no: 3, name: ‘test3’, age: 26, dept: ‘자재’, dayoff: false}
 ———— reduce start —————-
 undefined // acc
 {no: 4, name: ‘test4′, age: ’51’, dept: ‘인사’, dayoff: true}
 ———— reduce start —————-
 undefined // acc
 {no: 5, name: ‘test5′, age: ’30’, dept: ‘기술’, dayoff: true}
———— reduce start —————-
undefined // acc

{no: 6, name: ‘test6’, age: 19, dept: ‘기술’, dayoff: false}

 

// 연령 더하기
var accAge = 0
var result = employees.reduce( (acc , currItem)=>
{
    console.log(“—— reduce start —————“)
    accAge = accAge + parseInt(currItem.age);
    console.log(acc);
    console.log(currItem);
    return accAge; // 초기화 다음 acc 에 사용될 값으로 리턴 ,  return  이 없으면 undefined
},0 )  // 누적변수(acc)  를  맨 처음(1회)  0  으로 초기화 함
console.log(“result:” + result);

    —— reduce start —————
    0 // acc
    {no: 1, name: ‘test1’, age: 20, dept: ‘영업’, dayoff: false} // currItem
    —— reduce start —————
    20 // acc
    {no: 2, name: ‘test2’, age: 35, dept: ‘기술’, dayoff: false} // currItem
    —— reduce start —————
    55 // acc
    {no: 3, name: ‘test3’, age: 26, dept: ‘자재’, dayoff: false} // currItem
    —— reduce start —————
    81 // acc
    {no: 4, name: ‘test4′, age: ’51’, dept: ‘인사’, dayoff: true} // currItem
    —— reduce start —————
    132 // acc
    {no: 5, name: ‘test5′, age: ’30’, dept: ‘기술’, dayoff: true} // currItem
    —— reduce start —————
    162 // acc
    {no: 6, name: ‘test6’, age: 19, dept: ‘기술’, dayoff: false} // currItem
   
    result:181 // 마지막 결과
ㆍSort (배열 정렬)

let orderTmp = [];

orderTmp = employees.map( (v, i) => {

    return v.dept;

});

console.log(orderTmp); // [‘영업’, ‘기술’, ‘자재’, ‘인사’, ‘기술’, ‘기술’]

orderTmp.sort();


console.log(orderTmp); // [‘기술’, ‘기술’, ‘기술’, ‘영업’, ‘인사’, ‘자재’]

orderTmp = employees.map( (v, i) => {

    return v.age;

});


//orderTmp.sort(); // unicode 순서대로 기본 오름차순

console.log(orderTmp); //  [19, 20, 26, 30, 35, 51]

orderTmp.sort( (a,b) => {

    return a – b;   // a 가 b 보다 작으면 음수면 오름 차순 : 결과과 음수면 오름
  // return b – a; // b 가 a 보다 작으면 음수면 내림 차순 : 결과과 양수면 내림

});

 

// 오름 차순
orderTmp.sort( (a,b) => {

            if (a < b) return -1 ;  else if(a > b) return 1; else  return 0;

});
console.log(orderTmp);
// [19, 20, 26, 30, 35, 51] // 또는 orderTmp.sort( (a,b) => return a -b;); // 오름 차순


orderTmp.sort( (a,b) => {
              if (a < b) return 1 ;  else  if (a > b) return -1; else  return 0;
});console.log(orderTmp);
// [51, 35, 30, 26, 20, 19] // 또는 orderTmp.sort( (a,b) => return b -a;); //  내림차순 

Published by pluginn

답글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다