swap array elements in nested loop with delay - javascript

I wanna my divs to be sorted but in this code it only goes through for loop once. How can i make this to end both loops and my divs sorted?
var arr = [4, 7, 1, 9, 8, 13, 6, 11];
function showarray() {
for (var i = 0; i < arr.length; i++) {
var divSort = document.createElement("div");
divSort.style.width = 30 + "px";
divSort.style.height = 30 + "px";
divSort.style.background = "yellow";
divSort.style.display = "inline-block";
divSort.style.margin = "10px";
divSort.id = arr[i];
divSort.innerHTML = arr[i];
document.body.appendChild(divSort);
}
}
showarray();
function func() {
for (var j = (arr.length - 1); j >= 0; j--) {
for (var i = 1; i <= j; i++) {
if (arr[i] < arr[i - 1]) {
doSetTimeout(i, j);
};
};
}
function doSetTimeout(i, j) {
setTimeout(function() {
$("#" + arr[i]).insertBefore("#" + arr[i - 1]);
}, j * i * 100);
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button onclick="func()">Click</button>

It looks like you are only iterating one time because you aren't changing the array indexes, you are just updating the div positions, so everytime you iterate the array, it hasn't changed (just your divs). So you are always iterating the same array, doing the same changes over and over again. You need to change the array values and also change the div positions:
var arr = [4, 7, 1, 9, 8, 13, 6, 11];
var counter = 0;
function showarray() {
for (var i = 0; i < arr.length; i++) {
var divSort = document.createElement("div");
divSort.style.width = 30 + "px";
divSort.style.height = 30 + "px";
divSort.style.background = "yellow";
divSort.style.display = "inline-block";
divSort.style.margin = "10px";
divSort.id = arr[i];
divSort.innerHTML = arr[i];
document.body.appendChild(divSort);
}
}
showarray();
function func() {
for (var j = arr.length; j > 0; j--) {
for (var i = 0; i < (arr.length-1); i++) {
if (arr[i] > arr[i + 1]) {
swap(i+1, i);
}
};
}
function swap(smaller, bigger) {
var tmpBigger = arr[bigger];
var tmpSmaller = arr[smaller];
arr[bigger] = tmpSmaller
arr[smaller] = tmpBigger;
setTimeout(function() {
$("#" + tmpSmaller).insertBefore("#" + tmpBigger);
}, ++counter * 500);
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button onclick="func()">Click</button>

Related

Storing instances of an array using the slice method in javascript

I have an array list I loop over and modify it each time. I want to store all instances of my list array in an other array I named allLists, and to do so, I'm using the slice method.
It seems to work in the simple example below:
let list=[1,2,3,4];
let allList = [];
allList.push(list.slice());
list[2]=6;
allList.push(list.slice());
console.log(allList);// returns [1,2,3,4] [1,2,6,4]
But it doesn't work in the following code. Instead, allLists is filled with the last instance of the list array.
let list = Array.from({
length: 9
}, () => Array.from({
length: 9
}, () => [1, 2, 3, 4, 5, 6, 7, 8, 9]));
let allLists = [list.slice()];
let indexList = [];
let lengthList = [];
let key = true;
function handleNewIndex(list) {
let newIndex = [0, 0];
let maxLength = 9;
for (let i = 0; i < list.length; i++) {
for (let j = 0; j < list.length; j++) {
if (list[i][j].length < maxLength && list[i][j].length > 0) {
maxLength = list[i][j].length;
newIndex = [i, j];
}
}
}
return newIndex;
}
function isSudokuValid(list) {
for (let i = 0; i < list.length; i++) {
for (let j = 0; j < list.length; j++) {
if (list[i][j].length === 0) {
return false;
}
}
}
return true;
}
function handleWrongSudoku(allLists, indexList, lengthList) {
let counter = 1;
while (lengthList[lengthList.length - counter] <= 1) {
counter = counter + 1;
allLists.pop();
indexList.pop();
}
let wrongList = allLists.pop();
list = allLists.pop();
indexLine = indexList[indexList.length - 1][0];
indexColumn = indexList[indexList.length - 1][1];
let wrongNumber = wrongList[indexLine][indexColumn];
for (let i = 0; i < list[indexLine][indexColumn].length; i++) {
if (list[indexLine][indexColumn][i] != wrongNumber) {
list[indexLine][indexColumn] = list[indexLine][indexColumn][i];
}
}
allLists.push(list.slice());
indexLine = handleNewIndex(list)[0];
indexColumn = handleNewIndex(list)[1];
}
function generateSudoku() {
let indexLine = Math.floor(Math.random() * 9);
let indexColumn = Math.floor(Math.random() * 9);
let counter = 0;
while (counter < 81) {
indexList.push([indexLine, indexColumn]);
let bigSquareIndex = 3 * Math.floor(indexLine / 3) + Math.floor(indexColumn / 3);
lengthList.push(list[indexLine][indexColumn].length);
list[indexLine][indexColumn] = list[indexLine][indexColumn][Math.floor(Math.random() * list[indexLine][indexColumn].length)];
counter = counter + 1;
for (let i = 0; i < 9; i++) {
for (let j = 0; j < 9; j++) {
if (3 * Math.floor(i / 3) + Math.floor(j / 3) === bigSquareIndex) {
let k = 0;
let n = list[i][j].length;
while (list[i][j][k] != list[indexLine][indexColumn] && k < n) {
k = k + 1;
}
if (k < n) {
list[i][j].splice(k, 1);
}
} else if (i === indexLine || j === indexColumn) {
let k = 0;
let n = list[i][j].length;
while (list[i][j][k] != list[indexLine][indexColumn] && k < n) {
k = k + 1;
}
if (k < n) {
list[i][j].splice(k, 1);
}
}
}
}
allLists.push(list.slice());
key = isSudokuValid(list);
if (key === false) { //ignore this scenario, not done yet, assume key = true at all time
console.log(key, lengthList, indexList, allLists);
handleWrongSudoku(allLists, indexList, lengthList);
key = true;
//return;
} else {
indexLine = handleNewIndex(list)[0];
indexColumn = handleNewIndex(list)[1];
}
}
}
generateSudoku();
console.log(allLists); // returns 81 times the same 9x9 array instead of the 81 different instances of the list array
I don't know what I'm doing wrong here.
Thanks for the hint Code Maniac.
I used the JSON method instead to create a deep copy and it's working fine now.
allLists.push(JSON.parse(JSON.stringify(list)));
This post explains the difference between shallow and deep copy:
https://www.freecodecamp.org/news/how-to-clone-an-array-in-javascript-1d3183468f6a/

JavaScript - find the same first element using for loop

I've got to create var with few elements:
var arrNum = [4,7,5,3,4,5,6,7,8,10]
I need to find first number that is the same in array using for loop. So it will be "4" and "4"
I need to create var sameIndex and adjust the same number to sameIndex and print after for loop
So I did loop
for(var i = 0; i < arrNum.length; i++){
console.log("")
console.log("Loop number is " + i)
if(arrNum[i] === arrNum[i]{
break
sameIndex = going[i]
}
}
console.log(sameIndex)
It's not working.
One way would be to use Array#indexOf. It returns the first index of the given element in the array:
var arrNum = [4, 7, 5, 3, 4, 5, 6, 7, 8, 10];
var i;
var sameIndex = -1;
for (i = 0; i < arrNum.length; i++) {
if (arrNum.indexOf(arrNum[i]) !== i) {
console.log('This is the second occurrence of', arrNum[i]);
sameIndex = arrNum.indexOf(arrNum[i]);
break;
}
}
console.log('The indices are', sameIndex, 'and', i);
If you're looking to get the first duplicate, then use :
var arrNum = [4,7,5,3,4,5,6,7,8,10];
function firstDuplicate(array){
var history = [];
for(var element of array){
if(history.indexOf(element)<0)
//not in the history yet
history.push(element);
else
return element;
}
return null; //or any distinctive value
}
var fDup = firstDuplicate(arrNum);
You could take a hash table and display the value.
var array = [4, 7, 5, 3, 4, 5, 6, 7, 8, 10],
hash = Object.create(null),
i;
for (i = 0; i < array.length; i++) {
if (hash[array[i]]) {
console.log('first dupe: ' + array[i]);
break;
}
hash[array[i]] = true;
}
A working script:
var arrNum = [4,7,5,3,4,5,6,7,8,10];
var sameIndex = -1, going = new Array();
for(var j = 0; j < arrNum.length; j++) {
for(var i = 1; i < arrNum.length; i++){
console.log("Loop number is " + j + ", " + i)
if(arrNum[i] === arrNum[j]){
sameIndex = i;
break;
}
}
if(sameIndex > 0) {
console.log(j, sameIndex)
break;
}
}
var arrNum = [4,7,5,3,4,5,6,7,8,10];
for(var i = 0; i < arrNum.length; i++){
for(var j = i+1; j < arrNum.length; j++) {
if(arrNum[i] === arrNum[j]) {
console.log('value: '+arrNum[i]+' index1: '+i+' index2: '+j);
}
}
}
Iterate over the original array and if the value is not in a comparison array - push it into a common numbers array. The first item in that common numbers array is the target.
var origArray = [4,7,5,3,4,5,6,7,8,10];
var newArray = [];
var commonNums = [];
origArray.forEach(function(item,i) {
newArray.indexOf(item) == -1
? newArray.push(item)
: commonNums.push({item: item, index:i});
})
if(commonNums.length > 0) {
var firstCommonNum = commonNums[0].item;
var firstCommonNumIndex = commonNums[0].index;
console.log("common number " + firstCommonNum);
console.log("Loop number is " + firstCommonNumIndex);
}

Output the sorted array to main element

I am new to javascript and working with DOM, so please bear with me.
I have an array called num that I want to sort and display. The sort is a selection sort that returns the number of moves it took.
I can display the unsorted array but can't figure out how to call my sort function and then display the sorted array to the screen. My code is below:
function fn(a, b) {
if (a < b)
return true;
}
function selection(list, fun) {
var min, temp, count,
len = list.length;
for (var i = 0; i < len; i++) {
min = i;
for (var j = i + 1; j < len; j++) {
if (fun(list[j], list[min])) {
min = j;
}
}
temp = list[i];
list[i] = list[min];
listlist
list[min] = temp;
count += 3;
}
return count;
}
var num = [10, 1, 3, 5, 2, 9, 8, 6, 7, 4];
var demoP = document.getElementById("content");
{
var html = "";
html += "Original:" + num + "<br>";
selection(num, fn);
html += "Sorted:" + num + "<br>";
}
demoP.innerHTML = html;
<div id="content"></div>
arr is undefined, you should use list instead. Returning count returns the number of operations (after it's been initialized), return list instead. And as list is local to the function, you need to set num to the return value of the function call.
<span id='content'/>
<script>
function fn(a, b) {
if (a < b)
return true;
}
function selection(list, fun) {
var min, temp, count=0,
len = list.length;
for (var i = 0; i < len; i++) {
min = i;
for (var j = i + 1; j < len; j++) {
if (fun(list[j], list[min])) {
min = j;
}
}
temp = list[i];
list[i] = list[min];
list[min] = temp;
count += 3;
}
return list;
}
var num = [10, 1, 3, 5, 2, 9, 8, 6, 7, 4];
var demoP = document.getElementById("content");
var html = "";
html += "Original:" + num + "<br>";
num= selection(num, fn);
html += "Sorted:" + num + "<br>";
demoP.innerHTML = html;
</script>

Comparing two arrays isn`t working

I want to check for the same numbers in "checked" and "numbers". There are six numbers in each array and equal once shuld be outputed in the array "same".
There are 0 elements in "same" even if there are the same numbers in the array. The code to compare the two arrays is right ( I tested it before) but here it wont work.
Please help
Thanks
function getNumbers(){
var boxes = document.forms[0];
var checked = [];
var i;
for (i = 0; i < boxes.length; i++) {
if (boxes[i].checked) {
checked[checked.length] = boxes[i].value;
}
}
if(checked.length != 6){alert("Pick 6");}
else{
document.getElementById("Ausgabe2").innerHTML = "You picked: "+checked;
var numbers = [];
var randomnumber;
while(numbers.length < 6){
randomnumber = Math.ceil(Math.random()*49)
if(numbers.indexOf(randomnumber) > -1) continue;
numbers[numbers.length] = randomnumber;
}
numbers.sort(sortNumber);
document.getElementById("Ausgabe").innerHTML = numbers;
Here the comparing part begins. If I declare 'numbers' and 'checked' here again it works but I dont`t want to do this.
var same = [];
for (i = 0; i < 6; i++) {
if (numbers.indexOf(checked[i]) != -1) {
same.push(checked[i]);
}
}
document.getElementById("Ausgabe3").innerHTML = "You`ve got " + same.length + " right: " + same;
}
}
function sortNumber(a,b) {
return a - b;
}
Is it what you are looking for ?
"use strict"
var numbers = [1, 3, 5, 7, 9, 11];
var checked = [4, 5, 6, 7, 8, 9];
var same = [];
for (var i = 0; i < numbers.length; i++) {
for (var j = 0; j < checked.length; j++) {
if (numbers[i] === checked[j]) {
same.push(numbers[i]);
}
}
}
alert(same);
It's because each time you enter a value in array same you enter it at a fixed index which is undefined (or 0, depends on how you've initialized the array)
// These declarations are only for this demo
var numbers = [0, 1, 2, 3, 4, 5, 6];
var checked = [3, 4, 5, 6, 7, 8, 9];
var same = [];
// Start of the snippet
// Replace the below part in your code
var len = (numbers.length < checked.legth) ? numbers.length : checked.length;
for (i = 0; i < len; i++) {
if (numbers.includes(checked[i])) {
same.push(checked[i]); // This line is where your code had a error
}
}
// End of snippet
console.log('same array:');
console.log(same);
EDIT:
You are understood JS array wrong. Youv'e used the following loop multiple times in the updated snippet in your question
for (i = 0; i < boxes.length; i++) { // Iterate i from 0 till box.length
if (boxes[i].checked) {
checked[checked.length] = boxes[i].value; // For each value of i, the value of check.length is the same. So every time this condition is executed, you simply overwrite the value.
}
}
Try to update your function wit the one below, I've updated few logical error's...
function getNumbers() {
var boxes = document.forms[0];
var checked = [];
var i;
for (i = 0; i < boxes.length; i++) {
if (boxes[i].checked) {
checked.push(boxes[i].value); // Updated here
}
}
if (checked.length != 6) {
alert("Pick 6");
} else {
document.getElementById("Ausgabe2").innerHTML = "You picked: " + checked;
var numbers = [];
var randomnumber;
while (numbers.length < 6) {
randomnumber = Math.ceil(Math.random() * 49)
if (numbers.indexOf(randomnumber) > -1) continue;
numbers.push(randomnumber); // Updated here
}
numbers.sort(sortNumber);
document.getElementById("Ausgabe").innerHTML = numbers;
var same = [];
for (i = 0; i < 6; i++) {
if (numbers.indexOf(checked[i]) != -1) {
same.push(checked[i]);
}
}
document.getElementById("Ausgabe3").innerHTML = "You`
ve got " + same.length + "
right: " + same;
}
}

selection sort in javascript via Khan Academy

I am not sure what Im doing wrong in my code, but it sorts the numbers correctly, but also leaves this output:
Array after sorting: ,,,,,,,7,,9,,11,,,,,,,,,,,22,,,,,,,,,,,,,,,,,,,,42,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,88,,,,,,,,,,,99
Please help me troubleshoot my code!
var swap = function(array, firstIndex, secondIndex) {
var temp = array[firstIndex];
array[firstIndex] = array[secondIndex];
array[secondIndex] = temp;
};
var indexOfMinimum = function(array, startIndex) {
var minValue = array[startIndex];
var minIndex = startIndex;
for(var i = minIndex + 1; i < array.length; i++) {
if(array[i] < minValue) {
minIndex = i;
minValue = array[i];
}
}
return minIndex;
};
var selectionSort = function(array) {
var length = array.length;
for(var i = 0; i < length; i++){
var min = indexOfMinimum(array,array[i]);
swap(array, i, min);
}
};
var array = [22, 11, 99, 88, 9, 7, 42];
selectionSort(array);
println("Array after sorting: " + array);
Program.assertEqual(array, [7, 9, 11, 22, 42, 88, 99]);
You don't want the value at index i, you just want i itself.
var min = indexOfMinimum(array, array[i]);
should be
var min = indexOfMinimum(array, i);
var selectionSort = function(array) {
var length = array.length;
for(var i = 0; i < length; i++){
var min = indexOfMinimum(array,i);
swap(array, i, min);
}
}
Try this:
var selectionSort = function(array) {
var minIdx;
for(var i = 0; i < array.length - 1; i++){
minIdx = indexOfMinimum(array, i);
swap(array, minIdx, i);
}
return array;

Categories