skip to Main Content

I am converting a JS file to TS, in my react native project but have stumbled accross this issue that I can’t resolve where the value['flag'] is showing the following error,
‘value’ is of type ‘unknown’.ts(18046). Any idea on how to solve this will be much appreciated.

The code block is the following:

    for (const [key, value] of Object.entries(orderedCities)) {
      if (
        key.startsWith(userInput.toLowerCase()) &&
        userInput != '' &&
        value !== typeof undefined
      ) {
        const inputObject = {city: '', flag: ''};
        inputObject.city = key;
        inputObject.flag = value['flag'];
        creationArray.push(inputObject);
        setElementArray(creationArray);
      }
    }

I tried declaring a type in the const [key, value] but this triggers a different error, I added the value !== typeof undefined but this has not changed the error showen.

2

Answers


  1. Use for..in when you wan to iterate over object.

    for (const key in orderedCities) {
      // const k = key as keyof typeof orderedCities
      // const value = orderedCities[k]
      // or
      const value = orderedCities[key as keyof typeof orderedCities]
    
      // ...
    }
    
    Login or Signup to reply.
  2. You are expecting value to be an object with a property { flag: string }. Right now the entire value has type unknown. It’s not even know that it is an object.

    This means that something is wrong with the type of your orderedCities variable. That is, the problem is somewhere higher up in your code.

    Perhaps you initialized an empty dictionary without declaring its type. I can reproduce your 'value' is of type 'unknown' error if I create orderedCities as:

    const orderedCities = {};
    

    I can get rid of the error by creating orderedCities with a proper type:

    const orderedCities: Record<string, { flag: string }> = {};
    

    You will want to remove your attempted solution && value !== typeof undefined. This doesn’t make sense as typeof undefined is a string. It will give you an error of its own once you have a proper type on orderedCities.


    Corrected code:

    // Dummy variables with correct types to avoid errors
    const creationArray: Array<{ city: string; flag: string }> = [];
    const setElementArray: (array: Array<{ city: string; flag: string }>) => void = () => { };
    const userInput = '';
    
    // THIS IS THE TYPE WHICH MATTERS
    const orderedCities: Record<string, { flag: string }> = {};
    
    // No errors in your code
    for (const [key, value] of Object.entries(orderedCities)) {
        if (
            key.startsWith(userInput.toLowerCase()) &&
            userInput != ''
        ) {
            const inputObject = { city: '', flag: '' };
            inputObject.city = key;
            inputObject.flag = value['flag'];
            creationArray.push(inputObject);
            setElementArray(creationArray);
        }
    }
    

    TS Playground Link

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search