Khái niệm “cái này” trong JavaScript là một trong những khía cạnh khó hiểu nhất của ngôn ngữ này. Tuy nhiên, lại là nhân tố quan trọng để viết mã “advance”, nâng cao hơn. Trong JS,
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 cho phép- Use back function in other contexts
- Xác định tập tin trung vào bất kỳ đối tượng nào khi gọi phương thức
Chuyển tới
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 thì điều đầu tiên phải làm đó là biết gọi chức năng nào, bởi sẽ không biết cái gì ở bên trong let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 để tới khi chức năng được gọi. Và các trường hợp của let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 có thể chia thành 5 cạnh function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
1 khác nhauTuyển dụng lập trình JavaScript trong tháng
Ràng buộc là gì
Trong JavaScript thì
function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
2 hay nói theo nghĩa đen là môi trường từ vựng, cũng như môi trường chứa mã biến được viết ra theo mặt vật lý [về mặt vật lý]. Vui lòng xem ví dụ bên dưới, tên biến bên trong hàm function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
3 là function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
4________số 8Trong đó
function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
5 thì liên quan đến mã hiện đang được phân tích và những mã thứ cấp giúp hoạt động. Có thể có nhiều môi trường từ vựng có sẵn nhưng chỉ có một cái đang chạy lúc này, và được Execution Context quản lýMỗi Bối cảnh thực thi lại chứa một
function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
6. function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
7 trong JavaScript có nghĩa là ghi lại mã định danh [biến và tên hàm] trong Bản ghi môi trường cụ thểLưu ý.
function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
7 giúp kết hợp định danh [biến và tên hàm] với let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 cho một let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
40Đoạn này còn hơi rắc rối nhưng những phần sau sẽ giải thích rõ hơn
Quy tắc 1. Implicit Binding hoạt động như thế nào?
Trong ràng buộc ngầm định thì cần phải xem các đối tượng bên trái của hàm sử dụng dấu chấm [toán tử dấu chấm], từ đó xác định được
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 đang tham chiếu tới cái gìlet user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
Ví dụ này thì
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 đang trỏ tới đối tượng người dùng, bởi vì bên trái hàm dấu chấm là hàm getName[], ta thấy có đối tượng người dùng, vì vậy điều này. tên trong bảng điều khiển sẽ hiển thị TapasMột ví dụ khác
function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
Trong ví dụ này thì có 2 tân ngữ,
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
43 và let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
44. Và chúng được trang trí [nâng cao] bằng cách đính kèm method let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
45Khi gọi hàm
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
46, đối tượng let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
43 nằm bên trái dấu chấm dấu của hàm let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
45. Nên let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 sẽ trỏ tới đối tượng let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
43 và nhận giá trị của tom [let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
71 tương đương với tom]. Tương tự khi gọi hàm let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
72Quy tắc 2. Explicit Binding hoạt động như thế nào?
JavaScript tạo môi trường để thực thi mã mà chúng tôi viết. Trong đó nó đảm nhiệm việc tạo bộ nhớ [dành cho biến, hàm, đối tượng] trong giai đoạn tạo. Cuối cùng nó hãy sử dụng mã trong giai đoạn thực thi. This new field is
function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
5Có nhiều loại môi trường trong ứng dụng JavaScript. Mỗi bối cảnh thực hiện được thực hiện, chạy lệnh độc lập với nhau. Nhưng sẽ có lúc cần sử dụng thứ này trong ngữ cảnh thực thi này trong ngữ cảnh khác. Lúc này ràng buộc rõ ràng sẽ pht huy công
Trong ràng buộc tường minh, chúng ta có thể gọi hàm với đối tượng khi hàm đó nằm ngoài ngữ cảnh thực thi của đối tượng đó
Để thực hiện đấu thầu rõ ràng thì có 3 phương thức đó là
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
74, let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
75 và let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
76Hàm call[] thế nào active
Với phương thức
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
74, ngữ cảnh với hàm được gọi sẽ được chuyển tới let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
78 dưới dạng tham số [tham số]let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
4Ở đây, hàm
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
74 sẽ được gọi trên hàm let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
70. Hàm let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
70 nhận giá trị let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
71. Nhưng let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 trong đây là gì? Với trường hợp này,
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 sẽ bị ràng buộc với đối tượng người dùng bởi vì người dùng đã chuyển đổi như một tham số đến hàm let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
74. Vì vậy, let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
71 sẽ nhận giá trị của tên thuộc tính của đối tượng người dùng, Tapas. Ví dụ trên mới chỉ chuyển một đối số tới hàm
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
74, nhưng thực tế có thể chuyển nhiều đối số như saulet user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7Đối số đầu tiên được chuyển đến
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
74 là ngữ cảnh đối tượng với chức năng đã được gọi. Những thuộc tính khác chỉ có thể là giá trị được sử dụng. Ở đây mình đang chuyển Bơi và Viết blog là 2 thuộc tính của chức năng let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
70Tuy nhiên sẽ có trường hợp cần vượt qua từng đối số trong
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
74 thì sao? Hàm apply[] thế nào active
Cách mà
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
75 thực thi lệnh cũng tương đồng với let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
74 nhưng cho phép vượt qua đối số thuận tiện hơnlet user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7Lúc này ta có thể chuyển một mảng [array] chứa đối số luôn, tiện hơn nhiều so với việc chuyển từng cái
Lời khuyên. if you need to transfer a value argument or argument that not have the value, please use
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
74. Còn nếu chuyển nhiều đối số giá trị thì sử dụng let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
75Hàm bind[] thế nào active
Method
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
76 cũng tương tự như let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
74 nhưng có 1 điểm khác biệt nhỏ. Thay vì gọi hàm trực tiếp thì let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
76 trả về một hàm mớifunction decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
9Ở đây
function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
00 không gọi hàm let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
70 trực tiếp, nó trả về hàm mới, function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
02 và chúng ta đang gọi hàm dưới dạng function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
03Quy tắc 3. Ràng buộc mới
Từ khóa
function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
04 được sử dụng để tạo một đối tượng mới từ hàm tạofunction decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
0Bạn có thể tạo nhiều đối tượng với từ khóa
function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
04 như saufunction decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
7Với quy tắc đặt giá thầu mới, khi một chức năng được gọi bằng từ khóa mới, thì chức năng bên trong này sẽ tham chiếu tới đối tượng mới được thiết lập
function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
8Đây là chức năng Phim hoạt hình được gọi với từ khóa mới. Thì cái này sẽ tham chiếu tới đối tượng mới, tom
Quy tắc 4. Ràng buộc đối tượng toàn cầu
Đoạn mã dưới đây có kết quả thế nào?
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
0Nếu
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 không giải quyết được với một trong các ràng buộc theo quy tắc, function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
08, function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
09 hay function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
04, thì let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 lúc này tham chiếu tới đối tượng function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
72Tuy nhiên, chế độ nghiêm ngặt của quy tắc JavaScript sẽ không cho phép ràng buộc mặc định như sau
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
1Trường hợp này thì
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 là function decorateLogName[obj] {
obj.logName = function[] {
console.log[this.name];
}
};
let tom = {
name: 'Tom',
age: 7
};
let jerry = {
name: 'jerry',
age: 3
};
decorateLogName[tom];
decorateLogName[jerry];
tom.logName[];
jerry.logName[];
74Quy tắc 5. Liên kết phần tử sự kiện HTML
Trong trình xử lý sự kiện HTML,
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 tham chiếu tới phần tử HTML bất kỳ nhận sự kiện nàolet user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
2Đây là giá trị trả về bảng điều khiển khi nhấp vào nút
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
3You can change style of
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
4Nhưng hãy cẩn thận khi gọi chức năng trên nút bấm và sử dụng
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 bên trong chức năng đólet user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
5và JavaScript
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
6Đoạn mã trên sẽ không trả về kết quả như ý, theo như quy tắc số 4 thì
let user = {
name: 'Tapas',
address: 'freecodecamp',
getName: function[] {
console.log[this.name];
}
};
user.getName[];
7 sẽ tham chiếu tới đối tượng toàn cầu và không có kiểu đối tượng để đặt màu