Reputation: 1
The program is supposed to take inputs from 2 text files. The first holds data pairs, each pair is on its own line of text. The first piece is a word, the second is a number representing weigh. The second file is a list of words each on its own line. I have tested the input streams and I know that the files are inputting into each array. When I go to compare the combinations of strings the words will not compare as equal when they are supposed to. I have checked to make sure they are basic strings and not objects. I have tried ==, ===, and localeCompare() with no success. I have trimmed the strings, used valueOf(), and toString() also not working. Any help would be appreciated.
<!-- File: Enter filename -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Mod D 3: Revenge of the JS</title>
</head>
<body>
<input onchange="loadFile(id)" type="file" name="fileName" id="firstFile" accept=".txt">
<br>
<input onchange="loadFile(id)" type="file" name="fileName2" id="secondFile" accept=".txt">
<br>
<br>
<button onclick="compareFiles()">compare files</button>
<br>
<br>
<textarea readonly name="textStuff" id="textStuff" cols="30" rows="15" style="resize none;" data-role="none"></textarea>
<script>
var display = document.getElementById("textStuff");
var file1Words = [];
var file1Weight = [];
var file2Words = [];
var words = [];
var testingFiles = false;
function loadFile(idname) {
console.log("arrived at load function");
var file = document.getElementById(idname).files[0];
var reader = new FileReader();
reader.onload = function(progressEvent) {
var lineNum = this.result.split('\n');
if (idname == 'firstFile') {
console.log("found the first file");
for (var i = 0; i < lineNum.length; i++) {
var holder = lineNum[i].split(" ");
console.log("loading...");
file1Words.push(holder[0]);
file1Weight.push(Number(holder[1]));
}
} else if (idname == 'secondFile') {
console.log("found second file");
for (var i = 0; i < lineNum.length; i++) {
console.log("loading...");
file2Words.push(lineNum[i]);
}
}
};
reader.readAsText(file);
};
function compareFiles() {
console.log("in the compare function");
if (file1Words.length == 0 || file2Words.length == 0) {
console.log("why no stuff");
alert("You must input both files");
return;
}
if (testingFiles) {
console.log("testing the files");
display.value = "";
for (var i = 0; i < file1Words.length; i++) {
display.value += file1Words[i] + " " + file1Weight[i] + '\n';
}
for (var i = 0; i < file2Words.length; i++) {
display.value += file2Words[i];
}
}
// loop through the arrays
for (var i = 0; i < file1Words.length; i++) {
var s1 = file1Words[i];
for (var j = 0; j < file2Words.length; j++) {
//console.log(file1Words[i] + " " + file2Words[j]);
var s2 = file2Words[j];
console.log(s1 + " " + s2);
console.log(s1.localeCompare(s2));
if (s1.localeCompare(s2) == 0) {
console.log("found something. sending to next func");
}
}
}
};
function compareToSaved() {
console.log("found a match. comparing to see if top 15");
};
</script>
</body>
</html>
Upvotes: 0
Views: 52
Reputation: 2930
In the second word list- file2Words, a Carriage return is also added at the end.
So the second file2Words always has one more character than the file1Words.
You can check this by printing the length of the strings from the two arrays. As shown below.
Also this prints the ascii code of the last char of file2Words as 13(carriage Return)
for (var i = 0; i < file1Words.length; i++) {
var s1 = file1Words[i];
for (var j = 0; j < file2Words.length; j++) {
//console.log(file1Words[i] + " " + file2Words[j]);
var s2 = file2Words[j];
console.log(","+s1 + "," + s2 + ",");
console.log(s1.length)
console.log(s2.length)
console.log(s2.charCodeAt(s2.length-1))
console.log(s1.localeCompare(s2));
if (s1.localeCompare(s2) == 0) {
console.log("found something. sending to next func");
}
}
}
};
To deal with this, use trim() before adding the words to lists as mentioned in the other answers.
Upvotes: 1
Reputation: 756
You need to do a trim()
against each LINE content before pushing them into arrays.
var holder = lineNum[i].trim().split(" ");
file2Words.push(lineNum[i].trim());
var display = document.getElementById("textStuff");
var file1Words = [];
var file1Weight = [];
var file2Words = [];
var words = [];
var testingFiles = false;
function loadFile(idname) {
console.log("arrived at load function");
var file = document.getElementById(idname).files[0];
var reader = new FileReader();
reader.onload = function (progressEvent) {
var lines = this.result.split('\n');
if (idname == 'firstFile') {
console.log("found the first file");
lines.forEach(line => {
var values = line.trim().split(" ");
file1Words.push(values[0]);
file1Weight.push(Number(values[1]));
});
} else if (idname == 'secondFile') {
console.log("found second file");
lines.forEach(line => {
file2Words.push(line.trim());
});
}
};
reader.readAsText(file);
};
function compareFiles() {
console.log("in the compare function");
console.log(file1Words, file2Words);
if (file1Words.length == 0 || file2Words.length == 0) {
console.log("why no stuff");
alert("You must input both files");
return;
}
if (testingFiles) {
console.log("testing the files");
display.value = "";
file1Words.forEach((element, index) => {
display.value += element + " " + file1Weight[index] + '\n';
});
file2Words.forEach((element, index) => {
display.value += element + '\n';
});
}
// loop through the arrays
for (var i = 0; i < file1Words.length; i++) {
var s1 = file1Words[i];
for (var j = 0; j < file2Words.length; j++) {
var s2 = file2Words[j];
var result = s1 === s2;
console.log(s1 + " ==? " + s2, result);
if (result) {
console.log("found something. sending to next func");
}
}
}
};
function compareToSaved() {
console.log("found a match. comparing to see if top 15");
};
<!-- File: Enter filename -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Mod D 3: Revenge of the JS</title>
</head>
<body>
<input onchange="loadFile(id)" type="file" name="fileName" id="firstFile" accept=".txt">
<br>
<input onchange="loadFile(id)" type="file" name="fileName2" id="secondFile" accept=".txt">
<br>
<br>
<button onclick="compareFiles()">compare files</button>
<br>
<br>
<textarea readonly name="textStuff" id="textStuff" cols="30" rows="15" style="resize none;" data-role="none"></textarea>
</body>
</html>
Upvotes: 0