Search code examples
javascripttypescriptdrygettertypescript2.0

DRY - Typescript. How can I use DRY principles to avoid duplication of these 2 getters


I know that below two getters are duplicates and could be consolidated and written in a better way. Could any one please help me come up with a way to consolidate these:-

isEqual here is a lodash library to compare two objects. state in here is an injected state which I am picking the objects from.

   public get isUpperModified(): boolean {
        if (!this.isUpperAvailable) {
          return false;
        }
        if (
          (this.orders.upperPreference.type === '1' &&
            this.state.fetchedData.upperPreference.type === '1') ||
          (this.orders.upperPreference.type === 'UPPER' &&
            this.state.fetchedData.upperPreference.type === 'UPPER')
        ) {
          return false;
        }
        if (!isEqual(this.orders.upperPreference, this.state.fetchedData.upperPreference)) {
          return true;
        }
        return false;
      }




public get isLowerModified(): boolean {
        if (!this.isLowerAvailable) {
          return false;
        }
        if (
          (this.orders.lowerPreference.type === '1' &&
            this.state.fetchedData.lowerPreference.type === '1') ||
          (this.orders.lowerPreference.type === 'LOWER' &&
            this.state.fetchedData.lowerPreference.type === 'LOWER')
        ) {
          return false;
        }
        if (!isEqual(this.orders.lowerPreference, this.state.fetchedData.lowerPreference)) {
          return true;
        }
        return false;
      }

Solution

  • There are more than 1 way to achieve this.

    You can create a new function isModified(type: string) and pass upper or lower as an argument.

    Hope this helps

    public get isUpperModified(): boolean {
        return this.isModified('upper');
    }
    
    
    public get isLowerModified(): boolean {
        return this.isModified('lower');
    }
    
    private isModified(type: 'lower' | 'upper'): boolean {
    
        const available = type === 'lower' ? this.isLowerAvailable : this.isUpperAvailable;
        const order = type === 'lower' ? this.orders.lowerPreference : this.orders.upperPreference;
        const state = type === 'lower' ? this.state.fetchedData.lowerPreference : this.state.fetchedData.upperPreference;
    
        if (!available) {
           return false;
        }
    
        if (
            (order.type === '1' &&
                state.type === '1') ||
            (order.type === type.toUpperCase() &&
                state.type === type.toUpperCase())
        ) {
            return false;
        }
        if (!isEqual(order, state)) {
            return true;
        }
        return false;
    }