JSFiddle - React, Tailwind, and code Playground

by Wentz Wu

HTML

<ul id="list"></ul>

JavaScript

var jack = {
    name: "jack",
    age: 30
};

var bill = {
    name: "bill",
    age: 20,
    getName: getName
};

function getName() {
    return this.name;
}

function addAge(years) {
    return this.age + years;
}

function addYears() {
    var years = arguments;
    for (var year in years){
        this.age += years[year];
    }
    return this.age;
}

output(bill.getName());

//creates a new function
var getNameOfJack = getName.bind(jack); 
output(getNameOfJack());

//calls with a given "this" and individual arguments.
output(addAge.call(jack, 1));

//calls with a given "this" and arguments as an array
var years = [1,3,5];
output(addYears.apply(jack, years));


/*********helpers*********/
function output(item) {
    var list = document.getElementById("list");
    var listItem = document.createElement("li");
    listItem.textContent = item;
    list.appendChild(listItem);
}