In JavaScript

Ghi thông báo vào bảng điều khiển là một cách rất cơ bản để chẩn đoán và khắc phục sự cố nhỏ trong mã của bạn

Nhưng, bạn có biết rằng có nhiều điều về

let x = 1
console.log["x:", x]
8 hơn là chỉ
let x = 1
console.log["x:", x]
9 không?

Bảng điều khiển soạn thảo nhiều dòng của Firefox

Nếu chưa từng sử dụng chế độ soạn thảo nhiều dòng trên Firefox, bạn nên thử ngay

Chỉ cần mở bảng điều khiển,

let x = 1
let y = 2
let z = 3
1 hoặc
let x = 1
let y = 2
let z = 3
2 và ở trên cùng bên phải, bạn sẽ thấy nút có nội dung "Chuyển sang chế độ trình chỉnh sửa nhiều dòng". Ngoài ra, bạn có thể nhấn
let x = 1
let y = 2
let z = 3
3

Điều này cung cấp cho bạn trình chỉnh sửa mã nhiều dòng ngay bên trong Firefox

bảng điều khiển. đăng nhập

Hãy bắt đầu với một ví dụ nhật ký rất cơ bản

let x = 1
console.log[x]

Nhập nó vào bảng điều khiển Firefox và chạy mã. Bạn có thể nhấp vào nút "Chạy" hoặc nhấn

let x = 1
let y = 2
let z = 3
4

Trong ví dụ này, chúng ta sẽ thấy "1" trong bảng điều khiển. Khá đơn giản, phải không?

Nhiều giá trị

Bạn có biết rằng bạn có thể bao gồm nhiều giá trị?

let x = 1
console.log["x:", x]

Nhưng nếu chúng ta có nhiều giá trị muốn ghi lại thì sao?

let x = 1
let y = 2
let z = 3

Thay vì gõ

let x = 1
let y = 2
let z = 3
5 ba lần, chúng ta có thể bao gồm tất cả. Và chúng ta cũng có thể thêm một chuỗi trước mỗi chuỗi nếu muốn

let x = 1
console.log["x:", x]
1

Nhưng đó là quá nhiều công việc. Chỉ cần bọc chúng bằng dấu ngoặc nhọn. Bây giờ bạn có một đối tượng với các giá trị được đặt tên

let x = 1
console.log["x:", x]
2
Đầu ra bảng điều khiển

Bạn có thể làm điều tương tự với một đối tượng

let x = 1
console.log["x:", x]
3

Nhật ký đầu tiên sẽ in các thuộc tính trong đối tượng người dùng. Cái thứ hai sẽ xác định đối tượng là "người dùng" và in các thuộc tính bên trong nó

Nếu bạn đang ghi nhiều thứ vào bảng điều khiển, điều này có thể giúp bạn xác định từng nhật ký

Các biến trong nhật ký

Bạn có biết rằng bạn có thể sử dụng các phần nhật ký của mình làm biến không?

let x = 1
console.log["x:", x]
4

Trong ví dụ này,

let x = 1
let y = 2
let z = 3
6 đề cập đến một tùy chọn chuỗi được bao gồm sau giá trị ban đầu. Điều này sẽ đề cập đến "John"

let x = 1
let y = 2
let z = 3
7 đề cập đến một tùy chọn chữ số được bao gồm sau giá trị ban đầu. Điều này sẽ đề cập đến 29

Đầu ra của tuyên bố này sẽ là. "John 29 tuổi. "

Các biến thể của nhật ký

Có một vài biến thể của nhật ký. Có

let x = 1
let y = 2
let z = 3
5 được sử dụng rộng rãi nhất. Nhưng cũng có

let x = 1
console.log["x:", x]
8

Các biến thể này thêm kiểu dáng vào nhật ký của chúng tôi trong bảng điều khiển. Chẳng hạn,

let x = 1
let y = 2
let z = 3
9 sẽ có màu vàng và
let x = 1
console.log["x:", x]
10 sẽ có màu đỏ

Ghi chú. Các phong cách khác nhau từ trình duyệt để trình duyệt

Nhật ký tùy chọn

Chúng tôi có thể in tin nhắn ra bàn điều khiển một cách có điều kiện với

let x = 1
console.log["x:", x]
11

let x = 1
console.log["x:", x]
2

Nếu đối số đầu tiên là sai, thì thông báo sẽ được ghi lại

Nếu chúng ta thay đổi

let x = 1
console.log["x:", x]
12 thành
let x = 1
console.log["x:", x]
13 thì tin nhắn sẽ không được ghi lại

Đếm

Bạn có biết rằng bạn có thể đếm bằng bảng điều khiển không?

let x = 1
console.log["x:", x]
5

Mỗi lần lặp của vòng lặp này sẽ in một số đếm ra bàn điều khiển. Bạn sẽ thấy "mặc định. 1, mặc định. 2", và cứ tiếp tục như vậy cho đến khi đạt 10

Nếu bạn chạy lại cùng vòng lặp này, bạn sẽ thấy số đếm tiếp tục ở nơi nó dừng lại;

Để đặt lại bộ đếm, chúng ta có thể sử dụng

let x = 1
console.log["x:", x]
14

Và, nếu bạn muốn đặt tên bộ đếm khác với tên "mặc định", bạn có thể

let x = 1
console.log["x:", x]
0

Bây giờ chúng tôi đã thêm nhãn, bạn sẽ thấy "Quầy 1, Quầy 2", v.v.

Và để đặt lại bộ đếm này, chúng ta phải chuyển tên vào

let x = 1
console.log["x:", x]
15. Bằng cách này, bạn có thể có nhiều bộ đếm chạy cùng lúc và chỉ đặt lại những bộ đếm cụ thể

theo dõi thời gian

Bên cạnh việc đếm, bạn cũng có thể tính thời gian như đồng hồ bấm giờ

Để bắt đầu hẹn giờ, chúng ta có thể sử dụng

let x = 1
console.log["x:", x]
16. Điều này sẽ không làm bất cứ điều gì một mình. Vì vậy, trong ví dụ này, chúng tôi sẽ sử dụng
let x = 1
console.log["x:", x]
17 để mô phỏng mã đang chạy. Sau đó, trong thời gian chờ, chúng tôi sẽ dừng bộ đếm thời gian của mình bằng cách sử dụng
let x = 1
console.log["x:", x]
18

let x = 1
console.log["x:", x]
1

Như bạn mong đợi, sau 5 giây, chúng ta sẽ có nhật ký kết thúc hẹn giờ là 5 giây

Chúng tôi cũng có thể ghi lại thời gian hiện tại của bộ hẹn giờ trong khi nó đang chạy mà không cần dừng nó. Chúng tôi làm điều này bằng cách sử dụng

let x = 1
console.log["x:", x]
19

let x = 1
console.log["x:", x]
2

Trong ví dụ này, chúng tôi sẽ nhận được

let x = 1
console.log["x:", x]
20 2 giây đầu tiên, sau đó là
let x = 1
console.log["x:", x]
21 5 giây của chúng tôi

Cũng giống như bộ đếm, chúng ta có thể gắn nhãn bộ hẹn giờ và chạy nhiều bộ đếm cùng một lúc

Các nhóm

Một điều khác mà bạn có thể làm với

let x = 1
console.log["x:", x]
9 là nhóm chúng lại. ?

Chúng tôi bắt đầu một nhóm bằng cách sử dụng

let x = 1
console.log["x:", x]
23. Và chúng tôi kết thúc một nhóm với
let x = 1
console.log["x:", x]
24

let x = 1
console.log["x:", x]
3

Nhóm nhật ký này sẽ có thể thu gọn. Điều này giúp dễ dàng xác định các bộ nhật ký

Theo mặc định, nhóm không bị thu gọn. Bạn có thể đặt nó ở chế độ thu gọn bằng cách sử dụng

let x = 1
console.log["x:", x]
25 thay cho
let x = 1
console.log["x:", x]
23

Nhãn cũng có thể được chuyển vào

let x = 1
console.log["x:", x]
27 để xác định chúng tốt hơn

dấu vết ngăn xếp

Bạn cũng có thể thực hiện theo dõi ngăn xếp với

let x = 1
console.log["x:", x]
8. Chỉ cần thêm nó vào một chức năng

let x = 1
console.log["x:", x]
4

Trong ví dụ này, chúng ta có các hàm rất đơn giản chỉ cần gọi nhau. Sau đó, trong chức năng cuối cùng, chúng tôi gọi

let x = 1
console.log["x:", x]
29

Đầu ra bảng điều khiển

Những cái bàn

Đây là một trong những cách sử dụng tuyệt vời nhất cho bảng điều khiển.

let x = 1
console.log["x:", x]
30

Vì vậy, hãy thiết lập một số dữ liệu để đăng nhập

let x = 1
console.log["x:", x]
5

Bây giờ chúng tôi sẽ ghi lại dữ liệu này bằng cách sử dụng

let x = 1
console.log["x:", x]
31

Đầu ra bảng điều khiển

Nhưng chờ đợi, nó sẽ tốt hơn

Nếu chúng ta chỉ muốn các thương hiệu, chỉ cần

let x = 1
console.log["x:", x]
32

Đầu ra bảng điều khiển

Làm thế nào về một ví dụ phức tạp hơn?

let x = 1
console.log["x:", x]
6

Ở đây chúng tôi chỉ in "tên" và "email". Nếu bạn

let x = 1
console.log["x:", x]
33 tất cả dữ liệu, bạn sẽ thấy rằng có nhiều thuộc tính hơn cho mỗi người dùng

Phong cách ?

Bạn có biết rằng bạn có thể sử dụng các thuộc tính CSS để tạo kiểu cho nhật ký của mình không?

Để làm điều này, chúng tôi sử dụng

let x = 1
console.log["x:", x]
34 để chỉ định rằng chúng tôi có các kiểu để thêm. Các kiểu được chuyển vào đối số thứ hai của
let x = 1
console.log["x:", x]
9

let x = 1
console.log["x:", x]
7

Bạn có thể sử dụng điều này để làm cho nhật ký của bạn nổi bật

Xa lạ

Nếu bạn đang cố khắc phục sự cố bằng cách sử dụng nhật ký, bạn có thể làm mới rất nhiều và bảng điều khiển của bạn có thể bị lộn xộn

Chỉ cần thêm

let x = 1
console.log["x:", x]
36 vào đầu mã của bạn và bạn sẽ có một bảng điều khiển mới mỗi khi bạn làm mới. ?

Chỉ cần không thêm nó vào dưới cùng của mã của bạn, lol

Cảm ơn vì đã đọc

Nếu bạn muốn xem lại các khái niệm trong bài viết này qua video, bạn có thể xem phiên bản video này tôi đã thực hiện tại đây

YouTube. Có nhiều thứ để điều khiển hơn là nhật ký

Tôi là Jesse đến từ Texas. Hãy xem nội dung khác của tôi và cho tôi biết cách tôi có thể giúp bạn trên hành trình trở thành nhà phát triển web.

  • Đăng ký YouTube của tôi
  • nói xin chào. Instagram. Twitter
  • Hãy đăng ký để nhận thư mới từ tôi

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

Hội trường Jesse

Tutorials for all things ?‍? Let me help you on your journey to becoming a web developer. Support me by subscribing to my YouTube channel ▶️ and newsletter ? codeSTACKr.com

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 mã nguồn mở của freeCodeCamp đã giúp hơn 40.000 người có đượ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 để in biểu mẫu trong JavaScript?

JavaScript giúp bạn triển khai chức năng này bằng cách sử dụng chức năng in của đối tượng cửa sổ . Cửa sổ chức năng in JavaScript. print[] in trang web hiện tại khi được thực thi. Bạn có thể gọi hàm này trực tiếp bằng sự kiện title như trong ví dụ sau.

Làm cách nào để in trong JavaScript đầu cuối?

log[] Bạn nên sử dụng bảng điều khiển. phương thức log[] để in ra bảng điều khiển JavaScript. Hàm nhật ký bảng điều khiển JavaScript chủ yếu được sử dụng để gỡ lỗi mã vì nó làm cho JavaScript in đầu ra ra bảng điều khiển.

Làm cách nào để có đầu ra trong JavaScript?

Đầu ra JavaScript .
Viết vào hộp cảnh báo, sử dụng cửa sổ. báo động[]
Viết vào đầu ra HTML bằng tài liệu. viết[]
Viết vào phần tử HTML, sử dụng InternalHTML
Viết vào bảng điều khiển trình duyệt, sử dụng bảng điều khiển. nhật ký[]

Làm cách nào để in một biến trong JavaScript?

log[] là một hàm trong JavaScript được sử dụng để in bất kỳ loại biến nào được xác định trước trong đó hoặc chỉ in bất kỳ thông báo nào cần hiển thị cho người dùng. cú pháp. bảng điều khiển. nhật ký[""];

Chủ Đề