Class Lessons

To define a variable, type a one word name for the variable and use the equal (=) sign to set it equal to a value. A variable can be defined with numebers, strings, or booleans.

Once a variable is defined, mathematical expressions can be used on it.

Function

function Player(name, position, average) { // make a function 
    this.name = name; // different categories
    this.position = position;
    this.average = average;
    this.role = "";
}

Player.prototype.setRole = function(role) { // whatever input we put into roles, it will be stored.
    this.role = role;
}

Player.prototype.toJSON = function() {
    const obj = {name: this.name, position: this.position, average: this.average, role: this.role};
    const json = JSON.stringify(obj);
    return json;
}

var manager = new Player("Bob Melvin", "Catcher", ".233"); // new player, including all the categories
LogItType(manager);
LogItType(manager.toJSON());

manager.setRole("Manager");
LogItType(manager);
LogItType(manager.toJSON());

var players = [ // make a list, storing all the categories we had in the previous code segment. 
    new Player("Manny Machado", "Third Base", ".299"),
    new Player("Trent Grisham", "Center Field", ".185"),
    new Player("Jake Cronenworth", "Second Base", ".238"),
    new Player("Jurickson Profar", "Left Field", ".240"),
    new Player("Ha-Seong Kim", "Shortstop", ".252"),
    new Player("Brandon Drury", "First Base", ".226"),
    new Player("Jorge Alfaro", "Catcher", ".249"),
    new Player("Wil Myers", "Right Field, First Base", ".255"),
    new Player("Juan Soto", "Right Field", ".242"),
    new Player("Austin Nola", "Catcher", ".248"),
    new Player("Josh Bell", "Designated Hitter, First Base", ".191"),
    new Player("Jose Azocar", "Outfield", ".272"), 
];

function Padres(manager, players){ // new function in order to store the data

    manager.setRole("Manager");
    this.manager = manager;
    this.padres = [manager];
    
    this.players = players;
    this.players.forEach(player => { player.setRole("Player"); this.padres.push(player); });

    this.json = [];
    this.padres.forEach(player => this.json.push(player.toJSON()));
}

sd2022 = new Padres(manager, players); // this is how we will display it. 

LogItType(sd2022.padres);
LogItType(sd2022.padres[0].name);
LogItType(sd2022.json[0]);
LogItType(JSON.parse(sd2022.json[0]));

Padres.prototype._toHtml = function() { // display data in a table
    var style = (
        "display:inline-block;" +
        "border: 2px solid grey;" +
        "box-shadow: 0.8em 0.4em 0.4em grey;"
    );
    // set up the table

    var body = "";
    body += "<tr>";
    body += "<th><mark>" + "Name" + "</mark></th>";
    body += "<th><mark>" + "Position" + "</mark></th>";
    body += "<th><mark>" + "Batting Average" + "</mark></th>";
    body += "<th><mark>" + "Role" + "</mark></th>";
    body += "</tr>";
    
      // include the data in the table according to categories. 

    for (var row of sd2022.padres) {
        
        body += "<tr>";
        
        body += "<td>" + row.name + "</td>";
        body += "<td>" + row.position + "</td>";
        body += "<td>" + row.average + "</td>";
        body += "<td>" + row.role + "</td>";
        
        body += "<tr>";
      }
    
       // html format
      return (
        "<div style='" + style + "'>" +
          "<table>" +
            body +
          "</table>" +
        "</div>"
      );
    
    };
    
    
    $$.html(sd2022._toHtml());