Develop Reference

JS: sorting based on multiple arrays

I have following three arrays, which defines the order of some texts
arr1 = ['ab', 'bc', 'ca', 'ac']
arr2 = ['lm', 'mn', 'ml']
arr3 = ['ij', 'kj', 'pr']
I want to sort array below based on the array above. Each string of myArray is consists of 5 characters where each 2 character are from the characters of the above 3 arrays. That is, arr1 has the highest priority, arr2 has priority over arr3 but less priority than arr1. arr3 has the lowest priority.
First 2 character of each string in myArray always match at least one string in arr1, middle two character match arr2 and last two character match arr3.
myArray = ['acmnkj', 'bcmlij', 'camnij', 'bcmnij',]
How can I sort myArray so that the results are sorted by arr1, arr2 and arr3. Expected sorted array ['bcmnij', 'bcmlij', 'camnij', 'acmnkj']
How can do this?

const arr1 = ['ab', 'bc', 'ca', 'ac']
const arr2 = ['lm', 'mn', 'ml']
const arr3 = ['ij', 'kj', 'pr']
const myArr = ['acmnkj', 'bcmlij', 'camnij', 'bcmnij']
const f = (s,a,i)=>a.indexOf(s.substring(2*i,2*i+2))
myArr.sort((x,y)=>[arr1,arr2,arr3].reduce((a,c,i)=>a || f(x,c,i)-f(y,c,i),0))
console.log(myArr)

You could take an object with the order of the parts and compare sliced parts against.
const
arr1 = ['ab', 'bc', 'ca', 'ac'],
arr2 = ['lm', 'mn', 'ml'],
arr3 = ['ij', 'kj', 'pr'],
data = ['acmnkj', 'bcmlij', 'camnij', 'bcmnij'],
order = Object.fromEntries([...arr1, ...arr2, ...arr3].map((v, i) => [v, i + 1]));
data.sort((a, b) => {
let i = 0;
while (i < 6) {
const r = order[a.slice(i, i + 2)] - order[b.slice(i, i + 2)];
if (r) return r;
i += 2;
}
return 0;
});
console.log(data);
A slightly different approach with replacing the strings by an order value for comparing by string.
const
getOrder = s => s.replace(/../g, k => order[k]),
arr1 = ['ab', 'bc', 'ca', 'ac'],
arr2 = ['lm', 'mn', 'ml'],
arr3 = ['ij', 'kj', 'pr'],
data = ['acmnkj', 'bcmlij', 'camnij', 'bcmnij'],
order = Object.fromEntries([...arr1, ...arr2, ...arr3].map((v, i) => [v, (i + 1).toString().padStart(2)]));
data.sort((a, b) => getOrder(a).localeCompare(getOrder(b)));
console.log(order)
console.log(data);

You could create an object which maps the priority for each array
createOrder = (arr) => Object.fromEntries(arr.map((c,i) => [c,i]))
and then create an array of orders.
orders = [arr1,arr2,arr3].map(createOrder)
I'm assuming that there could be duplicate strings within the arrays. So, a flat order object is not created.
// orders array
[
{
"ab": 0,
"bc": 1,
"ca": 2,
"ac": 3
},
{
"lm": 0,
"mn": 1,
"ml": 2
},
{
"ij": 0,
"kj": 1,
"pr": 2
}
]
Then sort your array. Get the parts for each string
const partsA = a.match(/.{2}/g)
This can be changed based on your actual data. Here, it matches every 2 characters. If your input is 'ac-mn-kj', you'd be splitting at -.
Then loop until you find a difference in the order of each parts using some.
This works for any number of input arrays or format of the string in myArray
const arr1 = ['ab', 'bc', 'ca', 'ac'],
arr2 = ['lm', 'mn', 'ml'],
arr3 = ['ij', 'kj', 'pr'],
createOrder = (arr) => Object.fromEntries(arr.map((c,i) => [c,i])),
orders = [arr1,arr2,arr3].map(createOrder),
myArray = ['acmnkj', 'bcmlij', 'camnij', 'bcmnij']
myArray.sort((a,b) => {
const partsA = a.match(/.{2}/g) // can change based on your requirement
const partsB = b.match(/.{2}/g)
let returnValue;
partsA.some((p, i) => returnValue = orders[i][p] - orders[i][partsB[i]])
return returnValue
})
console.log(myArray)

How to create a nested while loop based on N number of arrays?

I'm trying to create a combination of all possible variants of the arrays given below, which are pretty self-explanatory.
let arr1 = ['Small', 'Medium', 'Large', 'Extra-Large']
let arr2 = ['Black','Red','White']
let arr3 = ['Normal','Limited-Edition']
let combos = []
arr1.forEach((i) => {
arr2.forEach((j) => {
arr3.forEach((k) => {
combos.push(i + '-' + j + '-' + k)
})
})
})
console.log(combos)
This gives the output I want, however I want to create a function that takes an arbitrary array of arrays, [arr1, arr2, arr3.....arrN] and creates a nested loop of each of them, and returns a combined value of strings.
How do I go around creating such a function?

You can use something like this using reduce. I referenced this post
let arr1 = ['Small', 'Medium', 'Large', 'Extra-Large']
let arr2 = ['Black','Red','White']
let arr3 = ['Normal','Limited-Edition']
let arr4 = ['x','y','z']
let arr = [arr1,arr2,arr3,arr4]
let combined = arr.reduce((a,c)=>{
return a.flatMap(x=>c.map(y=>x.concat(y)))
},[[]]).map((z) => z.join("-"))
console.log(combined)
console.log(combined.length) //4*3*2*3 = 72
UPDATE - This one is taken directly from the top answer with a very small modification
let arr1 = ['Small', 'Medium', 'Large', 'Extra-Large']
let arr2 = ['Black','Red','White']
let arr3 = ['Normal','Limited-Edition']
let arr4 = ['x','y','z']
let arr = [arr1,arr2,arr3,arr4]
const cartesian =
(a) => a.reduce((a, b) => a.flatMap(d => b.map(e => [d, e].flat()))).map(x=>x.join("-"));
console.log(cartesian(arr))

const arr1 = ['Small', 'Medium', 'Large', 'Extra-Large']
const arr2 = ['Black','Red','White']
const arr3 = ['Normal','Limited-Edition']
const arr4 = ['x','y','z']
const arr = [arr1,arr2,arr3,arr4]
const merged = [].concat.apply([], arr);
console.log(merged);

Remove out nested array based on another array

I have this nested array
let arr = [['first', 'second'], ['third', 'fourth'], ['second', 'third']]
now I want to filter/remove based on exactly this array.
let filter = ['first', 'second']
and now my expected output should be:
[['third', 'fourth'], ['second', 'third']]
I only have this piece of code:
arr.filter(str => str.indexOf('second') === -1)
Which doesn't give the expected output, it also removed ['second', 'third'] because it filters whatever element that contains 'second'.. so they must be a better way or an improvement to the code.

If you care about ordering and need exact matches, you can write a simple arrays equal method and then filter out any equal arrays:
const arrEq = (a, b) => a.length === b.length && a.every((e, i) => b[i] === e);
const arr = [['first', 'second'], ['third', 'fourth'], ['second', 'third']];
const filter = ['first', 'second'];
console.log(arr.filter(e => !arrEq(e, filter)));
If you want the same elements but order doesn't matter:
const arrItemsEq = (a, b, cmp) => {
if (a.length !== b.length) {
return false;
}
a = a.slice().sort(cmp);
b = b.slice().sort(cmp);
return a.every((e, i) => e === b[i]);
};
const arr = [["a", "b"], ["b", "c"]];
const filter = ["b", "a"];
const strCmp = (x, y) => x.localeCompare(y);
console.log(arr.filter(e => !arrItemsEq(e, filter, strCmp)));
If you want to filter out arr elements if they don't include at least one of each filter element:
const arr = [["a", "b"], ["b", "c"]];
const filter = ["b", "a"];
console.log(arr.filter(x => !filter.every(y => x.includes(y))));

You need to test two arrays for equality. [There are many ways to do it] but once you pick one, you can simply remove any array that is equal to another. To avoid reimplementing the wheel, I'll use the LoDash _.isEqual for demonstration purposes:
let arr = [['first', 'second'], ['third', 'fourth']]
let filter = ['first', 'second']
let result = arr.filter(item => !_.isEqual(filter, item));
console.log(result);
<script src="https://cdn.jsdelivr.net/npm/lodash#4.17.15/lodash.min.js"></script>
The equality function can be swapped to any implementation that satisfies you. A very simple one is simply:
function isEqual(a, b) {
return JSON.stringify(a) === JSON.stringify(b);
}
but it's not guaranteed to be correct (e.g, isEqual([1, 2], ["1,2"]) //true) and it's going to be slow with large inputs. But it might still work, depending on circumstances.

You can use filter to check if the element doesn't include every string of the filter array.
let arr = [['first', 'second'], ['third', 'fourth'], ['second', 'third']]
let filterout = ['first', 'second']
let arr2 = arr.filter(x => ! filterout.every(y => x.includes(y)))
console.log(arr2)
But by using filter it basically creates a new array with fewer elements. Which is good enough for a small array.
If if the goal is to directly change the original array, then those elements can be spliced from that array.
let arr = [ ['first', 'second'], ['third', 'fourth'], ['second', 'third'], ['second', 'first'] ]
let filterout = ['first', 'second']
// getting the indexes of the element that need to be removed
let idxArr = []
arr.forEach( (x, idx) => { if(x.every(y => filterout.includes(y))) idxArr.push(idx)})
// removing the elements from the array
idxArr.sort((i,j)=>j-i).forEach(idx => {arr.splice(idx, 1)})
console.log(arr)

Find elements in an array not contained in another array of objects

I have an array arr1 = [1,2,3,4,5]
There is another array of objects arr2 = [{'id':2, 'name':'A'},{'id':4, 'name':'B'}]
I am looking for find elements in arr1 which are not in arr2. The expected output is [1,3,5]
I tried the following but it doesn't work.
const arr = arr1.filter(i => arr2.includes(i.id));
Can you please help?

A solution with O(arr2.length) + O(arr1.length) complexity in Vanilla JS
var arr1= [1,2,3,4,5];
var arr2 = [{'id':2, 'name':'A'},{'id':4, 'name':'B'}];
var tmp = arr2.reduce(function (acc, obj) {
acc[obj['id']] = true;
return acc;
}, {});
var result = arr1.filter(function(nr) {
return !tmp.hasOwnProperty(nr);
})

arr2 is an array of objects, so arr2.includes(i.id) doesn't work because i (an item from arr1) is a number, which doesn't have an id property, and because arr2 is an array of objects.
Turn arr2's ids into a Set first, then check whether the set contains the item being iterated over:
const arr1 = [1,2,3,4,5];
const arr2 = [{'id':2, 'name':'A'},{'id':4, 'name':'B'}];
const ids = new Set(arr2.map(({ id }) => id));
const filtered = arr1.filter(num => !ids.has(num));
console.log(filtered);

You can try with Array.prototype.some():
The some() method tests whether at least one element in the array passes the test implemented by the provided function. It returns a Boolean value.
const arr1 = [1,2,3,4,5]
const arr2 = [{'id':2, 'name':'A'},{'id':4, 'name':'B'}]
const arr = arr1.filter(i => !arr2.some(j => j.id == i));
console.log(arr);

We can use the filter method like below to check the condition required
var arr1 = [1, 2, 3, 4, 5]
var arr2 = [{ 'id': 2, 'name': 'A' }, { 'id': 4, 'name': 'B' }]
var ids = [];
arr2.forEach(element => {
ids.push(element['id'])
});
var result = arr1.filter(s => ids.indexOf(s) < 0)
console.log(result)

let arr1= [1,2,3,4,5];
let arr2 = [{'id':2, 'name':'A'},{'id':4, 'name':'B'}]
let arr2Ids=arr2.map(item=>item.id);
let result=arr1.filter(n => !arr2Ids.includes(n));

You can use find on arr2 instead of includes since arr2 is composed of object
const arr = arr1.filter(i => !arr2.find(e => e.id===i));

How to group by two array by index in javascript with es6 or lodash?

We have same two arrays to groupby theme by index.
Two arrays with same length and different value like blow.
How to groupby two array with their index by ES6 reduce or lodash?
array1 = [1,2,3,4] OR [{a:1},{b:2},{c:3},{d:4}]
array2 = [5,6,7,8] OR [{e:5},{f:6},{g:7},{h:8}]
finalArray = [[1,5],[2,6],[3,7],[4,8]]
I'm trying with different ways like group by with reduce in es6 or lodash concat but i can't find best solution for my problems.

Try this:
let array1 = [1, 2, 3, 4];
let array2 = [5, 6, 7, 8];
let res = array1.map((value, index) => {
return [value, array2[index]]
})
console.log(res);
If it is array of objects
let array1 = [{a:1},{b:2},{c:3},{d:4}];
let array2 = [{e:5},{f:6},{g:7},{h:8}];
let res = array1.map((value, index) => {
return [Object.values(value)[0],Object.values(array2[index])[0]]
})
console.log(res)

Use lodashes zip function
// _ is lodash
const array1 = [1,2,3,4]
const array2 = [5,6,7,8]
console.log(_.zip(array1, array2))
result
[ [ 1, 5 ], [ 2, 6 ], [ 3, 7 ], [ 4, 8 ] ]
If you are working with the array of objects. Get just the values using Object.values and grab the 0th element.
const array3 = [{a:1},{b:2},{c:3},{d:4}];
const array4 = [{e:5},{f:6},{g:7},{h:8}];
function firstval(ob){
return Object.values(ob)[0]
}
console.log(_.zip(array3.map(firstval), array4.map(firstval)))
You can also write your own zip. This is a limited version. That handles only 2 elements, doesn't accept or return generators etc.
It could easily be extended to take a spread operator and therefore any number of arguments. You don't seem to need that level of flexibility though.
function zip(a, b) {
const num = Math.min(a.length, b.length);
const result = [];
for(i = 0; i < num; i++) result.push([a[i], b[i]]);
return result;
}

Following code works under these assumptions:
all input arrays have same length
if array element is object, it has only one property
function getValue(element) {
if (typeof element === 'object') {
return Object.values(element).pop()
} else {
return element
}
}
function zipArrays(arr1, arr2) {
return arr1.reduce((acc, elm1, index) => {
const elm2 = arr2[index]
const elm = [getValue(elm1), getValue(elm2)]
acc.push(elm)
return acc
}, [])
}
// usage:
const array1 = [1,2,3,4] // OR [{a:1},{b:2},{c:3},{d:4}]
const array2 = [5,6,7,8] // OR [{e:5},{f:6},{g:7},{h:8}]
const finalArray = zipArrays(array1, array2)