javascript - hur man använder mixins med lodash och typescript med stöd för kedjning

Jag har problem med att använda Lodash med TypeScript när jag försöker utöka Lodash med mina egna mixins.

Mitt misslyckade försök:

Låt oss säga att jag lägger till en ny funktion i lodash med hjälp av mixins på följande sätt:

//lodashMixins.ts

import * as _ from "lodash";

_.mixin({
  swap
});

function swap(array: Array<any>, index1: number, index2: number) {
    let temp = array[index1];
    array[index1] = array[index2];
    array[index2] = temp;
    return array;
}

Funktionen swap är inte tillgänglig på _ om jag import _ from "lodash"; i andra filer.

Delvis lyckat försök:

Då sökte jag hjälp, och folk föreslog att extend _.LoDashStatic och sedan exportera _ som det nya utökade interface.

Sedan gjorde jag följande:

//lodashMixins.ts

import * as _ from "lodash";

interface LodashExtended extends _.LoDashStatic {
  swap(array: Array<any>, index1: number, index2: number): Array<any>;
}

_.mixin({
  swap
});

function swap(array: Array<any>, index1: number, index2: number) {
    let temp = array[index1];
    array[index1] = array[index2];
    array[index2] = temp;
    return array;
}

export default _ as LodashExtended;

Och använda den nya inblandade enligt följande:

//otherFile.ts

import _ from "./lodashMixins";

function someFn(){
    var array = [1,2,3,4]
    _.swap(array, 1, 2);
}

Nu fungerar detta, men det finns två problem:

  1. För det första fungerar inte den nya swap-funktionen med Lodashs kedjade syntax (varken med explicit kedjning eller med implicit kedjning).

vilket betyder att TypeScript blir argt om jag gör något av följande:

//otherFile.ts

import _ from "./lodashMixins";

function someFn(){
    var cantDothis = _.chain([1,2,3,4]).map(x=>x*x).swap(1,2).value();
    //[ts] Property 'swap' does not exist on type 'LoDashExplicitWrapper<number[]>'.

    var neitherThis = _([1,2,3,4]).map(x=>x*x).swap(1,2).value();
    //[ts] Property 'swap' does not exist on type 'LoDashImplicitWrapper<number[]>'.
}
  1. Jag håller med om att jag måste göra detta fula import _ från "./lodashMixins"; istället för standard import _ från "lodash";.

Kan någon snälla komma på en elegant lösning som ger TypeScript-typsupport samtidigt som man kedjar utan någon kodlukt eller fulhet.. Tack. :)

Kanske kan John-David Dalton hjälpa.

Svar #1

Du letar efter modulaugumentering. Du kan utöka gränssnitt i befintliga moduler genom att omdefiniera dem och lägga till extra metoder. I detta fall bör du augmentera LoDashStatic för statisk användning och LoDashExplicitWrapper för kedjeanvändning. När du använder modulen kan du först importera lodash och sedan importera modulen som innehåller swap för dess sidoeffekter (sidoeffekten av att lägga till metoden till lodash)

// swap.ts
import * as _ from "lodash";


declare module "lodash" {
    interface LoDashStatic {
        swap<TValue>(array: Array<TValue>, index1: number, index2: number): TValue[];
    }
    interface LoDashExplicitWrapper<TValue> {
        swap(index1: number, index2: number): LoDashExplicitWrapper<TValue>;
    }
}

_.mixin({
    swap
});

function swap(array: Array<any>, index1: number, index2: number) {
    let temp = array[index1];
    array[index1] = array[index2];
    array[index2] = temp;
    return array;
}

//usage 
import * as _ from "lodash";
import "./swap"


console.log(_.chain([1,2,3,4]).map(x=>x*x).swap(1,2).map(x=> x * 2).value());

var array = [1,2,3,4]
console.log(  _.swap(array, 1, 2));

Du kan läsa mer om modulförstärkning här

Relaterade artiklar