Hai kiểu lập trình viên

Hai kiểu lập trình viên

Cuộc sống mà, luôn có hai kiểu lập trình viên, một kiểu luôn nắm vững lý thuyết, kiểu còn lại thì không.

Những người nắm vững lý thuyết thì luôn có năng suất làm việc cao hơn hẳn những người không học lý thuyết, vì không phải tốn thời gian để thử sai (trial and error), cũng không cần tốn thời gian tra cứu lại kiến thức.

Một ví dụ đơn giản về CSS, chúng ta có class .gift-image có thuộc tính top = 10px, và chúng ta muốn class này có thuộc tính top = 0 trên các thiết bị có màn hình nhỏ hơn 600px:

.gift-box {
    .gift-image {
        &.openned {
            position: absolute;
            top: 10px;
            ...
        }
    }
    
    @media (max-width: 600px) {
        .gift-image {
            top: 0;
        }
    }
}

Nhưng đoạn code trên sẽ không chạy, và trên mobile, class .gift-image vẫn có thuộc tính top = 10px.

Một frontend developer không nắm vững kiến thức sẽ fix vấn đề trên như sau:

@media (max-width: 600px) {
    .gift-image {
        top: 0 !important;
    }
}Code language: CSS (css)

Hoặc tốn 10 phút để search Google với một vấn đề không liên quan: position absolute top not change in media query.

Ngược lại, một frontend developer nắm vững kiến thức về CSS specificity ^[1] [2] sẽ fix vấn đề trên một cách dễ dàng mà không cần dùng tới !important:

@media (max-width: 600px) {
    .gift-image.openned {
        top: 0;
    }
}Code language: CSS (css)

Và thậm chí còn đạt tới cảnh giới code xong không cần test, sure đúng 100%, push lên thẳng master luôn, rồi để cho junior nó fix =)))

Ví dụ trên chưa có phần giải thích, để dành cho anh em đọc xong tự giải thích 

Đọc thêm:

1. Calculating a selector’s specificity, https://www.w3.org/TR/selectors-3/#specificity ↩
2. MDN CSS, Specificity, https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity ↩

Các bạn có thể tham khảo các bài viết hay về JavaScript tại đây.

---

Hãy tham gia nhóm Học lập trình để thảo luận thêm về các vấn đề cùng quan tâm.