Dynamically access function object property

问题

I need to check if the value of multiple textareas is equal to the property name of this object :

function make_test(name, job, ID) {
  test = {};
  test.name = name;
  test.job = job;
  test.ID = ID;
  return test;
}
  new make_test("Paul", "manager", 1);  //doesn't work
  new make_test("John", "employee", 2); //doesn't work
  new make_test("Jan", "employee", 2);  //works

It should only be a match if the value is equal to the name and if the index of the textarea is equal to the person's ID. For instance if I type "Paul" in textarea1, it should output paul's job : but it should not output it in textarea2 which should only output the job of persons having an ID = 2.

Problem : my code only works for the last person declared (Jan in this example). It's like the other persons don't even exist in the object, except for the last one. How can I fix this ?

I'm sure the answer is pretty obvious but I can't figure out what I'm doing wrong.

Demo here : https://jsfiddle.net/Lau1989/hxcpstty/

Thanks for your help

回答1:

You need to declare test to be a local variable so all invocations of your function are not referring to the exact same global variable. When you don't declare your variable it becomes an implicit global variable which can lead to all sorts of problems. If you run your code in strict mode, the interpreter will flag this as an error for you too (which is generally helpful).

You also need to assign the return result from your function to a variable so you can reference the newly created object using that variable.

function make_test(name, job, ID) {
    var test = {};
 // ^^^
    test.name = name;
    test.job = job;
    test.ID = ID;
    return test;
}
var o1 = make_test("Paul", "manager", 1);
var o2 = make_test("John", "employee", 2);
var o3 = make_test("Jan", "employee", 2);

console.log(o1.name);   // "Paul"
console.log(o3.job);    // "employee"

You also don't need new in front of your function since you aren't using a system created object - you are just creating your own object and returning it. It will still work with new, but it is wasteful since you aren't using the object that the system will create with new.

If you want it to be an actual constructor function where you use new and could inherit the prototype, then do this:

function Make_test(name, job, ID) {
    this.name = name;
    this.job = job;
    this.ID = ID;
}

var o1 = new Make_test("Paul", "manager", 1);
var o2 = new Make_test("John", "employee", 2);
var o3 = new Make_test("Jan", "employee", 2);

Note, I used a capitalized constructor name here since it is a common convention to use initial cap names for constructor functions and initial lowercase names for regular functions.

You could also just remove the declaration entirely:

function make_test(name, job, ID) {
    return {name: name, job: job, ID: ID};
}

Or using ES6 syntax:

function make_test(name, job, ID) {
    return {name, job, ID};
}

来源：https://stackoverflow.com/questions/39968429/dynamically-access-function-object-property

标签

javascript

function

object

textarea

selectors-api