iT邦幫忙

2021 iThome 鐵人賽

DAY 20
0
Modern Web

Learn & Play JavaScript -- Entry-Level Front-End Web Development系列 第 20

#20 JS: Object Fundamentals

What is an Object?

point.x=3; //property
point.y=4;
point.getPosition=function(){ //method
    alert(this.x+","+this.y);
} ;

→ the result is 3,4

Use Object

point.getPosition();

→ call the function. So from the example above, we'll get "3,4"

Example: The score of an ideal trip

var trip=new Object();
trip.name="Couple Trip";
trip.score=70;
trip.outdoor=function(){ // Camping at outdoor so that we can enjoy natural environment.
    this.score=this.score+10;
};
trip.rainyDay=function(){ //Rainy day is a bit troublesome that we can't go hiking.
    this.score=this.score-5;
};
trip.snacksnBBQ=function(){ //Delicious food is always welcome!
    this.score=this.score+20;
};
trip.napping=function(){ //Chilled camping always needs a nap.
    this.score++;
};
trip.report=function(){ //
    alert(this.name+":"+this.score)
};

So at the end, the way we count the score of an ideal trip would be...

trip.outdoor(); 
trip.rainyDay(); 
trip.snacksnBBQ(); 
trip.napping(); 
trip.report(); 

→ The result is 96!
https://ithelp.ithome.com.tw/upload/images/20210919/20130362X62BkgAvUX.png

Music of Today: Here I Stand by The Shang

Yes


Like/Share/Follow

Feel free to comment and share your ideas below to learn together!
If you guys find this article helpful, please kindly do the writer a favor — LIKE this article./images/emoticon/emoticon12.gif


上一篇
#19 JS: Modified functions & how function create spaces
下一篇
#21 JS: Object - Constructors
系列文
Learn & Play JavaScript -- Entry-Level Front-End Web Development30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言