如果foreach内的/ else条件

Question

I am developing an angular project. I have a table file I want to compare each element with a data value if it is correct I will do statement else I will do another comportement but my problem is that even the data is correct it always fetches all the table and should access in the else for a very short time. How to avoid that, please.

Here is my code:

if (this.data) {
  this.imgNotFoundText = '';
  this.data.package.files.forEach(element => {
    i++;
    this.picture = '';
    if (element.name == this.data.properties.Name) {
      this.picture = 'picOne.png'
    }
    if (i == this.data.package.files.length && this.picture == '') {
      this.picture = './../assets/img/notFound.jpg'
    }
  });
}

Answer 1

I see a couple of possible problems:

1. It seems suspect to always do this.picture = ''; unconditionally in the loop. If you're going to do that, you may as well only look at the last entry in the array. You probably want to move that to before the forEach call.

2. You've referred to an else , but there is no else in your code. You have two if s in a row, but the result of the first if doesn't have any effect at all on the second one. You may have wanted else if . Then, the second if isn't performed if the condition in the first if was true.

So if both of those guesses are right:

if (this.data) {
    this.imgNotFoundText = '';
    this.picture = '';
    this.data.package.files.forEach(element => {
        i++;
        if (element.name == this.data.properties.Name) {
            this.picture = 'picOne.png'
        } else if (i == this.data.package.files.length && this.picture == '') {
            this.picture = './../assets/img/notFound.jpg'
        }
    });
}

---

Side note: You haven't shown how i is initialized, but if it's used to track the index of the current entry of the forEach , there's no need: forEach receives that as a second argument:

if (this.data) {
    this.imgNotFoundText = '';
    this.picture = '';
    this.data.package.files.forEach((element, index) => {
    // -----------------------------^^^^^^^^^^^^^^^^
        if (element.name == this.data.properties.Name) {
            this.picture = 'picOne.png'
        } else if (index == this.data.package.files.length && this.picture == '') {
    // ------------^^^^^
            this.picture = './../assets/img/notFound.jpg'
        }
    });
}

You also might want to avoid that second if altogether, by just specifying the "not found" default before the loop:

if (this.data) {
    this.imgNotFoundText = '';
    const {files} = this.data.package;
    this.picture = files.length ? './../assets/img/notFound.jpg' : '';
    files.forEach(element => {
        if (element.name == this.data.properties.Name) {
            this.picture = 'picOne.png'
        }
    });
}

In that I've assumed this.picture should be '' if there are no entries in files , or the "not found" image if there's at least one entry. The loop will overwrite it if it finds a match.

Continuing from there, unless there can be multiple entries in files with the same name , you probably want to stop as of the first match. So:

if (this.data) {
    this.imgNotFoundText = '';
    const {files} = this.data.package;
    this.picture = files.length ? './../assets/img/notFound.jpg' : '';
    for (const {name} of files) {
        if (name == this.data.properties.Name) {
            this.picture = 'picOne.png'
            break;
        }
    }
}

Answer 2

Not sure what your goal is but you're just iterating through the list and setting the picture value every time, this means you'll have as result the last element's picture value.

If your goal is to display a "not found" picture for elements who don't have files, you need to have an array of pictures that reflects the array of files (or add a property picture to each file).

Answer 3

Looks like you can use Array.prototype.some

if (this.data) {
  this.imgNotFoundText = '';
  this.picture = this.data.package.files.some(
  (element) => element.name === this.data.properties.Name
  ) ? 'picOne.png' : './../assets/img/notFound.jpg'
}

It'll return picOne.png if any of the items in data.package.files has a name that is same as this.data.properties.Name or it'll return notFound.jpg

Although that could