Dạo 1 vòng thấy có bài viết về console javascript hay quá. Toàn hàm mình không biết. Nên lấy ra 1 số hàm hay mà ít người biết đến để mọi người tham khảo. Có cả ảnh đính kèm luôn
Các vị trí tuyển dụng JavaScript lương cao hấp dẫn tại TopDev
bảng điều khiển. nhật ký[]
Đây là hàm mà chắc ai cũng biết đến nó rồi. Thế nhưng tham số bên trong nó thì lại ít người để ý đến
Đoạn văn bản ở trong bảng điều khiển hàm. log[] có thể được thay thế bằng biểu mẫu như bên dưới
- %o / %O – cho đối tượng;
- %d / %i – cho số nguyên;
- %s – cho chuỗi;
- %f – cho số dấu chấm động; bảng điều khiển. log[“Giá trị đối tượng. %o với chuỗi thay thế”, {string. “str”, số. 10}];
after after %o could replace by object. Khi đó trên bảng điều khiển hiển thị như sau
Điểm đặc biệt hơn nữa là có thể sử dụng CSS trong bảng điều khiển. log[] được
console.log["Example %cCSS-styled%c %clog!",
"color: red; font-family: monoscope;",
"",
"color: green; font-size: large; font-weight: bold"];
Hơi khó nhìn 1 chút, nhưng ở ví dụ trên mình để 3 cái tham số %c, và sau đó gắn thêm 3 giá trị vào thì nó hiện ra như sau
Đúng là phát tán thật. Show are both css in console javascript
bảng điều khiển. nhóm[]
Điều này chắc chắn ít ai sử dụng. Mình cũng vậy. Lần đầu tiên nghe tên
Mục đích của mục đích này là để tạo nhóm, các nhóm kết quả lại với nhau. Giúp việc hiển thị cũng dễ nhìn hơn
Cách dùng như sau
console.group[];
console.log["Inside 1st group"];
console.group[];
console.log["Inside 2nd group"];
console.groupEnd[];
console.groupEnd[];
console.log["Outer scope"];
And here is results
Khi hiển thị ra bảng điều khiển, chúng ta có thể đóng, mở đều được cả [ấn vào cái nút tam giác]
Hơn nữa, nó có cả bảng điều khiển phương thức. nhómCollapsed[]
Vì hàm console. group[] cái này có thể đóng, mở lại khối khi hiển thị trên bảng điều khiển nên sẽ tổng hợp lại và giúp xuất ra bảng điều khiển trông rất dễ nhìn
Tuy nhiên, số lượng nhóm với groupCollapsed **mà không bằng với số lượng **GroupEnd thì lúc đó hiển thị nó hơi kỳ. Giống như thẻ tag trong html vậy. Thẻ đã mở thì phải có chỗ để đóng thẻ
Làm vậy để không quên, khi viết hàm group[] thì cố gắng viết luôn hàm GroupEnd[] ở bên dưới là tốt nhất
bảng điều khiển. dấu vết[]
Nếu ai lập trình nhiều PHP hay các ngôn ngữ khác thì cũng đều gặp cái hàm trace[] này rồi. Hàm này để đích đến là duyệt vết thôi
console.trace["Logging the way down here!"];
Khi đó sẽ hiển thị màn hình như sau
bảng điều khiển. cảnh báo[], bảng điều khiển. lỗi[]
based on level of log that we want to display or don't want to show the log ra screen. Trong javascript cũng có các kiểu hàm như vậy
Default, level is debug, it is not display ra console. Nếu chúng ta thay đổi sang cấp độ khác, thì nó sẽ hiển thị
Dưới đây là ví dụ
console.warn["This is a warning!"];
console.error["This is an error!"];
console.info["This is very informative!"];
console.debug["Debugging a bug!"];
console.assert[true, "This won't be logged!"];
console.assert[false, "This will be logged!"];
Kết quả sau khi thực hiện
bảng điều khiển. thời gian[]
Hàm này cũng gặp nhiều trong PHP rồi mà bây giờ mình mới biết nó trong javascript console
console.time[];
console.timeLog[];
console.timeEnd[];
And show the console as after
12 Thư viện JavaScript trực quan hóa dữ liệu hot nhất năm 2022
12 mẹo hay cho JavaScript
bảng điều khiển. đếm[]
Có cả chức năng **count[] **new bá. Cách dùng như sau
console.count[]; // default: 1
console.count[]; // default: 2
console.count[]; // default: 3
console.countReset[];
console.count[];
And show the console as after
Ngoài hàm count[] còn có thể truyền tham số được nữa. Ví dụ
console.count[];
console.count["for"];
console.count["if"];
console.count["if"];
console.countReset["if"];
console.count["for"];
console.count["if"];
console.count["if"];
console.countReset["if"];
console.count["for"];
console.countReset["for"];
console.count[];
Kêt quả như sau
bảng điều khiển. bàn[]
Hiển thị bảng trong html thì ai cũng gặp rồi, nhưng hiển thị **bảng **trong bảng điều khiển thì chắc ít người dùng chăng
console.table[[[0,1,2,3,4], [5,6,7,8,9]]];
And results when display ra console
nghệ thuật ASCII
Hàm này có nhiệm vụ đọc đầu vào là 1 tệp ảnh và chuyển đổi nó ra ASCII định dạng “nghệ thuật”. Các cụ thể cách sử dụng như sau
________số 8
Và kết quả khi hiển thị màn hình
Cái ảnh ví dụ trên mình dùng là cái ảnh này. https. //d2vqpl3tx84ay5. phía trước đám mây. net/500x/tumblrlsus01g1ik1qies3uo1400. png
Nhưng khi hiển thị ra thì nó lại ra dạng khác. New the first time know this way. Cũng khá thú vị
Kết luận
Các bạn thấy thế nào?
Mục đích của bài này chủ yếu chia sẻ cho bạn nào chưa biết sự tồn tại của 1 số hàm console javascript. Biết đâu đến 1 ngày nào đó mình lại cần