Viewing: zh.javascript.info

          let user = {
  name: "John",
  age: 30
};
        

JavaScript action

user hello

let user = {
  name: "John",
  age: 30
};

user.sayHi = function() {
  alert("Hello!");
};

user.sayHi(); // Hello!

user.sayHi

user.sayHi()

user sayHi

let user = {
  // ...
};

// 
function sayHi() {
  alert("Hello!");
}

// 
user.sayHi = sayHi;

user.sayHi(); // Hello!

OOP

OOP E. GammaR. HelmR. Johnson J. Vissides G. Booch

          // 

user = {
  sayHi: function() {
    alert("Hello");
  }
};

// 
let user = {
 sayHi() { //  "sayHi: function(){...}" 
    alert("Hello");
  }
};
        

"function" sayHi()

this

user.sayHi() user name

this

this

let user = {
  name: "John",
  age: 30,

  sayHi() {
    // "this" 
    alert(this.name);
  }

};

user.sayHi(); // John

user.sayHi() this user

this

          let user = {
  name: "John",
  age: 30,

  sayHi() {
  alert(user.name); // "user"  "this"
  }

};
        

user admin = user user

let user = {
  name: "John",
  age: 30,

  sayHi() {
  alert( user.name ); // 
  }

};


let admin = user;
user = null; // 

admin.sayHi(); // TypeError: Cannot read property 'name' of null

alert this.name user.name

this

JavaScript this JavaScript this

          function sayHi() {
  alert( this.name );
}
        

this

this

let user = { name: "John" };
let admin = { name: "Admin" };

function sayHi() {
  alert( this.name );
}

// 
user.f = sayHi;
admin.f = sayHi;

//  this 
//  "this" 
user.f(); // Johnthis == user
admin.f(); // Adminthis == admin

admin['f'](); // Admin

obj.f() this f obj this user admin

function sayHi() {
  alert(this);
}

sayHi(); // undefined

this undefined this.name

this window "use strict"

this

this this

JavaScript this

this

this

this thisthis

arrow() this user.sayHi()

let user = {
  firstName: "Ilya",
  sayHi() {
    let arrow = () => alert(this.firstName);
    arrow();
  }
};

user.sayHi(); // Ilya

this

object.doSomething()
this

this

this this
object.method() this object

this this

"this"

makeUser

ref

          function makeUser() {
  return {
    name: "John",
    ref: this
  };
}

let user = makeUser();

alert( user.ref.name ); // 
        

function makeUser() {
  return {
    name: "John",
    ref: this
  };
}

let user = makeUser();

alert( user.ref.name ); // Error: Cannot read property 'name' of undefined

this

makeUser() this undefined

this

ref: this this

undefined this

function makeUser(){
  return this; // 
}

alert( makeUser().name ); // Error: Cannot read property 'name' of undefined

alert( makeUser().name ) alert( user.ref.name )

function makeUser() {
  return {
    name: "John",
    ref() {
      return this;
    }
  };
}

let user = makeUser();

alert( user.ref().name ); // John

user.ref() this .

calculator

read() a b
sum()
mul()

          let calculator = {
  // 
};

calculator.read();
alert( calculator.sum() );
alert( calculator.mul() );
        

demo

let calculator = {
  sum() {
    return this.a + this.b;
  },

  mul() {
    return this.a * this.b;
  },

  read() {
    this.a = +prompt('a?', 0);
    this.b = +prompt('b?', 0);
  }
};

calculator.read();
alert( calculator.sum() );
alert( calculator.mul() );

ladder

          let ladder = {
  step: 0,
  up() {
    this.step++;
  },
  down() {
    this.step--;
  },
  showStep: function() { //  step
    alert( this.step );
  }
};
        

          ladder.up();
ladder.up();
ladder.down();
ladder.showStep(); // 1
ladder.down();
ladder.showStep(); // 0
        

updown showStep

ladder.up().up().down().showStep().down().showStep(); //  1 0

JavaScript

let ladder = {
  step: 0,
  up() {
    this.step++;
    return this;
  },
  down() {
    this.step--;
    return this;
  },
  showStep() {
    alert( this.step );
    return this;
  }
};

ladder.up().up().down().showStep().down().showStep(); //  1 0

          ladder
  .up()
  .up()
  .down()
  .showStep() // 1
  .down()
  .showStep(); // 0
        