นี่เป็นคำหลักที่สำคัญในภาษาที่มุ่งเน้นวัตถุ JavaScript สิ่งนี้แตกต่างจากภาษาที่มุ่งเน้นวัตถุประสงค์เช่น Java และ C#ซึ่งทำให้สิ่งนี้สับสนและสับสนมากขึ้น
สิ่งนี้ใช้อะไร:
1. ฟังก์ชั่นบริสุทธิ์
2. การโทรวิธีวัตถุ
3. ใช้ใหม่เพื่อเรียกตัวสร้าง
4. ฟังก์ชั่นภายใน
5. ใช้การโทร / สมัคร
6. การผูกเหตุการณ์
1. ฟังก์ชั่นบริสุทธิ์
คัดลอกรหัสรหัสดังนี้:
var name = 'นี่คือหน้าต่าง';
ฟังก์ชั่น getName () {
console.log (สิ่งนี้);
console.log (this.name);
-
getName ();
การวิเคราะห์ผลการทำงาน: สิ่งนี้ในฟังก์ชั่นบริสุทธิ์ชี้ไปที่วัตถุทั่วโลกหน้าต่าง
2. การโทรวิธีวัตถุ
คัดลอกรหัสรหัสดังนี้:
var name = 'นี่คือหน้าต่าง';
var testobj = {
ชื่อ: 'นี่คือ testobj'
getName: function () {
console.log (สิ่งนี้);
console.log (this.name);
-
-
testobj.getName ();
รันผลลัพธ์การวิเคราะห์: สิ่งนี้ชี้ไปที่วัตถุที่เรียกวิธีการ
3. ใช้ใหม่เพื่อเรียกตัวสร้าง
คัดลอกรหัสรหัสดังนี้:
ฟังก์ชั่น getObj () {
console.log (นี้);
-
ใหม่ getobj ();
การวิเคราะห์ผลลัพธ์: สิ่งนี้ในตัวสร้างใหม่ชี้ไปที่วัตถุที่สร้างขึ้นใหม่
4. ฟังก์ชั่นภายใน
คัดลอกรหัสรหัสดังนี้:
var name = "นี่คือหน้าต่าง";
var testobj = {
ชื่อ: "นี่คือ testobj"
getName: function () {
// var seelf = this;
var ahandle = function () {{)
console.log (สิ่งนี้);
console.log (this.name);
//console.log (set);
-
รับมือ ();
-
-
testobj.getName ();
เรียกใช้การวิเคราะห์ผลลัพธ์: สิ่งนี้ในฟังก์ชั่นภายในยังคงชี้ไปที่หน้าต่างส่วนกลางหน้าต่าง โดยทั่วไปถือว่าเป็นข้อผิดพลาดในการออกแบบในภาษา JavaScript เพราะไม่มีใครต้องการชี้สิ่งนี้ในฟังก์ชั่นภายในไปยังวัตถุทั่วโลก วิธีการประมวลผลทั่วไปคือการบันทึกสิ่งนี้เป็นตัวแปรและโดยทั่วไปจะตกลงกันว่าเป็นตัวเองหรือตัวเองดังที่แสดงในรหัสข้างต้น
5. ใช้การโทร / สมัคร
คัดลอกรหัสรหัสดังนี้:
var name = 'นี่คือหน้าต่าง';
var testobj1 = {
ชื่อ: 'นี่คือ testobj1'
getName: function () {
console.log (นี่);
console.log (this.name);
-
-
var testobj2 = {
ชื่อ: 'นี่คือ testobj2'
-
testobj1.getName.apply (testobj2);
testobj1.getName.call (testobj2);
หมายเหตุ: ใช้และการโทรมีความคล้ายคลึงกัน แต่พารามิเตอร์ที่สองของทั้งสองนั้นแตกต่างกัน:
[1] การโทร (thisarg [, arg1, arg2, ... ]);
[2] ใช้ (thisarg [, argarray]);
การวิเคราะห์ผลลัพธ์การรัน: สิ่งนี้ใช้ในฟังก์ชั่นการโทร / ใช้เพื่อชี้ไปที่วัตถุที่มีผลผูกพัน
6. การผูกเหตุการณ์
วิธีนี้ในวิธีการเหตุการณ์ควรเป็นสถานที่ที่น่าสงสัยที่สุดข้อผิดพลาดส่วนใหญ่เกิดจากสิ่งนี้
คัดลอกรหัสรหัสดังนี้:
// หน้าสำหรับการเชื่อมโยงกับองค์ประกอบ
<script type = "text/javascript">
ฟังก์ชั่น btclick () {
console.log (สิ่งนี้);
-
</script>
<body>
<button id = "btn" onclick = "btclick ();"> คลิก </button>
</body>
คัดลอกรหัสรหัสดังนี้:
// วิธีการผูกมัด JS (1)
<body>
<button id = "btn"> คลิก </button>
</body>
<script type = "text/javascript">
ฟังก์ชั่น btclick () {
console.log (นี่);
-
document.getElementById ("BTN")
document.getElementById ("BTN")
</script>
คัดลอกรหัสรหัสดังนี้:
// วิธีการผูกมัด JS (2)
<body>
<button id = "btn"> คลิก </button>
</body>
<script type = "text/javascript">
document.getElementById ("btn")
console.log (นี่);
-
document.getElementById ("BTN")
</script>
คัดลอกรหัสรหัสดังนี้:
// วิธีการผูกมัด JS (3)
<body>
<button id = "btn"> คลิก </button>
</body>
<script type = "text/javascript">
ฟังก์ชั่น btclick () {
console.log (นี่);
-
document.getElementById ("BTN") วิธีการ (วิธีการ (วิธีการ (วิธี) เมื่อใช้ในการจัดการเหตุการณ์
document.getElementById ("BTN")
</script>
การวิเคราะห์ผลการรัน: วิธีการผูกมัดเหตุการณ์ทั่วไปสองวิธีข้างต้นการเชื่อมโยงเหตุการณ์ในองค์ประกอบหน้านอกเหนือจากวิธีการเชื่อมโยงเหตุการณ์ซึ่งชี้ไปที่องค์ประกอบ elment ของเหตุการณ์ที่มีผลผูกพัน