programming javascript

Triển khai chức năng liên kết trong JavaScript

Chúng tôi tiếp tục với loạt bài của mình để giúp bạn chuẩn bị tốt nhất có thể cho các cuộc phỏng vấn trong Javascript. Chúng tôi sẽ xem xét một câu hỏi khác mà tôi đã được đưa ra trong một cuộc phỏng vấn cho vị trí nhà phát triển front-end cấp cao trong một công ty khởi nghiệp

triển khai chức năng liên kết của riêng bạn trong vanilla javascript

Điều cần thiết là phải hiểu câu hỏi trước khi vội vàng trả lời. Tôi thực sự khuyên bạn nên đọc bài đăng này về quá trình phỏng vấn

Vui lòng viết một hàm liên kết trả về một hàm mới như định nghĩa sau

Phương thức bind[] tạo một hàm mới, khi được gọi, từ khóa this của nó được đặt thành giá trị được cung cấp, với một chuỗi đối số đã cho trước bất kỳ hàm nào được cung cấp khi hàm mới được gọi

Chúng ta sẽ cần thực hiện các bước sau để viết chức năng của mình

  • Kiểm tra xem hàm liên kết có được áp dụng cho một hàm không
  • Đầu vào thứ hai phải là ngữ cảnh “cái này” để liên kết với
  • Xử lý các đối số chức năng đầu vào
  • trả lại một chức năng mới
  • kiểm tra, kiểm tra và kiểm tra

Xác thực đầu vào

Chúng tôi sẽ sử dụng hàm typeof để xác thực rằng đầu vào thực tế là một hàm

const ourBind = function [thisContext, bindFunction] {

  if [typeof bindFunction !== 'function'] {
    throw new Error['You can only bind to a function']
  }

Bây giờ chúng ta nên trả về một chức năng mới

const ourBind = function [thisContext, bindFunction] {

  if [typeof this !== 'function'] {
    throw new Error['You can only bind to a function']
  }
  return function[]{ }
}

Tiếp theo, chúng ta nên gọi hàm được yêu cầu với các đối số của nó

const ourBind = function [thisContext, bindFunction] {

  if [typeof this !== 'function'] {
    throw new Error['You can only bind to a function']
  }
  return function[]{ 
      bindFunction[arguments]
  }
}

Chức năng mới bây giờ sẽ được gọi khi được yêu cầu nhưng vẫn không có ràng buộc thực sự

Đối số Javascript

arguments là một đối tượng giống như Array có thể truy cập bên trong các hàm có chứa các giá trị của các đối số được truyền cho hàm đó

mozilla

“Đối số” là một đối tượng giống như mảng, nghĩa là nó không phải là một mảng nên chúng ta sẽ ép nó thành một

const ourBind = function [thisContext, bindFunction] {

  if [typeof this !== 'function'] {
    throw new Error['You can only bind to a function']
  }
  return function[]{ 
      bindFunction[Array.from[arguments]]
  }
}

Áp dụng Javascript

Phương thức apply[] gọi hàm đã chỉ định với một giá trị 

const ourBind = function [thisContext, bindFunction] {

  if [typeof this !== 'function'] {
    throw new Error['You can only bind to a function']
  }
  return function[]{ }
}
0 đã cho và arguments được cung cấp dưới dạng một mảng [hoặc một ]

mozilla

Chơi lô tô. Bằng cách kết hợp Áp dụng và truyền đối số cho một mảng, giờ đây chúng ta có thể hoàn thiện hàm liên kết của riêng mình

const ourBind = function [thisContext, bindFunction] {

  if [typeof this !== 'function'] {
    throw new Error['You can only bind to a function']
  }
  return function[]{ 
      bindFunction.apply[thisContext, Array.from[arguments]]
  }
}

Cuộc gọi thông báo cũng là một cách thay thế để áp dụng nhưng nó nhận từng đối số một thay vì một mảng sẽ thuận tiện hơn trong trường hợp này. Nếu bạn chọn sử dụng chức năng gọi thì bạn sẽ cần trải rộng các đối số

Trong bài viết này, tôi sẽ giải thích cách sử dụng lệnh gọi, áp dụng và liên kết trong JavaScript bằng các ví dụ đơn giản

Chúng tôi cũng sẽ triển khai một ví dụ minh họa cách bạn có thể tạo chức năng bản đồ của riêng mình bằng chức năng áp dụng

Không chần chừ thêm nữa, chúng ta hãy bắt đầu

Mục lục

điều kiện tiên quyết

Dưới đây là một số điều bạn nên hiểu để tận dụng tối đa bài viết này

  • Chức năng
  • Nguyên mẫu chức năng
  • từ khóa này

Định nghĩa

Hãy xem xét các hàm mà chúng ta sẽ nghiên cứu ở đây kỹ hơn một chút để hiểu chức năng của chúng

Gọi là một chức năng giúp bạn thay đổi ngữ cảnh của chức năng gọi. Theo thuật ngữ của giáo dân, nó giúp bạn thay thế giá trị của 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
7 bên trong một hàm bằng bất kỳ giá trị nào bạn muốn

Áp dụng rất giống với chức năng 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
8. Sự khác biệt duy nhất là trong 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
9 bạn có thể truyền một mảng dưới dạng danh sách đối số

Bind là một chức năng giúp bạn tạo một chức năng khác mà bạn có thể thực thi sau này với bối cảnh mới là 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
7 được cung cấp

Bây giờ chúng ta sẽ xem xét một số ví dụ cơ bản về các hàm gọi, áp dụng và liên kết. Sau đó, chúng ta sẽ xem xét một ví dụ mà chúng ta sẽ xây dựng chức năng của riêng mình tương tự như chức năng bản đồ

Cách sử dụng hàm gọi trong JavaScript

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
8 là một hàm mà bạn sử dụng để thay đổi giá trị của 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
7 bên trong một hàm và thực thi nó với các đối số được cung cấp

Đây là cú pháp của hàm 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
8


func.call[thisObj, args1, args2, ...]

Ở đâu,

  • func là một chức năng cần được gọi với một đối tượng 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7 khác
  • thisObj là một đối tượng hoặc một giá trị cần được thay thế bằng từ khóa 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7 có bên trong hàm 
    const newEntity = [obj] => console.log[obj];

function mountEntity[]{
	this.entity = newEntity;
	console.log[`Entity ${this.entity} is mounted on ${this}`];
}

mountEntity.call[];
    6
  • args1, args2 là các đối số được chuyển đến hàm gọi với đối tượng 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7 đã thay đổi

Lưu ý rằng nếu bạn gọi một hàm mà không có bất kỳ đối số 

const newEntity = [obj] => console.log[obj];

function mountEntity[]{
	this.entity = newEntity;
	console.log[`Entity ${this.entity} is mounted on ${this}`];
}

mountEntity.call[];
8 nào, thì JavaScript sẽ coi thuộc tính này là một đối tượng toàn cục

Bây giờ chúng ta đã có một số ngữ cảnh xung quanh hàm 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
8 là gì, hãy bắt đầu bằng cách hiểu nó chi tiết hơn với một số ví dụ

Cách gọi một hàm với các ngữ cảnh khác nhau trong JS

Xem xét ví dụ dưới đây. Nó bao gồm 3 lớp – 

func.apply[thisObj, argumentsArray];
0, 
func.apply[thisObj, argumentsArray];
1 và 
func.apply[thisObj, argumentsArray];
2

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];

Nếu để ý kỹ, bạn có thể thấy rằng chúng ta sử dụng hàm 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
8 để gọi hàm 
func.apply[thisObj, argumentsArray];
0 trong hai trường hợp. Đầu tiên, trong hàm 
func.apply[thisObj, argumentsArray];
5 và sau đó trong hàm 
func.apply[thisObj, argumentsArray];
6

Trong cả hai hàm này, chúng ta gọi hàm 

func.apply[thisObj, argumentsArray];
0 với đối tượng 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
7 đại diện cho chính các hàm tương ứng. Ví dụ, bên trong 
func.apply[thisObj, argumentsArray];
5, chúng ta gọi hàm 
func.apply[thisObj, argumentsArray];
0 với đối tượng 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
7 thuộc ngữ cảnh của nó. Trường hợp tương tự đối với 
func.apply[thisObj, argumentsArray];
6

Cách gọi một hàm không có đối số trong JS

Xem xét ví dụ dưới đây

const newEntity = [obj] => console.log[obj];

function mountEntity[]{
	this.entity = newEntity;
	console.log[`Entity ${this.entity} is mounted on ${this}`];
}

mountEntity.call[];

Trong ví dụ này, chúng tôi đã gọi hàm 

func.apply[thisObj, [args1, args2, ...]];
3 mà không có đối số 
const newEntity = [obj] => console.log[obj];

function mountEntity[]{
	this.entity = newEntity;
	console.log[`Entity ${this.entity} is mounted on ${this}`];
}

mountEntity.call[];
8. Trong những trường hợp như vậy, JavaScript đề cập đến đối tượng toàn cầu

Cách sử dụng chức năng Áp dụng trong JavaScript

Hàm 

func.apply[thisObj, [args1, args2, ...]];
5 rất giống với hàm 
func.apply[thisObj, [args1, args2, ...]];
6. Sự khác biệt duy nhất giữa 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
8 và 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
9 là sự khác biệt trong cách truyền đối số

Trong 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
9, các đối số bạn có thể truyền đối số dưới dạng một mảng ký tự hoặc một đối tượng mảng mới

Đây là cú pháp của hàm 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
9

func.apply[thisObj, argumentsArray];

Ở đâu,

  • func là một chức năng cần được gọi với một đối tượng 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7 khác
  • thisObj là một đối tượng hoặc một giá trị cần được thay thế bằng từ khóa 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7 có bên trong hàm 
    const newEntity = [obj] => console.log[obj];

function mountEntity[]{
	this.entity = newEntity;
	console.log[`Entity ${this.entity} is mounted on ${this}`];
}

mountEntity.call[];
    6
  • đối sốArray có thể là một mảng đối số, đối tượng mảng hoặc chính từ khóa đối số

Như bạn có thể thấy ở trên, hàm 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
9 có các loại cú pháp khác nhau

Cú pháp đầu tiên là một cú pháp đơn giản. Bạn có thể chuyển vào một mảng các đối số như bên dưới

func.apply[thisObj, [args1, args2, ...]];

Cú pháp thứ hai là nơi chúng ta có thể truyền vào đối tượng mảng mới cho nó

func.apply[thisObj, new Array[args1, args2]];

Cú pháp thứ ba là nơi chúng ta có thể chuyển vào từ khóa đối số

func.apply[thisObj, arguments];

đối số là một đối tượng đặc biệt có sẵn bên trong một chức năng. Nó chứa các giá trị của các đối số được truyền cho một hàm. Bạn có thể sử dụng từ khóa này với hàm 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
9 để lấy bất kỳ số lượng đối số tùy ý nào

Phần hay nhất về 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
9 là chúng ta không cần quan tâm đến số lượng đối số được truyền cho hàm gọi. Do tính chất năng động và linh hoạt của nó, bạn có thể sử dụng nó trong các tình huống phức tạp

Hãy xem ví dụ tương tự như trên, nhưng lần này chúng ta sẽ sử dụng hàm 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
9

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];

Và đây là một ví dụ giới thiệu cách bạn sử dụng từ khóa 

func.apply[thisObj, new Array[args1, args2]];
8

function addUp[]{
		//Using arguments to capture the arbitrary number of inputs
    const args = Array.from[arguments]; 
    this.x = args.reduce[[prev, curr] => prev + curr, 0];
    console.log["this.x = ", this.x];
}

function driverFunc[]{
    const obj = {
        inps: [1,2,3,4,5,6]
    }
    addUp.apply[obj, obj.inps];
}

driverFunc[];

Cách sử dụng chức năng liên kết trong JavaScript

Hàm 

func.apply[thisObj, new Array[args1, args2]];
9 tạo một bản sao của hàm có giá trị mới cho ____6_______7 hiện diện bên trong hàm gọi

Đây là cú pháp của hàm 

func.apply[thisObj, new Array[args1, args2]];
9

func.bind[thisObj, arg1, arg2, ..., argN];

Ở đâu,

  • func là một chức năng cần được gọi với một đối tượng 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7 khác
  • thisObj là một đối tượng hoặc một giá trị cần được thay thế bằng từ khóa 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7 có bên trong hàm 
    const newEntity = [obj] => console.log[obj];

function mountEntity[]{
	this.entity = newEntity;
	console.log[`Entity ${this.entity} is mounted on ${this}`];
}

mountEntity.call[];
    6
  • arg1, arg2…argN – bạn có thể truyền 1 đối số cho hàm gọi hoặc nhiều hơn thế, tương tự như hàm 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    8

Hàm 

func.apply[thisObj, new Array[args1, args2]];
9 sau đó trả về một hàm mới bao gồm ngữ cảnh mới cho biến 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
7 có bên trong hàm gọi

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
0

Bây giờ chức năng này 

const newEntity = [obj] => console.log[obj];

function mountEntity[]{
	this.entity = newEntity;
	console.log[`Entity ${this.entity} is mounted on ${this}`];
}

mountEntity.call[];
6 có thể được thực thi sau với các đối số

Hãy xem một ví dụ kinh điển về cách sử dụng hàm 

func.apply[thisObj, new Array[args1, args2]];
9 với sự trợ giúp của thành phần React dựa trên lớp

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
1

Xem xét thành phần Ứng dụng ở trên. Nó cấu thành những điều sau đây

  • function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    0 là một hàm được gọi là một lớp và được khởi tạo bằng từ khóa 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    1
  • function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    2 là một hàm thực thi/kết xuất mã JSX
  • function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    3 là một phương thức lớp ghi lại trạng thái của thành phần

Nếu chúng tôi nhấp vào nút 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
4 thì chúng tôi sẽ nhận được thông báo lỗi. 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
5

Bạn đã bao giờ tự hỏi tại sao vấn đề này xảy ra?

Bạn có thể mong đợi rằng chúng ta có thể truy cập trạng thái của lớp vì 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
3 là một phương thức của lớp. Nhưng đây là bắt

  • function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7 bên trong 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    3 không giống với lớp của 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7
  • Bên trong một lớp, 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7 là một đối tượng thông thường có các phương thức lớp không tĩnh làm thuộc tính của nó. Nhưng 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7 bên trong 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    3 sẽ đề cập đến một ngữ cảnh khác
  • Thành thật mà nói, giá trị của 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7 trong trường hợp này phụ thuộc vào nơi các chức năng được gọi. Nếu bạn thấy, 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    3 đang được gọi trong sự kiện 
    function addUp[]{
		//Using arguments to capture the arbitrary number of inputs
    const args = Array.from[arguments]; 
    this.x = args.reduce[[prev, curr] => prev + curr, 0];
    console.log["this.x = ", this.x];
}

function driverFunc[]{
    const obj = {
        inps: [1,2,3,4,5,6]
    }
    addUp.apply[obj, obj.inps];
}

driverFunc[];
    5
  • Nhưng ở giai đoạn này, chúng ta sẽ nhận được 
    function addUp[]{
		//Using arguments to capture the arbitrary number of inputs
    const args = Array.from[arguments]; 
    this.x = args.reduce[[prev, curr] => prev + curr, 0];
    console.log["this.x = ", this.x];
}

function driverFunc[]{
    const obj = {
        inps: [1,2,3,4,5,6]
    }
    addUp.apply[obj, obj.inps];
}

driverFunc[];
    6 cho bối cảnh của 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7 hiện diện bên trong hàm 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    3
  • Chúng tôi đang cố gọi thuộc tính 
    function addUp[]{
		//Using arguments to capture the arbitrary number of inputs
    const args = Array.from[arguments]; 
    this.x = args.reduce[[prev, curr] => prev + curr, 0];
    console.log["this.x = ", this.x];
}

function driverFunc[]{
    const obj = {
        inps: [1,2,3,4,5,6]
    }
    addUp.apply[obj, obj.inps];
}

driverFunc[];
    9 có giá trị không xác định. Do đó, điều này dẫn đến lỗi trên

Chúng ta có thể khắc phục điều này bằng cách cung cấp ngữ cảnh phù hợp của 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
7 bên trong phương thức 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
3. Bạn có thể làm điều này với phương pháp 
func.apply[thisObj, new Array[args1, args2]];
9

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
2

func.apply[thisObj, new Array[args1, args2]];
9 sẽ tạo một hàm mới và lưu trữ nó bên trong đối tượng 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
7 với một thuộc tính mới là 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
3. 
func.bind[thisObj, arg1, arg2, ..., argN];
6 sẽ đảm bảo rằng ngữ cảnh 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
7 của lớp được áp dụng cho hiện tại của 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
7 bên trong hàm 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.apply[this, ["convertible", "petrol"]]; //Syntax with array literal
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.apply[this, new Array["convertible", "diesel"]]; //Syntax with array object construction
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
3

Cách tạo Hàm 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
00 của riêng bạn

Bây giờ chúng ta đã có tất cả những thứ cần thiết, hãy bắt đầu bằng cách tạo chức năng bản đồ 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
01 của chúng ta. Trước tiên hãy hiểu những thứ mà chúng ta sẽ cần để xây dựng chức năng bản đồ 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
01 của mình

Đây là cú pháp của hàm 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
00

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
3

Ở đâu,

  • mảng là một mảng mà bản đồ được gọi
  • func là hàm cần chạy trên từng phần tử của mảng

Chức năng cơ bản của hàm 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
00 rất đơn giản

Đó là một hàm đi qua từng phần tử của một mảng và áp dụng hàm được truyền dưới dạng đối số. Kiểu trả về của bản đồ lại là một mảng với 

const newEntity = [obj] => console.log[obj];

function mountEntity[]{
	this.entity = newEntity;
	console.log[`Entity ${this.entity} is mounted on ${this}`];
}

mountEntity.call[];
6 được áp dụng cho mỗi phần tử

Bây giờ chúng ta đã hiểu các yêu cầu, vì vậy chúng ta có thể chuyển sang tạo hàm 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
00 của riêng mình. Đây là mã của chức năng 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
00 mới của chúng tôi

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
4

Hãy hiểu chức năng trên từng chút một

  • Hàm này chấp nhận một đối số có tên là 
    const newEntity = [obj] => console.log[obj];

function mountEntity[]{
	this.entity = newEntity;
	console.log[`Entity ${this.entity} is mounted on ${this}`];
}

mountEntity.call[];
    6. Nó chẳng là gì ngoài một hàm cần được gọi trên mỗi phần tử của một mảng
  • Các phần khác của mã khá tự giải thích. Chúng tôi sẽ tập trung vào dòng sau. 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    09
  • Dòng này làm hai việc
    1. Đẩy các thay đổi vào 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    10
    2. Thực hiện 
    const newEntity = [obj] => console.log[obj];

function mountEntity[]{
	this.entity = newEntity;
	console.log[`Entity ${this.entity} is mounted on ${this}`];
}

mountEntity.call[];
    6 với sự trợ giúp của phương pháp 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    8. Ở đây, phương thức 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    8 [như đã giải thích trong các phần trước] sẽ thực thi phương thức 
    const newEntity = [obj] => console.log[obj];

function mountEntity[]{
	this.entity = newEntity;
	console.log[`Entity ${this.entity} is mounted on ${this}`];
}

mountEntity.call[];
    6 với một giá trị mới cho đối tượng 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7 có trong phương thức 
    const newEntity = [obj] => console.log[obj];

function mountEntity[]{
	this.entity = newEntity;
	console.log[`Entity ${this.entity} is mounted on ${this}`];
}

mountEntity.call[];
    6

Bây giờ hãy xem cách chúng ta sẽ thực thi hàm 

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
17. Cách tiếp cận dưới đây để thêm một phương thức mới vào kiểu dữ liệu nguyên thủy hiện có không được khuyến nghị nhưng chúng tôi vẫn sẽ làm điều đó vì mục đích của bài viết này

GHI CHÚ. không làm theo cách tiếp cận dưới đây trong mã sản xuất của bạn. Điều này có thể gây ra thiệt hại cho mã hiện có

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
5

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
18 chúng tôi tạo một thuộc tính mới bên trong 
function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
19

Khi điều này được thực hiện, chúng ta có thể bắt đầu thực hiện chức năng bản đồ mới của mình trên một mảng

function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
6

Tóm lược

Bài viết này đã cho bạn thấy chức năng gọi, áp dụng và liên kết có thể thực hiện thông qua các ví dụ

Vì vậy, để nói về các chức năng này một cách ngắn gọn

  • Gọi, áp dụng và liên kết là các hàm giúp bạn thay đổi ngữ cảnh của từ khóa 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    7 có trong hàm gọi
  • Chúng ta đã thấy mỗi hàm có thể được gọi theo những cách khác nhau như thế nào – ví dụ: với 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    9 bạn có thể thực thi một hàm với một mảng đối số và với hàm 
    function Car[type, fuelType]{
	this.type = type;
	this.fuelType = fuelType;
}

function setBrand[brand]{
	Car.call[this, "convertible", "petrol"];
	this.brand = brand;
	console.log[`Car details = `, this];
}

function definePrice[price]{
	Car.call[this, "convertible", "diesel"];
	this.price = price;
	console.log[`Car details = `, this];
}

const newBrand = new setBrand['Brand1'];
const newCarPrice = new definePrice[100000];
    8 bạn có thể thực hiện tương tự nhưng các đối số được phân bổ bằng dấu phẩy
  • Các chức năng này thực sự hữu ích trong các thành phần dựa trên lớp của React

Cảm ơn bạn đã đọc

Theo dõi tôi trên Twitter, GitHub và LinkedIn

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

Keyur Paralkar

Nhà phát triển front-end👨‍💻;

Nếu bạn đọc đến đây, hãy tweet cho tác giả để cho họ thấy bạn quan tâm. Tweet một lời cảm ơn

Học cách viết mã miễn phí. Chương trình giảng dạy nguồn mở của freeCodeCamp đã giúp hơn 40.000 người có việc làm với tư cách là nhà phát triển. Bắt đầu

Làm cách nào để tạo hàm liên kết trong JavaScript?

Phương thức bind[] JavaScript .
fn. .
hãy để người = { tên. 'John Doe', getName. hàm [] { bảng điều khiển. nhật ký [cái này. Tên]; . getName, 1000];.
chưa xác định. .
setTimeout[người. getName, 1000];.
đặt f = người. getName; . .
setTimeout[function[] { người. getName[];

Làm cách nào để gọi[] apply[] và bind[] trong JavaScript?

Sử dụng. gọi[] hoặc. apply[] khi bạn muốn gọi hàm ngay lập tức và sửa đổi ngữ cảnh. Gọi/áp dụng gọi hàm ngay lập tức, trong khi liên kết trả về một hàm mà khi được thực thi sau đó, sẽ có ngữ cảnh chính xác được đặt để gọi hàm ban đầu .

Liên kết hoạt động như thế nào trong JavaScript?

bind là một phương thức trên nguyên mẫu của tất cả các hàm trong JavaScript. Nó cho phép bạn tạo một hàm mới từ một hàm hiện có, thay đổi this context của hàm mới và cung cấp bất kỳ đối số nào mà bạn muốn hàm mới được gọi.

Làm cách nào để liên kết dữ liệu trong JavaScript?

Ràng buộc dữ liệu trong khái niệm khá đơn giản. Một mặt, bạn có mô hình dữ liệu và mặt khác, bạn có giao diện, thường được gọi là dạng xem. Ý tưởng là bạn muốn "liên kết" một số phần dữ liệu với thứ gì đó trên dạng xem để khi dữ liệu thay đổi, dạng xem sẽ thay đổi. Đây là điển hình cho dữ liệu chỉ đọc

Bài Viết Liên Quan

Tôi có thể sử dụng cheatsheet không?
Học Python và JavaScript cùng lúc có ổn không?
Truy vấn hoạt động như thế nào trong mysql?
Câu hỏi phỏng vấn javatpoint trong python
Làm cách nào để tạo tệp csv và lưu tệp vào thư mục trong php?
Giá vé WE Fest 2023
163ZB bằng bao nhiêu GB?
Python lộn xộn
Tôi có thể học excel trong một ngày không
Tải tệp html góc vào div
Download giải nén file php
Xóa cuối dòng Python
Cái nào tốt hơn let hoặc var trong JavaScript?
Thứ Sáu Tuần Thánh có phải là ngày lễ của Stat ở Ontario năm 2023 không?
Div in javascript
Làm cách nào để lọc theo tên trong PHP?
Chuyển đổi HTML sang VBA trực tuyến
Không bằng nhau trong câu lệnh if PHP
Cảnh báo: htmlspecialchars() dự kiến ​​tham số 1 là chuỗi, mảng được cung cấp trong prestashop
Bạn có thể so sánh hai mảng trong JavaScript không?

Toplist mới

#1
Top 7 sự tích hồ gươm - ngữ văn lớp 6 2023
6 tháng trước
#2
Top 7 gdcd 6 bài 1 kết nối tri thức 2023
6 tháng trước
#3
Top 7 ý nghĩa của xây dựng gia đình văn hóa 2023
6 tháng trước
#4
Top 6 mẫu hợp đồng mượn đất làm nhà xưởng 2023
6 tháng trước
#5
Top 3 tổng tài biến thái tôi yêu anh tập 27 2023
6 tháng trước
#6
Top 6 kết thực phim mỹ nhân vô lệ 2023
6 tháng trước
#7
Top 9 trong những câu thơ sau câu nào sử dụng thành ngữ 2023
6 tháng trước
#8
Top 8 đề tài và chủ de của tác phẩm tắt đèn 2023
6 tháng trước
#9
Top 5 tiểu sử của thầy thích pháp hòa 2023
6 tháng trước

Bài mới nhất

Hạt giống nguyên chủng là gì năm 2024
De thi học kì 1 hóa 9 tphcm năm 2024
Hay mộng tinh là bệnh gì năm 2024
Nước ta bắt đầu khai thác dầu mỏ năm nào năm 2024
Phục hồi nút erase trong cs6 bị lỗi năm 2024
Nhung loai rau cu tot cho gan và tiên hóa năm 2024
Thu nhập trung bình của quản lý nhà hàng năm 2024
Kiến bu quần lót là hiện tượng gì năm 2024

Chủ Đề

programming Hỏi Đáp Toplist Là gì Bài Tập Địa Điểm Hay Mẹo Hay Học Tốt Nghĩa của từ Công Nghệ Khỏe Đẹp bao nhiêu Top List Tiếng anh Bao nhiêu Sản phẩm tốt Xây Đựng Ngôn ngữ javascript Ở đâu Đại học Hướng dẫn Bài tập Tại sao Dịch So Sánh Máy tính Món Ngon mẹo hay Bao lâu Thế nào So sánh Khoa Học Vì sao Lớp 9 Lớp 10