JavaScript

Một số Object Methods mới trong JavaScript ES5

Một số Object Methods mới trong JavaScript ES5
Được viết bởi Minh Hoàng

Series lập trình JavaScript, ngôn ngữ lập trình linh động, thực thi phía client.

Một số Object Methods mới trong JavaScript ES5

ECMAScript 5 đã thêm rất nhiều Object Methods mới vào JavaScript.

ES5 New Object Methods
// Thêm hoặc thay đổi một object property
Object.defineProperty(object, property, descriptor)

// Thêm hoặc thay đổi nhiều object properties
Object.defineProperties(object, descriptors)

// Truy cập các properties
Object.getOwnPropertyDescriptor(object, property)

// Return tất cả object properties dưới dạng một array
Object.getOwnPropertyNames(object)

// Return enumerable properties dưới dạng một array
Object.keys(object)

// Truy cập prototype
Object.getPrototypeOf(object)

// Ngăn chặn thêm properties vào một object
Object.preventExtensions(object)
// Return true nếu các properties có thể được thêm vào một object
Object.isExtensible(object)

// Ngăn chặn thay đổi object properties (not values)
Object.seal(object)
// Return true nếu object bị sealed (niêm phong)
Object.isSealed(object)

// Ngăn chặn bất kỳ thay đổi nào đối với một object
Object.freeze(object)
// Return true nếu object bị frozen (đóng băng)
Object.isFrozen(object)

1. Thay đổi giá trị của Property

– Cú pháp:

Object.defineProperty(objectName, "propertyName", {value : newValue})

– Ví dụ: Thay đổi giá trị thuộc tính “color” của đối tượng “car”.

// Tạo đối tượng car:
var car = {
    brand	: "Toyota",
    name	: "Prius 2018",
    color	: "White"
};

// Thay đổi giá trị thuộc tính color
Object.defineProperty(car, "color", {value : "Red"})

car.color;		// return Red
Try it »

2. Thay đổi Meta Data

– Trong ES5, bạn có thể thay đổi meta data property sau:

writable : true			// Giá trị property có thể thay đổi
enumerable : true		// Property có thể được liệt kê
configurable : true		// Property có thể được config lại

writable : false		// Giá trị property không thể thay đổi
enumerable : false		// Property không thể liệt kê
configurable : false	// Property không thể config lại

– ES5 cho phép thay đổi getters và setters:

// Định nghĩa một getter
get: function() { return color }

// Định nghĩa một setter
set: function(value) { color = value }

– Ví dụ: làm cho thuộc tính “color” chỉ đọc (read-only):

Object.defineProperty(car, "color", {writable:false});

– Ví dụ: làm cho thuộc tính “color” không thể liệt kê (enumerable):

Object.defineProperty(car, "color", {enumerable:false});

3. Liệt kê tất cả các Properties

Ví dụ:
var car = {
    brand	: "Toyota",
    name	: "Prius 2018",
    color	: "White",
    weight	: 850
};

Object.getOwnPropertyNames(car);	// brand,name,color,weight
Try it »

4. Liệt kê các Enumerable Properties

Ví dụ sau chỉ liệt kê các Enumerable Properties của một đối tượng:

var car = {
    brand	: "Toyota",
    name	: "Prius 2018",
    color	: "White",
    weight	: 850
};

// Thay đổi property meta data "enumerable" của "color" property
Object.defineProperty(car, "color", {enumerable:false});

Object.keys(car);		// brand,name,weight
Try it »

5. Thêm mới một Property cho đối tượng

Ví dụ:
var car = {
    brand	: "Toyota",
    name	: "Prius 2018",
    color	: "White"
};

// Thêm một property mới
Object.defineProperty(car, "weight", {value:850});
Try it »

6. Thêm Getters và Setters

– Phương thức Object.defineProperty() cũng có thể được sử dụng để thêm Getters và Setters:

Ví dụ:
// Tạo đối tượng:
var car = {brand:"Toyota", name:"Prius 2018", color:"White"};

// Định nghĩa một getter
Object.defineProperty(car, "getFullName", {
    get : function () {return this.brand + " " + this.name;}
});

// Hiển thị tên xe
car.getFullName;		// Toyota Prius 2018
Try it »

– Ví dụ về một Counter:

// Define object
var obj = {counter:0};

// Define setters
Object.defineProperty(obj, "reset", {
    get : function () {this.counter = 0;}
});
Object.defineProperty(obj, "increment", {
    get : function () {this.counter++;}
});
Object.defineProperty(obj, "decrement", {
    get : function () {this.counter--;}
});
Object.defineProperty(obj, "add", {
    set : function (value) {this.counter += value;}
});
Object.defineProperty(obj, "subtract", {
    set : function (i) {this.counter += i;}
});

// Play with the counter:
obj.reset;
obj.add = 5;
obj.subtract = 1;
obj.increment;
obj.decrement;		// return 4
Try it »

Tham khảo w3schools.

Cảm ơn bạn đã theo dõi. Đừng ngần ngại hãy cùng thảo luận với chúng tôi!
[likebtn theme=”github” dislike_enabled=”0″ show_dislike_label=”1″]

Giới thiệu

Minh Hoàng

Xin chào, tôi là Hoàng Ngọc Minh, hiện đang làm BrSE, tại công ty Toyota, Nhật Bản. Những gì tôi viết trên blog này là những trải nghiệm thực tế tôi đã đúc rút ra được trong cuộc sống, quá trình học tập và làm việc. Các bài viết được biên tập một cách chi tiết, linh hoạt để giúp người đọc có thể tiếp cận một cách dễ dàng nhất. Hi vọng nó sẽ có ích hoặc mang lại một góc nhìn khác cho bạn[...]

Bình luận của bạn

avatar

Một số Object Methods mới trong JavaScript ES5

by Minh Hoàng Time to read: 4 min
0