This ใน JavaScript
มันคืออะไรกันแน่ !?

Developer Team
BorntoDev Co., Ltd.

การเขียนโปรแกรมนั้นการอ้างอิงข้อมูลต่างๆนอกจากการเรียกด้วยชื่อตัวแปร การใช้ this ก็เป็น keyword ที่หลายๆภาษาใช้กัน โดยที่ this นั้นโดยทั่วไปแล้วจะเป็นการเรียกถึง object ที่เป็นเจ้าของของมัน โดยในภาษา JavaScript เองก็มี this เช่นกัน และในภาษานี้มีการใช้งาน this แบบไหนบ้าง และสามารถนำไปใช้งานอย่างไรได้บ้าง ไปดูกันเลยยย!

การใช้ this เปล่าๆ

ถ้าเราใช้ this เปล่าๆเจ้าของของมันก็คือ global ซึ่งใน browser global object ก็คือ Window นั่นเอง ถ้าเราลอง console.log บน browser ก็จะได้ออกมาประมาณนี้

การใช้ในfuntion

การใช้ใน function เราก็จะได้ออกมาเป็น window เหมือนเดิม เพราะ window คือ global ที่สั่งให้ function ทำงานอยู่

แต่ถ้าเราประกาศตัวแปรที่มี function Thisis() เป็นสมาชิกใน object แล้วเรียกดูก็จะได้ออกมาไม่เหมือนเดิมเพราะตอนนี้เจ้าของของมันคือ object ที่ชื่อว่า imFree

โดยเราสามารถทำได้อีกวิธีคือการใช้ bind ซึ่งจะเป็นการประกาศ function ที่เป็นเจ้าของ this

call()

call เป็น method ของ JavaScript ที่สามารถใส่ object เป็น argument ของ function และยังสามารถเติม argument เพิ่มเติมได้ด้วย

apply()

apply นั้นจะคล้ายกับ call แต่จะเปลี่ยนจากการรับค่าแยกต่างหากเป็นการรับค่าเป็น array แทน

“new” keyword

เราสามารถใช้ new เพื่อสร้าง object ใหม่โดยที่ this จะไปผูกไว้ได้โดยอัตโนมัติ ซึ่งเราจะสามารถใช้ในการสร้าง property และ method ได้เหมือนกับภาษาอื่นๆ

 การใช้กับ arrow function

การใช้ this กับ arrow function ของ JavaScript นั้นจะไม่เหมือนกับการประกาศ function แบบปกติเพราะมันจะไม่ผูกกับ object ตัวนั้นแต่จะยังผูกกับ global อยู่

แต่ถ้าเรายังสามารถใช้กับ object ที่ถูก new ได้ปกติผ่าน constructor function

chain function

เรายังสามารถ return this เพื่อนำมาใช้สำหรับทำ chain function ได้แบบนี้

บทความนี้อ้างอิงข้อมูลจากวีดีโอด้านล่างนี้

หากคุณสนใจพัฒนา สตาร์ทอัพ แอปพลิเคชัน และ เทคโนโลยีของตัวเอง ?

อย่ารอช้า ! เรียนรู้ทักษะด้านดิจิทัลเพื่ออัพเกรดความสามารถของคุณ
เริ่มตั้งแต่พื้นฐาน พร้อมปฏิบัติจริงในรูปแบบหลักสูตรออนไลน์วันนี้