Tự dạy cho mình một số mẹo và thủ thuật mạnh mẽ mà hầu hết các nhà phát triển không biết

JavaScript là ngôn ngữ phổ biến nhất và được sử dụng nhiều nhất do các chức năng của nó và cộng đồng rộng rãi. Tôi đang sử dụng JS làm ngăn xếp chính của mình trong 5 năm qua và vẫn còn rất nhiều khái niệm mà tôi vẫn chưa biết nhưng trong những năm này, tôi đã tìm ra nhiều mẹo và thủ thuật giúp ích cho tôi. Vì vậy, là một nhà phát triển JS, bạn nên biết một số điều.

Thời gian hiệu suất

Bạn muốn kiểm tra xem mã của bạn mất bao nhiêu thời gian để thực thi? Đơn giản thôi, JS có performance.now()phương thức sẽ trả về thời gian trong ms(milisecond)Bạn có thể xem xét phương thức của mình để tìm ra thời gian thực thi.

const firstTime = performance.now()
something()
const secondTime = performance.now()
console.log(`Average time function took ${secondTime - firstTime} milliseconds`)

Nó thực sự đơn giản, hãy thực hiện hoán đổi:

let p = 99, q = 100
[a, b] = [b, a]
console.log(a) // result -> 100
console.log(b) // result -> 99

Như các bạn đã biết phương pháp truyền thống để chuyển số thành chuỗi và chuỗi thành số:

let num = 100
let numTostring = num.toString()
let str = "100"
let strToNum = Number(str)

let num = 100
let str = "100"
let numTostring = num + "" // number to string
let strToNum = +s  // string to number

Kế thừa chức năng là quá trình kế thừa các tính năng bằng cách áp dụng một chức năng bổ sung cho một thể hiện đối tượng. Hàm cung cấp một phạm vi đóng mà bạn có thể sử dụng để giữ một số dữ liệu riêng tư. Hàm tăng cường sử dụng phần mở rộng đối tượng động để mở rộng cá thể đối tượng với các thuộc tính và phương thức mới. Để biết thêm đọc ở đây

// Base function
let drinks = (data) => {
  let res = {} // Create an empty object
  that.name = data.name // Add it a "name" property
  return res // Return the object
};

// Fuction which inherits from the base function
let coffee = (data) => {
  // Create the Drinks object
  let res = Drinks(data)
  // Extend base object
  that.giveName = function() {
    return 'This is ' + that.name
  };
  return res
};

// Usage
let firstCoffee = Coffee({ name: 'Cappuccino' })
console.log(firstCoffee.giveName())
// Output: "This is Cappuccino"

CÁI GÌ .map()cũng đã thay thế? ĐÚNG:

let person = [
    { name: ‘Shampp’, age: 2 },
    { name: ‘Piter’, age: 4},
    { name: ‘Gabba’, age: 5},
    { name: ‘Siku’, age: 4},
    { name: ‘Pinku’, age: 5},
    { name: ‘Furry’, age: 9},
]


let personNames = Array.from(person, ({name}) => name)
console.log(personNames) 
// returns [“Shampp”, “Piter”, “Gabba”, “Siku”, “Pinku”, “Furry"]

Vâng, một lợi thế của lengthtài sản mà hầu hết chúng ta không biết! Hãy xem ví dụ:

let array_values = [1, 2, 3, 4, 5, 6, 7, 8]  
console.log(array_values.length) 
// 8  
array_values.length = 5  
console.log(array_values.length) 
// 5  
console.log(array_values) 
// [1, 2, 3, 4, 5]
array_values.length = 0
console.log(array_values)
//[]

Nếu bạn muốn bỏ qua chỉ mục và vẫn cần lặp lại dữ liệu với forHãy kiểm tra một cách khác để sử dụng forvòng lặp

const names = ["Shampp", "Gabba", "Pinku"];

// Long Version
for (let i = 0; i < names.length; i++) {
  const name = names[i]
  console.log(name)
}

// Short Version
for (let name of names) console.log(name)

Đa hình là một khái niệm Ngôn ngữ lập trình hướng đối tượng . Đơn giản là nó cung cấp khả năng tạo một thuộc tính, một chức năng hoặc một đối tượng có một và nhiều cách triển khai. Tương tự bạn có thể đạt được trong JS. Hãy hiểu nó bằng một ví dụ:

function Employee(name) {
    this.name = name;
    this.getName = () => {
        return this.name
    }
}

const employee = new Employee("sandy")

console.log(employee.getName()) // sandy

Employee.prototype.getDetails = function () {
    return this.name.toUpperCase()
}

console.log(employee.getDetails()) // SANDY

class Shape {
    area() {
        return 0
    }
}

class Circle extends Shape {
    constructor (radius) {
        super(); // needed to use this
        this.radius = radius
    }

    area() {
        return Math.PI * this.radius * this.radius
    }
}

class Rectangle extends Shape {
    constructor (width, height) {
        super()
        this.width = width
        this.height = height
    }

    area() {
        return this.width * this.height
    }
}

const circle = new Circle(2)
const rectangle = new Rectangle(5, 6)

console.log(circle.area())
console.log(rectangle.area())

Vì vậy, đây là tất cả những gì tôi muốn chia sẻ với các bạn, Hy vọng các bạn đã học tập tốt cho đến nay. Cảm ơn bạn đã đọc.

Nội dung khác tại plainenglish.io