Question

我有一个名为employee的对象，其getter和setter是否可以很好地定义和实现？

如何在我的函数Javascript列表中访问对象Person的值，以便在动态表中显示它？

var operations = {

   init: function() {
      console.log("init");
      operations.setupButton();
   },
   setupButton: function() {
      $("#btnList").on("click", operations.list);
   },
   list: function() {

      var table = $("#tblEmployee");
      var strHtml = "";


      var emp = new employee();
      // load my jsp table
      strHtml += '<tr>';

      strHtml += '<td>' + emp.getName + '</td>';
      strHtml += '<td>' + emp.getAge + '</td>';
      strHtml += '<td>' + emp.getSalary + '</td>';

      strHtml += '<tr>';

      tabla.append(strHtml);
   }
};

var employee = {

   name: 'Jean',
   age: 22,
   salary: 8000000,

   getName() {
      return this.name;
   },
   getAge() {
      return this.age;
   },
   getSalary() {
      return this.salary;
   }
};
$(document).ready(operations.init);

Answer 1

我修改了你的代码。我不确定这是不是你需要的。检查出来并在必要时更新jsFiddle。

example code in JsFiddle

    function employee() {
   this.name = 'Jean';
   this.age = 22;
   this.salary = 8000000;

   this.getName = function() {
      return this.name;
   }
};

var operations = {
    init: function() {
        console.log("init");
        operations.setupButton();
   },
   list: function() {
      var table = $("#tblEmployee");
      var strHtml = "";
      var emp = new employee();
      strHtml += '<tr>';
      strHtml += '<td>' + emp.getName() + '</td>';
      strHtml += '</tr>';
      table.append(strHtml);
    },
    setupButton: function() {
        $("#btnList").on("click", operations.list);
    }      
};

$(document).ready(operations.init);

Answer 2

有两种方法可以设想Employee，具体取决于您可以假设的 ECMAScript 版本。

ES6或更高版本，您可以编写类。 （这是ES5方式的语法糖，我以后会介绍）

class Employee {
    constructor(name = 'Jean', age = 22, salary = 8000000) { // ES6 supports param defaults
        Object.assign(this, {
            name,
            age,
            salary
        });
    }
    // These functions will be inherited by and shared by all instances of Employee
    getName() {
        return this.name;
    }
    getAge() {
        return this.age;
    }
    getSalary() {
        return this.salary;
    }
}

ES5或更低版本，使用构造函数和原型继承。对于 JavaScript 如何真正实现结构

更为真实

function Employee(name, age, salary) {
    if (typeof name === 'undefined') name = 'Jean'; // ES5 requires manual default setting
    if (typeof age === 'undefined') age = 22;
    if (typeof salary === 'undefined') salary = 8000000;
    this.name = name;
    this.age = age;
    this.salary = 8000000;
}
// These functions will be inherited by and shared by all instances of Employee
Employee.prototype.getName = function getName() {
    return this.name;
};
Employee.prototype.getAge = function getAge() {
    return this.age;
};
Employee.prototype.getSalary = function getSalary() {
    return this.salary;
};

两种情况下的用法，

new Employee(); // Employee {name: 'Jean', age: 22, salary: 8000000}

Answer 3

你有一些印刷错误并做错了

function Employee(){

   name = 'Jean';
   age  = 22;
   salary: 8000000;

   getName = function() {
      return this.name;
   }
   
   getAge = function() {
      return this.age;
   }
   
   getSalary = function() {
      return this.salary;
   }
};

var operations = {

   init: function() {
      console.log("init");
      operations.setupButton();
   },
   setupButton: function() {
      $("#btnList").on("click", operations.list);
   },
   list: function() {

      var table = $("#tblEmployee");
      var strHtml = "";


      var emp = new Employee();
      // load my jsp table
      strHtml += '<tr>';

      strHtml += '<td>' + emp.getName + '</td>';
      strHtml += '<td>' + emp.getAge + '</td>';
      strHtml += '<td>' + emp.getSalary + '</td>';

      strHtml += '<tr>';

      table.append(strHtml);
   }
};

$(document).ready(operations.init);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<table id="tblEmployee">
  <tbody>
  </tbody>
</table>
<button id="btnList">List</button>

在这里查看错误：

Javascript "Not a Constructor" Exception while creating objects

如何在Javascript中调用和创建AN对象？

3 个答案: