【kintone】for-of나 forEach로 테이블의 값을 들여다 본다

안녕하세요!
3~4년 정도 전에 「for」는 시대 늦다!
for가 아니라 map 메소드를 사용합시다!

무슨 말을 듣고,
프로그래머 XX 세정 연설 같은 것을 어딘지 모르게 의식해 버린 적이 있는 줄리돈(당시 사무직)입니다.

오늘은, 그런 for의 동료, for-of를 소개하면서,
배열로 사용할 수 있는 forEach 메소드도 사용해,
테이블의 필드 값을 얻고 싶습니다.

for-of란?



객체 속에서 하나씩 값을 가져와 처리할 수 있는 반복문입니다.
이런 느낌으로 사용합니다.

for(const x of オブジェクト){
   console.log(x);
}

for-of 사용법 1



갑작스럽지만 for-of를 사용해보고 싶습니다.
예를 들어 이런 객체가 있었을 때를 생각합시다・・・

const lunch = [
    {名前:"ひめ", セット:"A", デザート:"チョコ"},
    {名前:"たろう", セット:"B", デザート:"チョコ"},
    {名前:"なすび", セット:"C", デザート:"チョコ"}
];

↓ 이렇게하면 배열의 처음부터 끝까지 취해 이것
for(const r of lunch){
    console.log(r);
}

콘솔에서 실행 결과 ↓


for-of 사용법 2



이렇게 하면 키가 「이름」의 객체만 취해 이것합니다.
for(const {名前} of lunch){
    console.log({名前});
}

콘솔에서 실행 결과 ↓


for-of 사용법 3



이렇게 하면 이름의 값만 취해 이것입니다.
분할 대입이라는 방법입니다.
참고 : 분할 대입

for(const {名前:v} of lunch){
    console.log(v);
}

콘솔에서 실행 결과 ↓


forEach로 다시 쓰기



배열로부터 1개씩 값을 가져와 처리하는···라고 하는 메소드입니다만, 이런 식으로 씁니다.
配列.forEach(v =>{
    //処理
})

조금 전의 for-of 사용법 1 ~ 3을 다시 쓰면 이런 느낌. 결과도 동일합니다.
//1
lunch.forEach(r => {
    console.log(r);
});

//2
lunch.forEach(({名前}) => {
    console.log({名前});
});

//3
lunch.forEach(({名前:v}) => {
    console.log(v);
});

테이블에서 시도



테이블 준비



이런 테이블을 준비합시다.

테이블 이름: 점심


필드명/코드
필드 종류
내용


번호
수치

이름
문자열(1행)

세트
라디오 버튼
A B

디저트
체크박스
초콜릿 바닐라




자바스크립트 쓰기



이런 식으로, 상세 화면에서 내용을 확인할 수 있도록 여러가지 써 보았습니다.
꼭 실행해 보세요 ✨✨
【kintone】테이블의 값을 변경해 본다(초초보자용) 등 참고로 해 주세요.

즉시 함수 부분을 직접 작성하십시오.
//詳細画面
kintone.events.on(['app.record.detail.show'], event => {

    const record = event.record;
    console.log("record\n",record.ランチ.value);

    console.log("\n【for-of 1】for(const r of record.ランチ.value)");
    for(const r of record.ランチ.value){
        console.log(r);
    }

    console.log("\n【for-of 2】for(const {value} of record.ランチ.value)");
    for(const {value} of record.ランチ.value){
        console.log(value);
    }

    console.log("\n【for-of 3】for(const {value:r} of record.ランチ.value)");
    for(const {value:r} of record.ランチ.value){
        console.log(r);
    }

    console.log("\n【for-of 4】for(const {value:{名前:r}} of record.ランチ.value)");
    for(const {value:{名前:r}} of record.ランチ.value){
        console.log(r);
    }

    console.log("\n【for-of 5】for(const {value:{名前:{value:r}}} of record.ランチ.value)");
    for(const {value:{名前:{value:r}}} of record.ランチ.value){
        console.log(r);
    }

    console.log("\n【for-of 6】for(const r of record.ランチ.value)");
    for(const r of record.ランチ.value){
        console.log(r.value.名前.value);
    }

    console.log("\n【forEach 1】forEach");
    record.ランチ.value.forEach(({value:{名前:{value:r}}}) => {
        console.log(r);
    });

    console.log("\n【forEach 2】forEach");
    record.ランチ.value.forEach(r => {
        console.log(r.value.名前.value);
    });

    return event;
});    

실행 결과의 console 스쿠쇼 이미지(긴)







요약



for-of나 forEach를 사용하면 자유자재? 에 테이블 필드의 값을 가지고 이것처럼 느껴졌습니다.
어떤 방법이 제일 좋은지는 시험하고 있지 않습니다만, 처리 속도라든지 조사해 보고 싶습니다. (조사해 주신 분이 있으면 가르쳐 주세요)

그래서 오늘은 이걸로 (· ω ·) 노시 노시

좋은 웹페이지 즐겨찾기