Ở đây chúng ta vừa sử dụng một Biểu thức Hàm để tạo một hàm và gán nó cho thuộc tính
let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
2 của đối tượngSau đó, chúng ta có thể gọi nó là
let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
3. Người dùng bây giờ có thể nóiMột chức năng là một thuộc tính của một đối tượng được gọi là phương thức của nó
Vì vậy, ở đây chúng ta có một phương thức
let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
4 của đối tượng let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
1Tất nhiên, chúng ta có thể sử dụng một hàm được khai báo trước như một phương thức, như thế này
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
Lập trình hướng đối tượng
Khi chúng ta viết mã bằng cách sử dụng các đối tượng để biểu diễn các thực thể, điều đó được gọi ngắn gọn là lập trình hướng đối tượng. “Ồ”
OOP là một điều lớn lao, một ngành khoa học thú vị của riêng nó. Làm thế nào để chọn đúng thực thể? . Các yếu tố của phần mềm hướng đối tượng có thể tái sử dụng” của E. Gamma, R. Mũ bảo hiểm, R. Johnson, J. Vissides hoặc “Phân tích và thiết kế hướng đối tượng với các ứng dụng” của G. Boochvà hơn thế nữa
phương pháp tốc ký
Tồn tại một cú pháp ngắn hơn cho các phương thức trong một đối tượng bằng chữ
// these objects do the same
user = {
sayHi: function[] {
alert["Hello"];
}
};
// method shorthand looks better, right?
user = {
sayHi[] { // same as "sayHi: function[]{...}"
alert["Hello"];
}
};
Như đã minh họa, chúng ta có thể bỏ qua
let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
6 và chỉ cần viết let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
7Nói thật, các ký hiệu không hoàn toàn giống nhau. Có những khác biệt tinh tế liên quan đến kế thừa đối tượng [sẽ được đề cập sau], nhưng hiện tại chúng không quan trọng. Trong hầu hết các trường hợp, cú pháp ngắn hơn được ưu tiên
“cái này” trong các phương thức
Thông thường, một phương thức đối tượng cần truy cập thông tin được lưu trữ trong đối tượng để thực hiện công việc của nó
Chẳng hạn, mã bên trong
let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
3 có thể cần tên của let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
1Để truy cập đối tượng, một phương thức có thể sử dụng từ khóa
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0Giá trị của
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 là đối tượng “trước dấu chấm”, đối tượng được sử dụng để gọi phương thứcVí dụ
let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
2Ở đây trong quá trình thực thi của
let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
3, giá trị của let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 sẽ là let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
1Về mặt kỹ thuật, cũng có thể truy cập đối tượng mà không cần
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0, bằng cách tham chiếu nó thông qua biến bên ngoàilet user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
7…Nhưng mã như vậy là không đáng tin cậy. Nếu chúng tôi quyết định sao chép
let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
1 sang một biến khác, e. g. let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
7 và ghi đè lên let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
1 bằng thứ khác, sau đó nó sẽ truy cập sai đối tượngĐiều đó được chứng minh dưới đây
let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
1Nếu chúng tôi sử dụng
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
9 thay vì // these objects do the same
user = {
sayHi: function[] {
alert["Hello"];
}
};
// method shorthand looks better, right?
user = {
sayHi[] { // same as "sayHi: function[]{...}"
alert["Hello"];
}
};
0 bên trong // these objects do the same
user = {
sayHi: function[] {
alert["Hello"];
}
};
// method shorthand looks better, right?
user = {
sayHi[] { // same as "sayHi: function[]{...}"
alert["Hello"];
}
};
1, thì mã sẽ hoạt động"cái này" không bị ràng buộc
Trong JavaScript, từ khóa
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 hoạt động không giống như hầu hết các ngôn ngữ lập trình khác. Nó có thể được sử dụng trong bất kỳ chức năng nào, ngay cả khi nó không phải là phương thức của đối tượngKhông có lỗi cú pháp trong ví dụ sau
let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
6Giá trị của
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 được đánh giá trong thời gian chạy, tùy thuộc vào ngữ cảnhChẳng hạn, ở đây, cùng một chức năng được gán cho hai đối tượng khác nhau và có “cái này” khác nhau trong các lời gọi
let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
8Quy tắc rất đơn giản. nếu
// these objects do the same
user = {
sayHi: function[] {
alert["Hello"];
}
};
// method shorthand looks better, right?
user = {
sayHi[] { // same as "sayHi: function[]{...}"
alert["Hello"];
}
};
4 được gọi, thì let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 là // these objects do the same
user = {
sayHi: function[] {
alert["Hello"];
}
};
// method shorthand looks better, right?
user = {
sayHi[] { // same as "sayHi: function[]{...}"
alert["Hello"];
}
};
6 trong cuộc gọi của // these objects do the same
user = {
sayHi: function[] {
alert["Hello"];
}
};
// method shorthand looks better, right?
user = {
sayHi[] { // same as "sayHi: function[]{...}"
alert["Hello"];
}
};
7. Vì vậy, nó là let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
1 hoặc // these objects do the same
user = {
sayHi: function[] {
alert["Hello"];
}
};
// method shorthand looks better, right?
user = {
sayHi[] { // same as "sayHi: function[]{...}"
alert["Hello"];
}
};
9 trong ví dụ trênGọi không có đối tượng.
20let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
Chúng ta thậm chí có thể gọi hàm mà không cần đối tượng nào cả
let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
6Trong trường hợp này,
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 là let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
22 ở chế độ nghiêm ngặt. Nếu chúng tôi cố gắng truy cập vào let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
9, sẽ có lỗiỞ chế độ không nghiêm ngặt, giá trị của
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 trong trường hợp đó sẽ là đối tượng toàn cầu [let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
25 trong trình duyệt, chúng ta sẽ nói về nó sau trong chương Đối tượng toàn cầu]. Đây là một hành vi lịch sử mà let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
26 sửa chữaThông thường cuộc gọi như vậy là một lỗi lập trình. Nếu có
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 bên trong một hàm, nó sẽ được gọi trong ngữ cảnh đối tượngHậu quả của việc không gắn kết
0let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
Nếu bạn đến từ một ngôn ngữ lập trình khác, thì có lẽ bạn đã quen với ý tưởng về "_______40 bị ràng buộc", trong đó các phương thức được định nghĩa trong một đối tượng luôn có _____40 tham chiếu tới đối tượng đó
Trong JavaScript,
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 là "miễn phí", giá trị của nó được đánh giá tại thời điểm gọi và không phụ thuộc vào nơi phương thức được khai báo, mà phụ thuộc vào đối tượng nào "trước dấu chấm"Khái niệm về thời gian chạy được đánh giá
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 có cả ưu điểm và nhược điểm. Một mặt, một chức năng có thể được sử dụng lại cho các đối tượng khác nhau. Mặt khác, tính linh hoạt cao hơn tạo ra nhiều khả năng mắc sai lầm hơn.Ở đây, vị trí của chúng tôi không phải là đánh giá liệu quyết định thiết kế ngôn ngữ này là tốt hay xấu. Chúng tôi sẽ hiểu cách làm việc với nó, cách nhận được lợi ích và tránh các vấn đề
Các chức năng mũi tên không có "cái này"
Chức năng mũi tên là đặc biệt. họ không có
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 “của riêng mình”. Nếu chúng ta tham chiếu let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 từ một hàm như vậy, thì nó được lấy từ hàm “bình thường” bên ngoàiChẳng hạn, ở đây
let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
75 sử dụng let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 từ phương thức let user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
3 bên ngoàilet user = {
name: "John",
age: 30
};
user.sayHi = function[] {
alert["Hello!"];
};
user.sayHi[]; // Hello!
0Đó là một tính năng đặc biệt của arrow functions, nó rất hữu ích khi chúng ta thực sự không muốn có một
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 riêng mà muốn lấy nó từ ngữ cảnh bên ngoài. Ở phần sau của chương Các hàm mũi tên được xem xét lại, chúng ta sẽ tìm hiểu sâu hơn về các hàm mũi tênBản tóm tắt
- Các chức năng được lưu trữ trong các thuộc tính đối tượng được gọi là "phương thức"
- Các phương thức cho phép các đối tượng “hành động” như
79let user = { name: "John", age: 30 }; user.sayHi = function[] { alert["Hello!"]; }; user.sayHi[]; // Hello!
- Các phương thức có thể tham chiếu đối tượng là
0let user = { // ... }; // first, declare function sayHi[] { alert["Hello!"]; } // then add as a method user.sayHi = sayHi; user.sayHi[]; // Hello!
Giá trị của
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 được xác định trong thời gian chạy- Khi một hàm được khai báo, nó có thể sử dụng
0, nhưnglet user = { // ... }; // first, declare function sayHi[] { alert["Hello!"]; } // then add as a method user.sayHi = sayHi; user.sayHi[]; // Hello!
0 đó không có giá trị cho đến khi hàm được gọilet user = { // ... }; // first, declare function sayHi[] { alert["Hello!"]; } // then add as a method user.sayHi = sayHi; user.sayHi[]; // Hello!
- Một chức năng có thể được sao chép giữa các đối tượng
- Khi một hàm được gọi theo cú pháp “phương thức”.
14, giá trị củalet user = { name: "John", age: 30 }; user.sayHi = function[] { alert["Hello!"]; }; user.sayHi[]; // Hello!
0 trong cuộc gọi làlet user = { // ... }; // first, declare function sayHi[] { alert["Hello!"]; } // then add as a method user.sayHi = sayHi; user.sayHi[]; // Hello!
16let user = { name: "John", age: 30 }; user.sayHi = function[] { alert["Hello!"]; }; user.sayHi[]; // Hello!
Xin lưu ý rằng các chức năng mũi tên là đặc biệt. họ không có
let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0. Khi let user = {
// ...
};
// first, declare
function sayHi[] {
alert["Hello!"];
}
// then add as a method
user.sayHi = sayHi;
user.sayHi[]; // Hello!
0 được truy cập bên trong hàm mũi tên, nó được lấy từ bên ngoài