การอ่านบทความนี้ต้องใช้ประสบการณ์การเขียนโปรแกรมในภาษาอื่น ๆ
ประเภทง่าย ๆ ใน JavaScript รวมถึง:
1. ตัวเลข
2. สตริง
3. บูลีน (จริงและเท็จ)
4. ไม่มี
5. ไม่ได้รับการกำหนด
ประเภทอื่น ๆ เป็นวัตถุ (เราไม่ควรสับสนกับค่าส่งคืนของตัวดำเนินการ typeof) ตัวอย่างเช่น:
1. ฟังก์ชั่น
2. อาเรย์
3. การแสดงออกปกติ
4. วัตถุ (วัตถุเป็นวัตถุตามธรรมชาติ)
พื้นฐานวัตถุ
ใน JavaScript วัตถุเป็นคอลเลกชันของคุณสมบัติ (วัตถุเป็นอาร์เรย์เชื่อมโยง) แต่ละคุณสมบัติรวมถึง:
1. ชื่อแอตทริบิวต์ต้องเป็นสตริง
2. ค่าแอตทริบิวต์อาจเป็นค่าใด ๆ นอกเหนือจากที่ไม่ได้กำหนด
สร้างวัตถุผ่านตัวอักษรวัตถุ:
การคัดลอกรหัสมีดังนี้:
// สร้างวัตถุเปล่าผ่านตัวอักษรตัวอักษร {}
var emport_object = {};
ชื่อแอตทริบิวต์และค่าแอตทริบิวต์ของวัตถุ:
การคัดลอกรหัสมีดังนี้:
var stande = {
// "First-Name" เป็นชื่อแอตทริบิวต์และ "เจอโรม" เป็นค่าแอตทริบิวต์
"ชื่อแรก": "เจอโรม"
// "Last-Name" เป็นชื่อแอตทริบิวต์และ "Howard" เป็นค่าแอตทริบิวต์
"ชื่อสุดท้าย": "ฮาวเวิร์ด"
-
หากชื่อแอตทริบิวต์เป็นตัวระบุทางกฎหมายเครื่องหมายใบเสนอราคาสามารถละเว้นได้:
การคัดลอกรหัสมีดังนี้:
var flight = {
สายการบิน: "มหาสมุทร",
หมายเลข: 815,
แผนก: {
IATA: "Syd",
เวลา: "2004-09-22 14:55"
เมือง: "ซิดนีย์"
-
การมาถึง: {
IATA: "LAX",
เวลา: "2004-09-23 10:42"
เมือง: "ลอสแองเจลิส"
-
-
มาดูตัวอย่างการเข้าถึงอสังหาริมทรัพย์:
การคัดลอกรหัสมีดังนี้:
var owner = {name: "name5566"};
เจ้าของชื่อ; // "name5566"
เจ้าของ ["ชื่อ"]; // "name5566"
เจ้าของ. job; // ไม่ได้กำหนด
เจ้าของ. job = "coder"; // หรือเจ้าของ ["Job"] = "Coder";
หากชื่อแอตทริบิวต์ไม่ใช่ตัวระบุทางกฎหมายจะต้องถูกห่อหุ้มด้วยเครื่องหมายคำพูด มูลค่าของคุณสมบัติที่ไม่มีอยู่นั้นไม่ได้กำหนดไว้ วัตถุจะถูกส่งผ่านโดยการอ้างอิงมากกว่าตามค่า:
การคัดลอกรหัสมีดังนี้:
var x = {};
VAR เจ้าของ = x;
owner.name = "name5566";
x.name; // x.name === "name5566"
ที่นี่ x และเจ้าของอ้างถึงวัตถุเดียวกัน
คุณลักษณะของวัตถุสามารถลบได้โดยใช้ตัวดำเนินการลบ:
การคัดลอกรหัสมีดังนี้:
ลบ obj.x; // ลบแอตทริบิวต์ x ของ Object OBJ
ต้นแบบของวัตถุ
แต่ละวัตถุเชื่อมโยงกับวัตถุต้นแบบและวัตถุสามารถสืบทอดแอตทริบิวต์จากวัตถุต้นแบบ เราสร้างวัตถุผ่านตัวอักษรออบเจ็กต์ซึ่งวัตถุต้นแบบเป็นวัตถุวัตถุ prototype (วัตถุ object.prototype เองไม่มีวัตถุต้นแบบ) เมื่อเราสร้างวัตถุเราสามารถตั้งค่าวัตถุต้นแบบของวัตถุ (จากนั้นพูดคุยเกี่ยวกับวิธีการตั้งค่าเฉพาะ) เมื่อพยายามที่จะได้รับ (ไม่แก้ไข) แอตทริบิวต์ของวัตถุหากวัตถุไม่มีอยู่ JavaScript พยายามที่จะได้รับแอตทริบิวต์จากวัตถุต้นแบบของวัตถุนี้หากไม่มีแอตทริบิวต์ดังกล่าวในวัตถุต้นแบบให้ค้นหาวัตถุต้นแบบของวัตถุต้นแบบนี้ เมื่อเทียบกับการได้รับแอตทริบิวต์เมื่อเราแก้ไขแอตทริบิวต์ของวัตถุมันจะไม่ส่งผลกระทบต่อวัตถุต้นแบบ
พื้นฐานการทำงาน
ฟังก์ชั่นยังเป็นวัตถุใน JavaScript ซึ่งเชื่อมโยงกับฟังก์ชันวัตถุต้นแบบ prototype (function.prototype ลิงก์ไปยัง Object.prototype) ฟังก์ชั่นมีคุณสมบัติที่ชื่อว่าต้นแบบและค่าของมันเป็นวัตถุ วัตถุนี้มีตัวสร้างคุณสมบัติและค่าของตัวสร้างคือฟังก์ชั่นนี้:
การคัดลอกรหัสมีดังนี้:
var f = function () {}
typeof f.prototype; // 'วัตถุ'
typeof f.prototype.constructor; // 'การทำงาน'
F === F.Prototype.Constructor; // จริง
ฟังก์ชั่นเป็นวัตถุคุณสามารถใช้ฟังก์ชั่นเช่นการใช้วัตถุนั่นคือฟังก์ชั่นสามารถบันทึกในตัวแปรและอาร์เรย์และสามารถส่งผ่านเป็นพารามิเตอร์ไปยังฟังก์ชั่นและฟังก์ชั่นสามารถกำหนดได้ภายในฟังก์ชั่น ในฐานะที่เป็นบันทึกด้านข้างฟังก์ชั่นมีคุณสมบัติที่ซ่อนอยู่สองประการ:
1. บริบทของฟังก์ชั่น
2. รหัสฟังก์ชั่น
ฟังก์ชั่นถูกสร้างขึ้นดังนี้:
การคัดลอกรหัสมีดังนี้:
var f = ฟังก์ชั่นเพิ่ม (a, b) {
ส่งคืน A + B;
-
console.log (f); // output [ฟังก์ชั่น: เพิ่ม]
ชื่อฟังก์ชั่นหลังจากฟังก์ชั่นคำหลักเป็นทางเลือก เรากำหนดชื่อฟังก์ชั่นเป็นหลักสำหรับวัตถุประสงค์หลายประการ:
1. สำหรับการโทรแบบเรียกซ้ำ
2. Debuggers, เครื่องมือการพัฒนา ฯลฯ ใช้เพื่อระบุฟังก์ชั่น
หลายครั้งที่เราไม่ต้องการชื่อฟังก์ชั่นและฟังก์ชั่นที่ไม่มีชื่อฟังก์ชั่นเรียกว่าฟังก์ชันที่ไม่ระบุชื่อ รายการพารามิเตอร์ถูกห่อด้วยวงเล็บ JavaScript ไม่จำเป็นต้องมีการจับคู่พารามิเตอร์จริงและพารามิเตอร์ที่เป็นทางการเช่น:
การคัดลอกรหัสมีดังนี้:
var add = function (a, b) {
ส่งคืน A + B;
-
เพิ่ม (1, 2, 3); // พารามิเตอร์จริงและพารามิเตอร์ที่เป็นทางการไม่ตรงกัน
หากมีพารามิเตอร์จริงมากเกินไปพารามิเตอร์จริงส่วนเกินจะถูกละเว้น หากมีพารามิเตอร์จริงน้อยเกินไปค่าของพารามิเตอร์ที่เป็นทางการที่ไม่ได้กำหนดจะไม่ได้กำหนด ฟังก์ชั่นจะต้องมีค่าส่งคืน หากไม่ได้ระบุค่าส่งคืนผ่านคำสั่ง Return ค่าคืนฟังก์ชันจะไม่ได้กำหนด
ฟังก์ชั่นและตัวแปรภายนอกที่เข้าถึงรูปแบบการปิด นี่คือเสน่ห์ที่สำคัญของ JavaScript
การเรียกใช้ฟังก์ชัน
เมื่อมีการเรียกแต่ละฟังก์ชันจะได้รับพารามิเตอร์เพิ่มเติมสองตัว:
1. นี่
2. ข้อตกลง
ค่าของสิ่งนี้เกี่ยวข้องกับรูปแบบการโทรที่เฉพาะเจาะจง มีรูปแบบการโทรสี่แบบใน JavaScript:
1. โหมดการเรียกใช้วิธี หากคุณสมบัติของวัตถุเป็นฟังก์ชั่นมันจะเรียกว่าวิธีการ หากมีการเรียกวิธีการผ่าน OM (args) นี่คือวัตถุ O (ซึ่งสามารถเห็นได้ว่าสิ่งนี้และ O จะถูกผูกไว้เฉพาะเมื่อมีการเรียก) ตัวอย่างเช่น:
การคัดลอกรหัสมีดังนี้:
var obj = {
ค่า: 0,
เพิ่มขึ้น: ฟังก์ชั่น (v) {
this.value += (typeof v === 'number'? v: 1);
-
-
obj.increment (); // this === obj
2. โหมดการเรียกใช้ฟังก์ชัน หากฟังก์ชั่นไม่ใช่คุณสมบัติของวัตถุมันจะถูกเรียกว่าเป็นฟังก์ชันและสิ่งนี้จะถูกผูกไว้กับวัตถุทั่วโลกเช่น:
การคัดลอกรหัสมีดังนี้:
Message = 'Hello World';
var p = function () {
console.log (this.message);
-
P (); // เอาท์พุท 'Hello World'
พฤติกรรมนี้บางครั้งสับสนดูตัวอย่าง:
การคัดลอกรหัสมีดังนี้:
obj = {
ค่า: 0,
เพิ่มขึ้น: function () {
var helper = function () {
// เพิ่ม 1 ลงในค่าในวัตถุทั่วโลก
this.value += 1;
-
// ผู้ช่วยเรียกว่าเป็นฟังก์ชัน
// ดังนั้นนี่จึงเป็นวัตถุระดับโลก
ผู้ช่วย ();
-
-
obj.increment (); // obj.value === 0
ผลลัพธ์ที่เราคาดหวังควรจะเป็น:
การคัดลอกรหัสมีดังนี้:
obj = {
ค่า: 0,
เพิ่มขึ้น: function () {
var that = this;
var helper = function () {
นั่นคือค่า += 1;
-
ผู้ช่วย ();
-
-
obj.increment (); // obj.value === 1
3. โหมดการโทรคอนสตรัคเตอร์ ฟังก์ชั่นที่ตั้งใจจะใช้คำนำหน้าใหม่เรียกว่าตัวสร้างตัวอย่างเช่น:
การคัดลอกรหัสมีดังนี้:
// การทดสอบเรียกว่าตัวสร้าง
VAR TEST = FUNCTION (String) {
this.message = String;
-
var mytest = การทดสอบใหม่ ("Hello World");
ฟังก์ชั่นสามารถเรียกได้ด้วยใหม่ (ฟังก์ชั่นดังกล่าวมักจะเริ่มต้นด้วยการพิมพ์ตัวพิมพ์ใหญ่) หลังจากเพิ่มใหม่วัตถุที่เชื่อมโยงกับคุณสมบัติต้นแบบของฟังก์ชั่นนี้จะถูกสร้างขึ้นและวัตถุนี้ในตัวสร้างคือวัตถุนี้
4. ใช้โหมดการโทร วิธีการใช้งานของฟังก์ชั่นใช้ในการเรียกใช้ฟังก์ชันซึ่งมีพารามิเตอร์สองพารามิเตอร์แรกคือสิ่งนี้และที่สองคืออาร์เรย์ของพารามิเตอร์ตัวอย่างเช่น:
การคัดลอกรหัสมีดังนี้:
var add = function (a, b) {
ส่งคืน A + B;
-
var ret = add.apply (null, [3, 4]); // ret === 7
เมื่อเรียกใช้ฟังก์ชั่นเราสามารถเข้าถึงอาร์เรย์ของคลาสที่เรียกว่าอาร์กิวเมนต์ (อาร์เรย์จาวาสคริปต์ที่ไม่ใช่จริง) ที่มีอาร์กิวเมนต์ทั้งหมดดังนั้นเราจึงสามารถใช้พารามิเตอร์ความยาวตัวแปร:
การคัดลอกรหัสมีดังนี้:
var add = function () {
var sum = 0;
สำหรับ (var i = 0; i <arguments.length; ++ i) {
sum += อาร์กิวเมนต์ [i];
-
ผลรวมกลับ;
-
เพิ่ม (1, 2, 3, 4);
ผิดปกติ
ตอนนี้มาพูดคุยเกี่ยวกับกลไกการจัดการข้อยกเว้นของ JavaScript เราใช้คำสั่งการโยนเพื่อโยนข้อยกเว้นและคำสั่ง try-cache เพื่อจับและจัดการข้อยกเว้น:
การคัดลอกรหัสมีดังนี้:
var add = function (a, b) {
if (typeof a! == 'number' || typeof b! == 'number') {
// โยนข้อยกเว้น
โยน {
ชื่อ: 'typeerror',
ข้อความ: 'เพิ่มความต้องการตัวเลข'
-
-
ส่งคืน A + B;
-
// จับและจัดการข้อยกเว้น
พยายาม {
เพิ่ม ("เจ็ด");
// e เป็นวัตถุข้อยกเว้นที่ถูกโยนทิ้ง
} catch (e) {
console.log (e.name + ':' + e.message);
-
เพิ่มคุณสมบัติให้กับประเภท JavaScript
ตัวสร้างมีอยู่ในประเภทส่วนใหญ่ใน JavaScript:
1. ตัวสร้างของวัตถุเป็นวัตถุ
2. ตัวสร้างของอาร์เรย์คืออาร์เรย์
3. ตัวสร้างของฟังก์ชั่นคือฟังก์ชั่น
4. ตัวสร้างของสตริงคือสตริง
5. ตัวสร้างของหมายเลขคือหมายเลข
6. ตัวสร้างของบูลีนคือบูลีน
7. ตัวสร้างของนิพจน์ทั่วไปคือ regexp
เราสามารถเพิ่มคุณสมบัติ (มักจะเพิ่มวิธีการ) ลงในต้นแบบของคอนสตรัคเตอร์เพื่อให้คุณสมบัตินี้พร้อมใช้งานสำหรับตัวแปรที่เกี่ยวข้อง:
การคัดลอกรหัสมีดังนี้:
number.prototype.integer = function () {
กลับมาคณิตศาสตร์ [สิ่งนี้ <0? 'Ceil': 'Floor'] (นี่);
-
(1.1) .integer (); // 1
ขอบเขต
JavaScript จำเป็นต้องสร้างขอบเขตผ่านฟังก์ชั่น:
การคัดลอกรหัสมีดังนี้:
การทำงาน() {
-
-
ฟังก์ชั่นที่ไม่ระบุชื่อถูกสร้างและดำเนินการที่นี่ ขอบเขตที่จะซ่อนตัวแปรที่คุณไม่ต้องการถูกเปิดเผย:
การคัดลอกรหัสมีดังนี้:
var obj = function () {
// ซ่อนค่าไม่สามารถเข้าถึงได้ภายนอก
var value = 0;
กลับ {
// เฉพาะวิธีนี้เท่านั้นที่สามารถแก้ไขค่าได้
เพิ่มขึ้น: function () {
ค่า += 1;
-
// เฉพาะวิธีนี้เท่านั้นที่สามารถอ่านค่าได้
getValue: function () {
ค่าส่งคืน;
-
-
-
obj.increment ();
obj.getValue () === 1;
สืบทอด
มีหลายวิธีในการใช้มรดกใน JavaScript
เมื่อสร้างวัตถุเราสามารถตั้งค่าวัตถุต้นแบบที่เกี่ยวข้องกับวัตถุและเราทำ:
การคัดลอกรหัสมีดังนี้:
// สร้างวัตถุ o ด้วยวัตถุต้นแบบ {x: 1, y: 2}
var o = object.create ({x: 1, y: 2});
method object.create ถูกกำหนดไว้ใน ECMASCRIPT 5. หากคุณใช้ ECMASCRIPT 3 คุณสามารถใช้วิธีการสร้างด้วยตัวเอง:
การคัดลอกรหัสมีดังนี้:
// หากไม่ได้กำหนดวิธีการสร้าง object.create
if (typeof object.create! == 'function') {
// สร้าง method object.create
Object.create = function (o) {
var f = function () {};
f.prototype = o;
// สร้างวัตถุใหม่วัตถุต้นแบบของวัตถุนี้คือ o
คืน F () ใหม่;
-
-
ด้วยวิธีการสร้างวัตถุเราทำการสืบทอดการสืบทอดตามต้นแบบ: วัตถุใหม่โดยตรงสืบทอดคุณสมบัติของวัตถุเก่า (เทียบกับการสืบทอดแบบคลาสไม่จำเป็นต้องมีอยู่ของคลาสที่นี่และวัตถุสืบทอดวัตถุโดยตรง) ตัวอย่าง:
การคัดลอกรหัสมีดังนี้:
var mymammal = {
ชื่อ: 'สมุนไพรสัตว์เลี้ยงลูกด้วยนม'
get_name: function () {
ส่งคืนสิ่งนี้ชื่อ;
-
พูดว่า: function () {
ส่งคืนสิ่งนี้การพูด || -
-
-
// มรดก mymammal
var mycat = object.create (mymammal);
mycat.name = 'Henrietta';
mycat.saying = 'meow';
mycat.purr = function (n) {
var i, s = '';
สำหรับ (i = 0; i <n; i += 1) {
ถ้า (s) {
s += '-';
-
s += 'r';
-
กลับ s;
-
mycat.get_name = function () {
return this.says () + '' this.name + '' + this.says ();
-
รหัสข้างต้นนั้นง่าย แต่ไม่สามารถปกป้องสมาชิกส่วนตัวได้ เราสามารถใช้โหมดโมดูล ในโหมดโมดูลวัตถุบางประเภทถูกสร้างขึ้นโดยฟังก์ชั่นและใช้ขอบเขตฟังก์ชันเพื่อปกป้องสมาชิกส่วนตัวจากการเข้าถึงภายนอก:
การคัดลอกรหัสมีดังนี้:
// ฟังก์ชั่นของสัตว์เลี้ยงลูกด้วยนมใช้ในการสร้างวัตถุเลี้ยงลูกด้วยนม
var mammal = function (spec) {
// นั่นคือวัตถุที่สร้างขึ้น
var that = {};
// วิธีการสาธารณะ get_name สามารถเข้าถึงภายนอกได้
That.get_name = function () {
// spec.name ไม่สามารถเข้าถึงได้โดยตรงจากภายนอก
return spec.name;
-
// วิธีการสาธารณะบอกว่าสามารถเข้าถึงภายนอกได้
that.says = function () {
// spec.saying ไม่สามารถเข้าถึงภายนอกได้โดยตรง
Return spec.saying || -
-
กลับมา;
-
// สร้างวัตถุเลี้ยงลูกด้วยนม
var mymammal = mammal ({ชื่อ: 'Herb'});
// ฟังก์ชั่นแมวใช้ในการสร้างวัตถุแมว
var cat = function (spec) {
spec.saying = spec.saying || 'meow';
// แมวสืบทอดมาจากสัตว์เลี้ยงลูกด้วยนมดังนั้นก่อนอื่นสร้างวัตถุเลี้ยงลูกด้วยนม
var that = mammal (spec);
// เพิ่มวิธีการสาธารณะ
that.purr = function (n) {
var i, s = '';
สำหรับ (i = 0; i <n; i += 1) {
ถ้า (s) {
s += '-';
-
s += 'r';
-
กลับ s;
-
// แก้ไขวิธีการสาธารณะ get_name
That.get_name = function () {
return that.says () + '' + spec.name +
'' + that.says ();
กลับมา;
-
-
// สร้างวัตถุแมว
var mycat = cat ({ชื่อ: 'henrietta'});
ในโหมดโมดูลการสืบทอดสามารถทำได้โดยการเรียกตัวสร้าง นอกจากนี้เรายังสามารถเข้าถึงวิธีการของคลาสแม่ในคลาสย่อย:
การคัดลอกรหัสมีดังนี้:
Object.prototype.superior = function (ชื่อ) {
var that = this, method = นั้น [ชื่อ];
return function () {
วิธีการส่งคืนใช้งาน (นั่น, อาร์กิวเมนต์);
-
-
var coolcat = function (spec) {
// รับเมธอด get_name ของคลาสย่อย
var that = cat (spec), super_get_name = that.superior ('get_name');
That.get_name = function (n) {
return 'Like' + super_get_name () + 'baby';
-
กลับมา;
-