Compare JavaScript Arrays Online
Paste two JavaScript arrays (as JSON). See what was added, removed, or changed — element by element.
🔒 100% private — runs entirely in your browseror try sample data
Paste two JavaScript arrays (as JSON). See what was added, removed, or changed — element by element.
🔒 100% private — runs entirely in your browseror try sample data
JavaScript Array Compare diffs two arrays element by element and shows you exactly what changed. JavaScript has no built-in way to deeply compare arrays — [1, 2] === [1, 2] returns false because === checks reference equality, not value equality.
JavaScript arrays are zero-indexed, ordered collections that can hold any type — strings, numbers, objects, other arrays, or mixed values. When comparing API responses, state snapshots, or test fixtures, you need a tool that understands nested structures and shows meaningful differences.
Paste your arrays as JSON (e.g., [1, 2, 3]). The parser also handles common JS syntax like single quotes and trailing commas. Everything runs in your browser.
const arr1 = ['react', 'vue', 'angular', 'svelte'];
const arr2 = ['react', 'vue', 'solid', 'svelte', 'qwik']; const added = arr2.filter(x => !arr1.includes(x));
const removed = arr1.filter(x => !arr2.includes(x)); console.log('Added:', added); // ['solid', 'qwik']
console.log('Removed:', removed); // ['angular']Works for flat arrays of primitives. Fails with objects or nested arrays.
const a = new Set([1, 2, 3, 4]);
const b = new Set([3, 4, 5, 6]); const onlyInA = [...a].filter(x => !b.has(x)); // [1, 2]
const onlyInB = [...b].filter(x => !a.has(x)); // [5, 6]
const common = [...a].filter(x => b.has(x)); // [3, 4]Set operations are O(n) but ignore duplicates and don't work with objects.
const arr1 = [{id: 1, name: 'Alice'}, {id: 2, name: 'Bob'}];
const arr2 = [{id: 1, name: 'Alice'}, {id: 2, name: 'Charlie'}]; // Caution: key order matters with JSON.stringify
const isEqual = JSON.stringify(arr1) === JSON.stringify(arr2);
console.log(isEqual); // false // For element-by-element diff, use this tool insteadJSON.stringify gives a boolean result only — no detail about what changed. This tool shows the full diff.
[1, 2, 3] === [1, 2, 3] is false in JavaScript. The === operator compares object references, not contents. Even [].toString() === [].toString() gives misleading results for nested arrays. Always use deep comparison for structural equality.
[NaN].includes(NaN) returns true, but [NaN].indexOf(NaN) returns -1. When diffing arrays that may contain NaN, be aware that different comparison methods handle it differently.
[1, , 3] creates a sparse array where index 1 is an empty slot (not undefined). Sparse arrays behave differently with forEach, map, and filter — holes are skipped. When comparing, convert sparse arrays to dense ones first.
Paste your arrays as JSON (e.g., [1, 2, 3]) into the two panels and click Compare. The tool shows added, removed, and modified elements with color-coded highlighting.
In JavaScript, === compares object references, not values. Two arrays with identical elements are different objects in memory, so [1, 2] === [1, 2] is always false. You need element-by-element (deep) comparison.
Yes. The tool recursively compares nested objects and arrays at any depth, showing exactly which properties changed, were added, or were removed.
Yes. This tool runs entirely in your browser using client-side JavaScript. No data is sent to any server.
Yes. TypeScript arrays are JavaScript arrays at runtime. Paste them as JSON and the comparison works identically.
Yes. Check the "Ignore array order" option to treat arrays as unordered collections, useful for comparing sets of IDs or tags regardless of position.