Suche in Objekt innerhalb Array

Question

Ich versuche, eine Art von Login-System zu hardcodieren, dafür habe ich versucht, zwei Eingaben zu haben und beim Klick überprüfen, ob diese Werte denen im Array, das Array mit zwei Objekten für zwei mögliche Antworten ...

Nun, ich kann es nicht alle der Suden meiner Variablen zu arbeiten, werden nicht erkannt und der gesamte Code ist kaput gegangen ... hier ist der Pen

dank im Voraus!

der Code so weit btw

$(".submit").click(function() { 

//bidimensional array 
var data = [{ 
    user: "cinco", 
    pw: "king" 
}, { 
    user: "manco", 
    pw: "wawa" 
}]; 
var name = $(".name").val(); 
var pass = $(".pw").val(); 

if (data.user.includes(name) && data.pw.includes(pass)) { 
    $(".check-input").addClass('valid'); 
} else { 
    $(".check-input").addClass('invalid'); 
    } 
}); 

$(".input").focus(function() { 
    $(".check-input").removeClass("valid"); 
    $(".check-input").removeClass("invalid"); 
}); 

Answer 1

Sie find() wie diese

if (data.find(v => v.user === name && v.pw === pass)) { ... } 

verwenden Bitte beachten Sie, dass Ihre Login mit Javascript sehr unsicher ist, wie jeder nur die Konsole öffnen und lesen Sie die Referenzen.

für Ihren Kommentar, der => ist Teil eines arrow function, kocht es auf

if (data.find(function(v) { 
    return v.user === name && v.pw === pass; 
})) { ... } 

Answer 2

var data = [{ 
    user: "cinco", 
    pw: "king" 
}, { 
    user: "manco", 
    pw: "wawa" 
}]; 

checkLogin(usr, pwd){ 
    for(var index in data) { 
    var obj = data[index]; 
    if(obj.user == usr && obj.pw == pwd) { 
    return true; 
    } 
    } 
    return false; 
} 

checkLogin('chino', 'wrongPwd'); // returns false 
checkLogin('chino', 'king'); // returns true 

Answer 3

Sie müssen die einzelnen Objekte im Array zugreifen und erhalten die user und pw Eigenschaften von denen, Objekte. Das Array selbst verfügt nicht über diese Eigenschaften.

Hier ist eine Arbeitsversion, die Ihr Code auch rationalisiert:

$(".submit").click(function() { 
 

 
\t // This is not a bidimensional array. It's just an array of objects 
 
\t var data = [{ 
 
\t \t user: "cinco", 
 
\t \t pw: "king" 
 
\t }, { 
 
\t \t user: "manco", 
 
\t \t pw: "wawa" 
 
\t }]; 
 
    
 
\t var name = $(".name").val(); 
 
\t var pass = $(".pw").val(); 
 

 
    // You need to access the individual objects in the array and get 
 
    // the user and pw properties of those objects. The array itself 
 
    // doesn't have those properties. 
 
    
 
    // Loop through the array and check each object 
 
    // You can't return from a forEach loop, so we'll set up a variable 
 
    // that will be used after the loop is complete 
 
    var valid = false; 
 
    data.forEach(function(obj){ 
 
    // Don't check for inclusion of the data, check for exact match 
 
    \t if (obj.user === name && obj.pw === pass) { 
 
\t  valid = true; 
 
\t } 
 
    }); 
 
    
 
    // Now that the loop is done, set the validity 
 
    $(".check-input").addClass(valid ? 'valid' : 'invalid'); 
 
    
 
}); 
 

 
$(".input").focus(function() { 
 
\t $(".check-input").removeClass("valid"); 
 
\t $(".check-input").removeClass("invalid"); 
 
});

.check-input{ 
 
\t width:250px; 
 
\t height:40px; 
 
\t background-color:gray; 
 

 
} 
 
.valid{ 
 
\t background-color:green; 
 
} 
 

 
.invalid{ 
 
\t background-color:crimson; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" class="input name"> 
 
<input type="text" class="input pw"> 
 
<button class="submit">Submit</button> 
 
<div class="check-input"></div>