Is it safe to use for loop in paintComponent?

Question

I have for loop in my paintComponent that draws the images, and my problem is example a 2d array, each column has their x, y, image, etc, but if I wanna remove one of them, it's not erasing the image, is this because it's not safe to use for loop in paintComponent? or maybe I can't just make loop to draw Images??

Answer 1

The easiest solution is sorting and joining. It may not be the most efficient.

function areSame(a, b) {
  return a.length === b.length &&
    a.slice().sort().join(',') == b.slice().sort().join(',');
}

var t1 = [1, 2, 3];
var t2 = [3, 2, 1];
var t3 = [1, 2, 3, 4];
var t4 = [2, 3, 4];
var t5 = [2, 2, 3];

console.log(areSame(t1, t1));
console.log(areSame(t1, t2));
console.log(areSame(t1, t3));
console.log(areSame(t1, t4));
console.log(areSame(t1, t5));

Other options is to pluck them off the array

function areSame(a, b) {
  if (a.length !== b.length) return false;
  var bCopy = b.slice();
  return a.every(function (v) {
    var index = bCopy.findIndex(function (x) { return x === v; });
    if (index === -1) return false;
    bCopy.splice(index, 1);
    return true;
  });
}

var t1 = [1, 2, 3];
var t2 = [3, 2, 1];
var t3 = [1, 2, 3, 4];
var t4 = [2, 3, 4];
var t5 = [2, 2, 3];

console.log(areSame(t1, t1));
console.log(areSame(t1, t2));
console.log(areSame(t1, t3));
console.log(areSame(t1, t4));
console.log(areSame(t1, t5));

Answer 2

You could count the items and check against the map.

This approach works for more than one same items as well.

const
    contains = (a, b) => {
        const count = b.reduce((m, v) => m.set(v, { count: (m.get(v)?.count || 0) + 1 }), new Map);
        return a.every(v => count.has(v) && count.get(v).count--);
    };

console.log(contains([1, 2, 3], [1, 2, 3, 4, 5, 6])); //  true
console.log(contains([1, 2, 3, 4, 5, 6], [1, 2, 3])); // false

Answer 3

@Adolf You can loop over the second array and then use include as

let find = [1, 2, 3];
let nums = [1, 2, 3, 4, 5, 6];

let ifAll = false;
nums.forEach(val =>{
    if(find.includes(val)){
        ifAll = true;
    }
    else{
    ifAll = false;
    return;
    }
});

console.log(ifAll);

Answer 4

There are 2 approaches to solving this problem. If you're certain that both the arrays are small (let's say their length is less than 100), you can follow this approach:

let find = [1, 2, 3];
let nums = [1, 2, 3, 4, 5, 6]; 
let containsAll = true;

for (let i = 0; i < find.length; i++) {
  if (!nums.includes(find[i])) {
    containsAll = false;
    break;
  }
}

console.log(containsAll);

This approach simply checks whether each element in find array is there in nums array. If it encounters any number in find array which is not present in nums array, it will set the containsAll variable to false and break or come out of loop. However this approach uses Javascript .includes method and thus runtime complexity is O(find.length * nums.length), since .includes uses linear search. Check this: Runtime complexity of JS .includes

To improve this we can run binary search on each element of find array. Code:

let find = [1, 6, 34];
let nums = [1, 4, 6, 8, 5, 16];
nums = nums.sort((a, b) => a - b); //sort for binary search
let containsAll = true;

for (let i = 0; i < find.length; i++) {
  if (!binarySearch(nums, find[i])) {
    console.log("Not found: ", find[i]);
    containsAll = false;
    return;
  }
}

function binarySearch(arr, element) {
  let start = 0,
    end = arr.length - 1;
  while (start <= end) {
    let mid = Math.floor((start + end) / 2);
    if (element == arr[mid]) {
      return true;
    } else if (element < arr[mid]) {
      end = mid - 1;
    } else {
      start = mid + 1;
    }
  }
  return false;
}

console.log("containsAll: ", containsAll);

The resultant complexity is O(log(nums.length) * find.length).