JS - Variadic func

Uczymy się obsługi funkcji ze zmienną ilością parametrów. Będzie to nam potrzebne do naszej biblioteczki React. Do dzieła.

Na pierwszy przykład, czyli dekompozycję obiektów, już się natknęliśmy:

function createElement_v1({type, content, ...attributes}){

    console.log("Type: ", type);
    console.log("Content: ", content);

    for(const [key, value] of Object.entries(attributes)){
        console.log(key, " : ", value);
    }

}


createElement_v1({type: "h2", content: "HelloWorld", id: "myID", class: "text-secondary"});

// Type:  h2 
// Content:  HelloWorld 
// id  :  myID 
// class  :  text-secondary

Ok, ale to dekompozycja obiektów. Napiszmy pierwszą funkcję variadic:

function variadic_v1(...nums){
    return {
        nums: Array.from(nums)
    }
}

console.log(variadic_v1(1,2,3));
// Object {
// nums: Array(3) [ 1, 2, 3 ]
// }

Teraz druga, najpierw jeden argument, potem zmienna ilość argumentów:

function variadic_v2(mulby, ...nums){
    return {
        multiplier: mulby,
        nums: Array.from(nums)
    }
}

console.log(variadic_v2(10, 1,2,3));
// Object { 
//     multiplier: 10, 
//     nums: Array(3) [ 1, 2, 3 ]
// }

Teraz potraktujmy zmienne argumenty jako tablicę, na której chcemy wykonać jakąś operację, zwracając inną tablicę:

function variadic_v3(mulby, ...nums){
    let mulipliedArr = [].concat(...nums)
    .map((el) => el * mulby);

    return {
        multiplier: mulby,
        nums: Array.from(nums),
        mulipliedNums: mulipliedArr
    }
}

console.log(variadic_v3(10,1,2,3));

// Object { 
//     multiplier: 10,
//      nums: Array(3) [ 1, 2, 3 ], 
//      mulipliedNums: Array(3) [ 10, 20, 30 ] 
//     }

To wszystko wydaje się albo dziwne, albo banalne, ale bez opracowania dobrych wzorców pracy z funkcjami variadic daleko nie zajedziemy w naszym projekcie.

JS – Variadic func