私の未亡人のダニ:JavaScriptで

“Truly I tell you, this poor widow has put more into the treasury than all the others.
They all gave out of their wealth; but she, out of her poverty, put in everything— all she had to live on.”

Mark 12: 43-44

let person = {
    name: 'Richard Doe',
    job: 'Farming',
    jobFunction: function () {
      console.log(`${this.name}'s occupation is ${this.job}`);
    },
  };
  person.jobFunction(); //Richard Doe's occupation is Farming

  // But of course this would also work
  let person = {
    name: 'Richard Doe',
    job: 'Farming',
    jobFunction: function () {
      console.log(`${person.name}'s occupation is ${person.job}`);
    },
  };
  person.jobFunction(); //Richard Doe's occupation is Farming

ゴチャ

グローバルスコープ

  // in the global scope
function print() {
    this.color = 'purple';
    console.log(this.color);
  }
  print(); //purple

 function print() {
    'use strict';
    this.color = 'purple';
    console.log(this.color);
  }
  print();//Cannot set property 'color' of undefined

 // here is an object with a clickhandler method that is called when a button is clicked
  var person = {
    farmers: [{ name: 'Richard Doe', job: 'Farmer' }],
    clickHandler: function () {
      console.log(`${this.farmers[0].name} is a ${this.farmers[0].job}`);
    },
  };
  let button = document.getElementById('button'); //button here is an object
  button.addEventListener('click', person.clickHandler); //the click() method here is a method on the button object and
  // Cannot read property '0' of undefined because there is no farmers property on the button object

 // An alternative approach
  var person = {
    farmers: [{ name: 'Richard Doe', job: 'Farmer' }],
    clickHandler: function () {
      console.log(`${this.farmers[0].name} is a ${this.farmers[0].job}`);
    },
  };
  let button = document.getElementById('button'); //button here is an object
  button.addEventListener('click', person.clickHandler.bind(person)); //the click() method here is a method on the button object and
  //Richard Doe is a Farmer

  var person = {
    farmersMotto: 'Farming is our pride',
    farmers: [
      { name: 'Richard Doe', job: 'Farmer' },
      { name: 'Rachael Doe', job: 'Farmer' },
    ],
    clickHandler: function () {
      this.farmers.forEach(function () {
        console.log(`Our motto as farmers is ${this.farmersMotto}`); //Our motto as farmers is undefined
        //why?
        console.log('' + this); // [object window]
      });
    },
  };
  person.clickHandler();

 var person = {
    farmersMotto: 'Farming is our pride',
    farmers: [
      { name: 'Richard Doe', job: 'Farmer' },
      { name: 'Rachael Doe', job: 'Farmer' },
    ],
    clickHandler: function () {
      var thisPerson = this;
      this.farmers.forEach(function () {
        console.log(`Our motto as farmers is: ${thisPerson.farmersMotto}`); //Our motto as farmers is: Farming is our pride
      });
    },
  };
  person.clickHandler();

  // This data variable is a global variable
  var farmers = [{ name: 'Rachael Doe', job: 'Farming' }];

  var person = {
    // this data variable is a property on the Person object
    farmers: [{ name: 'Richard Doe', job: 'Farming' }],
    showData: function (event) {
      console.log(`${this.farmers[0].name}'s job is ${this.farmers[0].job}`);
    },
  };

  // Assign the person.showData to a variable
  var showPersonsData = person.showData;

  //
  showPersonsData(); // Rachael Doe's job is Farming (from the global data array)
  //The output we desire is: Richard Doe's job is Farming. 
  //so how do we fix this?

  // This data variable is a global variable
  var farmers = [{ name: 'Rachael Doe', job: 'Farming' }];

  var person = {
    // this data variable is a property on the Person object
    farmers: [{ name: 'Richard Doe', job: 'Farming' }],
    showData: function (event) {
      console.log(`${this.farmers[0].name}'s job is ${this.farmers[0].job}`);
    },
  };

  // Assign the person.showData to a variable
  var showPersonsData = person.showData.bind(person);

  //
  showPersonsData(); // Richard Doe's job is Farming (from the global data array)

ファイナルノート

In everything I did, I showed you that by this kind of hard work we must help the weak, remembering the words the Lord Jesus himself said: ‘It is more blessed to give than to receive.

Act 20:35