ใน JavaScript วัตถุถูกกำหนดให้เป็น "คอลเลกชันของแอตทริบิวต์ที่ไม่ได้เรียงลำดับซึ่งคุณสมบัติสามารถมีค่าพื้นฐานวัตถุหรือฟังก์ชั่น" ในแง่ของคนธรรมดาเราสามารถเข้าใจวัตถุเป็นชุดของคู่ชื่อชื่อซึ่งค่าสามารถเป็นข้อมูลหรือฟังก์ชั่น
โดยปกติจะมีสองวิธีในการสร้างวัตถุที่กำหนดเอง ประการแรกคือการสร้างอินสแตนซ์ของวัตถุจากนั้นเพิ่มคุณสมบัติและวิธีการลงไปเช่น:
var person = new Object (); person.name = "Scott"; person.age = 24; person.sayname = function () {Alert (person.name); -วิธีที่สองคือวิธีการตามตัวอักษรวัตถุ โดยทั่วไปขอแนะนำให้ใช้วิธีนี้เพื่อสร้างวัตถุตัวอย่างเช่น:
var person = {ชื่อ: "Scott", อายุ: 24, sayname: function () {Alert (this.name); -ประเภทแอตทริบิวต์
มีคุณสมบัติที่แตกต่างกันสองประการที่กำหนดไว้ใน JavaScript: คุณสมบัติข้อมูลและคุณสมบัติของอุปกรณ์เสริม โดยทั่วไปแล้วคุณลักษณะข้อมูลจะใช้ในการจัดเก็บค่าข้อมูลในขณะที่แอตทริบิวต์ accessor โดยทั่วไปจะดำเนินการรับ/ตั้งค่าและไม่สามารถจัดเก็บค่าข้อมูลโดยตรง ใน ES5 เรากำหนดคุณลักษณะเพื่ออธิบายคุณสมบัติต่าง ๆ ของคุณสมบัติ ใน JavaScript เราไม่สามารถเข้าถึงคุณสมบัติได้โดยตรงดังนั้นเราจึงใส่ไว้ในวงเล็บสี่เหลี่ยมสองคู่เช่น [[enumerable]]
•คุณสมบัติข้อมูล
คุณลักษณะข้อมูลส่วนใหญ่อธิบายพฤติกรรมของพวกเขา:
1. [[กำหนดค่า]]: ค่าเริ่มต้นเป็นจริง บ่งชี้ว่าสามารถลบแอตทริบิวต์เพื่อกำหนดแอตทริบิวต์ใหม่ได้ไม่ว่าจะเป็นคุณสมบัติของแอตทริบิวต์หรือไม่หรือแอตทริบิวต์สามารถแก้ไขได้กับแอตทริบิวต์ accessor;
2. [[enumerable]]: ค่าเริ่มต้นเป็นจริง บ่งชี้ว่าแอตทริบิวต์สามารถส่งคืนผ่านลูป for-in;
3. [[เขียน]]: ค่าเริ่มต้นเป็นจริง ระบุว่าค่าของแอตทริบิวต์สามารถแก้ไขได้หรือไม่
4. [[ค่า]]: ค่าเริ่มต้นไม่ได้กำหนด แสดงถึงค่าข้อมูลที่มีแอตทริบิวต์ การอ่านและการเขียนค่าแอตทริบิวต์จะดำเนินการจากตำแหน่งนี้
สำหรับคุณสมบัติที่กำหนดไว้ข้างต้นโดยตรงบนวัตถุบุคคล [[กำหนดค่า] ของพวกเขา], [[enumerable]] และ [[writable]] คุณสมบัติถูกตั้งค่าเป็นจริงโดยค่าเริ่มต้นในขณะที่คุณสมบัติ [[ค่า]] ถูกตั้งค่าเป็นค่าเฉพาะ หากคุณต้องการแก้ไขคุณสมบัติเริ่มต้นของคุณสมบัติคุณสามารถใช้วิธีการ defineProperty () ที่ให้ไว้โดย ES5 วิธีนี้ได้รับสามพารามิเตอร์: วัตถุที่คุณสมบัติอยู่ชื่อของคุณสมบัติและวัตถุ descriptor วัตถุ descriptor สามารถมีเพียงหนึ่งในสี่ลักษณะข้างต้น ตัวอย่างมีดังนี้:
var person = {name: "scott"} object.defineproperty (บุคคล, "ชื่อ", {เขียนได้: false;}) console.log (person.name); // "scott" person.name = "evan"; console.log (person.name); // "Scott"ตั้งค่าคุณสมบัติที่เขียนได้ของแอตทริบิวต์ชื่อวัตถุบุคคลเป็นเท็จ ค่าของแอตทริบิวต์นี้ไม่ได้แก้ไขดังนั้นการดำเนินการคัดลอกของแอตทริบิวต์นี้จะถูกละเว้นโดยตรง
var person = {ชื่อ: "scott"} object.defineproperty (บุคคล, "ชื่อ", {กำหนดค่า: false;}) console.log (person.name); // "สกอตต์" ลบคนชื่อ; console.log (person.name); // "Scott"จะเห็นได้ว่าเมื่อค่าคุณสมบัติที่กำหนดค่าของแอตทริบิวต์ชื่อถูกตั้งค่าเป็นเท็จหมายความว่าแอตทริบิวต์ไม่สามารถลบออกจากวัตถุได้ แต่ควรสังเกตว่าเมื่อคุณสมบัติถูกกำหนดให้เป็นสิ่งที่ไม่สามารถปรับได้ก็จะไม่สามารถเปลี่ยนกลับเป็นแบบกำหนดค่าได้ ในเวลานี้การแก้ไขคุณสมบัติอื่น ๆ นอกเหนือจากการเขียนจะทำให้เกิดข้อผิดพลาดเช่น:
var person = {ชื่อ: "scott"} object.defineproperty (บุคคล, "ชื่อ", {กำหนดค่า: false;}) object.defineproperty (บุคคล, "ชื่อ", {กำหนดค่าได้: จริง; // ข้อผิดพลาดจะถูกโยนลงที่นี่})))กล่าวคือหลังจากแก้ไขคุณสมบัติที่กำหนดค่าได้เป็นเท็จจะมีข้อ จำกัด เมื่อแก้ไขคุณสมบัติอื่น ๆ
•คุณสมบัติของอุปกรณ์เสริม
แอตทริบิวต์ accessor ไม่มีค่าข้อมูล มันมีฟังก์ชั่น getter และ setter คู่หนึ่ง เมื่ออ่านแอตทริบิวต์ accessor ฟังก์ชั่น getter จะถูกเรียกและค่าที่ถูกต้องจะถูกส่งคืน; เมื่อมีการเขียนแอตทริบิวต์ accessor ฟังก์ชั่น setter จะถูกเรียกและผ่านค่าใหม่และฟังก์ชั่น Setter จะรับผิดชอบในการประมวลผลข้อมูล คุณสมบัตินี้มีสี่ลักษณะ:
1. [[กำหนดค่า]]: ค่าเริ่มต้นเป็นจริง บ่งชี้ว่าสามารถลบแอตทริบิวต์เพื่อกำหนดแอตทริบิวต์ใหม่ได้ไม่ว่าจะเป็นคุณสมบัติของแอตทริบิวต์หรือไม่หรือแอตทริบิวต์สามารถแก้ไขได้กับแอตทริบิวต์ accessor;
2. [[enumerable]]: ค่าเริ่มต้นเป็นจริง บ่งชี้ว่าแอตทริบิวต์สามารถส่งคืนผ่านลูป for-in;
3. [[GET]]: ฟังก์ชั่นที่เรียกว่าเมื่ออ่านแอตทริบิวต์ค่าเริ่มต้นจะไม่ได้กำหนด;
4. [[set]]: ฟังก์ชั่นที่เรียกว่าเมื่อเขียนแอตทริบิวต์ค่าเริ่มต้นจะไม่ได้กำหนด
คุณสมบัติของอุปกรณ์เสริมไม่สามารถกำหนดได้โดยตรงพวกเขาจะต้องกำหนดผ่านฟังก์ชัน defineProperty () เช่น: ตัวอย่างเช่น:
var person = {_name: "Scott", _age: 24, _tel: 86247}; // แอตทริบิวต์ชื่อเป็น read-only object.defineProperty (บุคคล "ชื่อ", {get: function () {return this._name;}}); // แอตทริบิวต์อายุเป็น Object.defineProperty (บุคคล, "อายุ", {set: function (p) {this._age = p;}}); // แอตทริบิวต์การโทรเป็น object.defineproperty (บุคคล, "tel", {get: function () {return this._tel;}, set: function (p) {this._tel = p;}}); console.log (person.name); // "scott" person.name = "evan"; console.log (person.name); // "สกอตต์" การดัดแปลงแอตทริบิวต์ชื่อไม่ถูกต้อง console.log (person.age); // undefined บุคคลที่ไม่สามารถอ่านได้ age.age = 25; console.log (person._age); // 25, console.log (person.tel); // "86247", คุณลักษณะที่อ่านได้บุคคล. tel = "13975"; console.log (person.tel); // "13975" สามารถทำการดัดแปลงได้ขีดล่างก่อนที่แอตทริบิวต์จะระบุแอตทริบิวต์ที่สามารถเข้าถึงได้ผ่านวิธีวัตถุเท่านั้น เมื่อเราใช้ Person.name เราจะเรียกฟังก์ชัน getter ของแอตทริบิวต์ชื่อและเมื่อเรากำหนดค่าให้กับบุคคลชื่อเราเรียกฟังก์ชัน setter ของแอตทริบิวต์ชื่อเพื่อให้ความสัมพันธ์ระหว่างแอตทริบิวต์และ accessor ชัดเจนมาก
กำหนดคุณลักษณะหลายอย่าง
ในความเป็นจริง ES5 ให้วิธีการเราในการกำหนดคุณสมบัติหลายอย่างสำหรับวัตถุคือ Object.defineProperties () ฟังก์ชั่นนี้ได้รับพารามิเตอร์สองตัววัตถุที่คุณสมบัติอยู่และวัตถุที่ประกอบด้วยแอตทริบิวต์ที่ต้องแก้ไขและวัตถุ descriptor ตัวอย่างเช่นแก้ไขตัวอย่างข้างต้นเพื่อกำหนดคุณสมบัติหลายอย่างพร้อมกันดังนี้:
var person = {_name: "Scott", _age: 24, _tel: 86247}; Object.defineProperties (บุคคล, {ชื่อ: {get: function () {return this._name;}}, อายุ: {set: function (p) {this._age = p;}}, โทร: {get: {prunction () {return this._tel;อ่านคุณสมบัติ
ES5 ให้วิธีการ Object.getOwnPropertyDescripter () เพื่อรับ descriptor สำหรับคุณสมบัติที่กำหนด วิธีนี้ได้รับสองพารามิเตอร์: วัตถุที่แอตทริบิวต์อยู่และชื่อแอตทริบิวต์ของตัวอธิบายที่จะอ่าน ผลลัพธ์จะส่งคืนวัตถุ หากเป็นแอตทริบิวต์ accessor วัตถุที่ส่งคืนจะรวมถึงการกำหนดค่า, enumerable, get และ set; หากเป็นแอตทริบิวต์ข้อมูลคุณสมบัติของวัตถุที่ส่งคืนจะรวมถึงการกำหนดค่า, enumerable, writable และ value สำหรับตัวอย่างข้างต้นใช้สิ่งต่อไปนี้:
var person = {_name: "Scott", _age: 24, _tel: 86247}; Object.defineProperties (บุคคล, {ชื่อ: {get: function () {return this._name;}}, อายุ: {set: function (p) {this._age = p;}}, โทร: {get: {prunction () {return this._tel; var describer = object.getownpropertydescripter (บุคคล, "tel"); console.log (descripter.value); // console.log ที่ไม่ได้กำหนด (descripter.enumerable); // false console.log (typeof descriptioner.get); //"การทำงาน"รหัสข้างต้นได้รับทรัพย์สินทางโทรศัพท์ของวัตถุบุคคล เนื่องจากเป็นคุณสมบัติของอุปกรณ์เสริมค่าของมันจึงไม่ได้กำหนดจึงมีการระบุว่าเป็นเท็จและ Get เป็นตัวชี้ไปยังฟังก์ชั่น getter
บทความข้างต้นกล่าวถึงคุณลักษณะข้อมูล JavaScript และแอตทริบิวต์ accessor โดยสังเขปเป็นเนื้อหาทั้งหมดที่ฉันได้แชร์กับคุณ ฉันหวังว่าคุณจะให้ข้อมูลอ้างอิงและฉันหวังว่าคุณจะสนับสนุน wulin.com มากขึ้น