[英]Why is my javascript code ignoring the if?
如果之前没有添加过，应该创建一个新用户并将其添加到数组中，但是由于某种原因，我的代码忽略了询问它是否在 (Array.prototype.includes ()) 中的 if 并添加了新用户独立，无论之前是否存在。 我已经检查过数组是否正确存储在 localStorage 中，以及用户是否被正确创建。 我可以看到它有很多代码，对此很抱歉，但我真的想不出其他任何地方来查找错误。 这是一个学校的工作，我必须按照它的方式去做
function Usuario(name, lname, age, rol, user, pass) { this.name = name; this.lname = lname; this.age = age; this.rol = rol; this.user = user; this.pass = pass; } var usuarios = localStorage.getItem("usuarios"); usuarios = (usuarios) ? JSON.parse(usuarios) : []; function crearUsuario() { var n = document.getElementById("newU_name").value; var l = document.getElementById("newU_lname").value; var a = document.getElementById("newU_age").value; var r = document.getElementById("newU_rol").value; var u = document.getElementById("newU_user").value; var p = document.getElementById("newU_pass").value; var new_user = new Usuario(n, l, a, r, u, p); return new_user; } function addUsuario() { var u = crearUsuario(); console.log(u); if (usuarios.includes(u)) { //this is what is ignored window.alert("Exist"); } else { usuarios.push(u); localStorage.setItem("usuarios", JSON.stringify(usuarios)); } }
<!DOCTYPE html> <html> <head> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" /> <title> administrar </title> </head> <body> <div class="col-md-6"> <div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title">Usuario Nuevo</h3> </div> <div class="panel-body"> <form role="form"> <div class="form-group"> <label>Nombre(s):</label> <input type="text" name="name" id="newU_name" class="form-control"> </div> <div class="form-group"> <label>Apellidos::</label> <input type="text" name="lname" id="newU_lname" class="form-control"> </div> <div class="form-group"> <label>Edad:</label> <input type="age" name="age" id="newU_age" class="form-control"> </div> <div class="form-group"> <label>Rol:</label> <select name="rol" id="newU_rol" class="form-control"> <option value="Ayudante">Alumno Ayudante</option> <option value="Profesor">Profesor</option> <option value="Admin">Administrador</option> </select> </div> <div class="form-group"> <label>Usuario:</label> <input type="text" name="user_name" id="newU_user" class="form-control"> </div> <div class="form-group"> <label>Contraseña:</label> <input type="password" name="pass" id="newU_pass" class="form-control"> <br> <label type="text" id="uss"></label> </div> <button type="reset" id="btn_reset" class="btn btn-default">Cancelar</button> <input type="button" id="btn_ok" class="btn btn-default" value="Aceptar" onclick="addUsuario()"> </form> </div> </div> </div> </body> </html>
在下面的代码中，需要确保 usuarios 不是 undefine 并且具有包含功能。
function addUsuario() {
var u = crearUsuario();
console.log(u);
if (usuarios.includes(u)) { //this is what is ignored
window.alert("Exist");
} else {
usuarios.push(u);
localStorage.setItem("usuarios", JSON.stringify(usuarios));
}
}
控制台进行跟踪，并且需要添加更多的比较条件，如下所示：
function addUsuario() {
var u = crearUsuario();
console.log(u);
console.log(usuarios); //see your object in console panel is correct?
if (typeof(usuarios) !== "undefined" && typeof(usuarios.includes) === "function" && usuarios.includes(u)) { //this is what is ignored
window.alert("Exist");
} else {
usuarios.push(u);
localStorage.setItem("usuarios", JSON.stringify(usuarios));
}
}
我认为问题可能在于您正在检查复杂对象数组是否包含另一个复杂对象。
而不是包括尝试类似的东西
if (usuarios.some(x => x.attribute === y.attribute)) {...}
由于 usuarios 是一个用户数组，每个用户都是一个对象。 您不能使用includes检查。 您需要使用findIndex或find或简单的for循环进行搜索。
您需要指定哪个字段是唯一的，我假设user是唯一的字段。
function addUsuario() {
var u = crearUsuario();
console.log(u);
const exists = (usuarios.findIndex((lu) => lu.user === u.user )) > -1;
if (exists) { //this is what is ignored
window.alert("Exist");
} else {
usuarios.push(u);
localStorage.setItem("usuarios", JSON.stringify(usuarios));
}
}
.includes()不适用于对象数组。 当涉及到对象{a:1,b:2} == {a:1,b:2}将返回 false。 两者都指向内存中的不同地址。 类似的对象数组无法使用 .includes() 在其中找到对象。
如果您有一个唯一键（可能是.user ），您可能希望使用.findIndex()进行搜索，否则您必须手动比较所有键。
我用于parseFloat的简单JavaScript代码忽略了小数
[英]My simple javascript code for parseFloat is ignoring the decimals
纯JS字符计数器-为什么我的代码会忽略maxLength设置？
[英]Pure JS Character Counter - Why is my code Ignoring maxLength setting?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.