Bài này Thế giới JS share cho ae các lỗi thường gặp khi lập trình với javascript, từ đó ae dễ dàng code hơn. JavaScript là một ngôn ngữ dễ dàng để bắt đầu sử dụng, nhưng để đạt được thành thạo thì cần rất nhiều nỗ lực, thời gian và sự kiên nhẫn. Những người mới bắt đầu thường mắc phải một số sai lầm quen thuộc và chúng quay trở lại và cắn họ. Trong bài viết này, chúng tôi sẽ đề cập đến một số lỗi phổ biến nhất mà mọi người mắc phải và tìm ra cách khắc phục chúng. Nhiều mẹo trong số này sẽ được áp dụng bên ngoài JavaScript hoặc thậm chí là phát triển web.
1.phân biệt chữ hoa chữ thường
Các biến và tên hàm có phân biệt chữ hoa chữ thường. Và, hãy nhớ rằng hàm javascript gốc và thuộc tính CSS trong javascript là camelCase.
Thí dụ:
// https://vpsus.vn/
// https://www.facebook.com/groups/893052378563701
// https://twitter.com/thegioijs
// it should be 'Id' not 'ID'
getElementById('wkc') != getElementByID('vpsus');
// 'Wikicode' again does not equal 'WikiCode'
getElementById('wkc') != getElementById('vpsus');
2.Sử dụng toán tử so sánh câu lệnh ‘IF’ không chính xác
Chúng ta đang nói về toán tử “==” và toán tử “=”. Cái đầu tiên thực hiện so sánh và cái thứ hai gán giá trị cho một biến. Lỗi được tạo tùy thuộc vào ngôn ngữ. Một số ngôn ngữ sẽ đưa ra lỗi, nhưng JavaScript thực sự sẽ đánh giá câu lệnh và trả về đúng hoặc sai.
Thí dụ:
// https://vpsus.vn/ // https://www.facebook.com/groups/893052378563701 // https://twitter.com/thegioijs // This if statement returns false (as expected) because x is not equal to 5: var x = 0; if (x == 5); // This if statement returns true (not expected) and Assigns 5 to x: var x = 0; if (x = 5);
Javascript được import lỏng lẻo, ngoại trừ trong các câu lệnh chuyển đổi. JavaScript KHÔNG được nhập lỏng lẻo khi so sánh trường hợp.
Thí dụ:
// https://vpsus.vn/
// https://www.facebook.com/groups/893052378563701
// https://twitter.com/thegioijs
var myVar = 5;
if(myVar == '5'){
// returns true since Javascript is loosely typed
alert('Welcome to vpsus');
}
switch(myVar){
case '5':
// this alert will not show since the data types don't match
alert('Welcome to vpsus');
}
3.Quên sử dụng ‘this’
Một sai lầm phổ biến khác là quên sử dụng ‘this’. Các hàm được xác định trên một đối tượng JavaScript truy cập các thuộc tính trên đối tượng JavaScript đó và không sử dụng mã định danh tham chiếu ‘this’.
Thí dụ:
// https://vpsus.vn/
// https://www.facebook.com/groups/893052378563701
// https://twitter.com/thegioijs
// the following is incorrect:
function myFunction() {
var myObject = {
objProperty: "vpsus welcomes you",
objMethod: function() {
alert(objProperty);
}
};
myObject.objMethod();
}
myFunction();
// the following is correct:
function myFunction() {
var myObject = {
objProperty: "vpsus welcomes you",
objMethod: function() {
alert(this.objProperty);
}
};
myObject.objMethod();
}
myFunction();
4.Không xác định != null
Trong JavaScript, undefined nghĩa là biến đã được khai báo nhưng chưa được gán giá trị, null là giá trị gán. Nó có thể được gán cho một biến dưới dạng đại diện không có giá trị.
Thí dụ:
// https://vpsus.vn/ // https://www.facebook.com/groups/893052378563701 // https://twitter.com/thegioijs // undefined let TestVar; console.log(TestVar); // shows undefined console.log(typeof TestVar); // shows undefined // null let TestVar = null; console.log(TestVar); // shows null console.log(typeof TestVar); // shows object // it is clear that undefined and null are two distinct types: // undefined is a type itself (undefined) while null is an object. null === undefined // false null == undefined // true null === null // true
5.Nhầm lẫn cộng và nối
Phép cộng là phép cộng số và phép nối là phép cộng chuỗi. Trong JavaScript, cả hai thao tác đều sử dụng cùng một toán tử ‘+’. Do đó, việc thêm một số dưới dạng số sẽ tạo ra kết quả khác với việc thêm một số dưới dạng chuỗi và rất nhiều người mới bắt đầu nhầm lẫn về điều này.
Thí dụ:
// the result in x is 30 var x = 5 + 25; // the result in x is '525' var x = 5 + '25';
6.Không hiểu cách phạm vi hoạt động:
Một khái niệm khó hiểu đối với người mới bắt đầu là quy tắc phạm vi và ngoặc đóng của JavaScript. Các hàm duy trì khả năng hiển thị đối với các biến trong phạm vi cha của chúng. Nhưng bởi vì chúng ta đang trì hoãn việc thực thi với một setTimeout, khi đến lúc các hàm thực sự chạy, vòng lặp đã kết thúc và biến I được tăng lên 6.
Chức năng tự thực hiện trong nhận xét hoạt động, bởi vì nó sao chép biến I theo giá trị và giữ một bản sao riêng cho mỗi chức năng hết thời gian chờ.
Thí dụ:
// Output will be 6
for(var i = 0; i < 5; i++){
setTimeout(function(){
console.log(i+1);
}, 100*i);
}
Bạn càng hiểu rõ hơn lý do và cách JavaScript hoạt động và không hoạt động, mã của bạn sẽ càng vững chắc và bạn càng có thể khai thác hiệu quả sức mạnh thực sự của ngôn ngữ và cải thiện. Ngược lại, việc thiếu hiểu biết đúng đắn về các mô hình và khái niệm JavaScript thực sự là nguyên nhân gây ra nhiều vấn đề về JavaScript.
Trên đây là tất cả những gì về Lỗi thường gặp trong javascript mà bạn cần biết. Nếu bạn có bất kỳ câu hỏi liên quan tới Lỗi thường gặp, hãy chủ động liên hệ và inbox cho chúng tôi, để giúp đỡ bạn sớm nhất
Tiếp theo, hãy cùng Thế giới JS tìm hiểu thêm các kiến thức về Javascript trong các bài tiếp theo trong series học miễn phí Javascript từ cơ bản tới nâng cao.
Nếu bạn cảm thấy hữu ích và yêu thích Thế giới JS, hãy tham gia và theo dõi chúng tôi để nhận thêm nhiều kiến thức MIỄN PHÍ hơn nữa nhé:
Share to learn more than!
