HomeLập trìnhJavaScriptCómo imprimir en...

Cómo imprimir en la consola en JS


Artículo original escrito bởi: Jesse Hall
Bản gốc Artículo: Ví dụ JavaScript Console.log() – Cách in ra bảng điều khiển trong JS
Thương hiệu và chuyển thể bởi: Rafael D. Hernandez

Registrar mensajes en la consola es a forma muy básica de diagnosticar y solucionar problemsas menores en el código.

Tuy nhiên, ¿sabías que hay more opciones con la consola que log? Trong bài viết này, hiếm nhất cómo imprimir en la consola en JS, así como todas las cosas que no sabías que la consola podía hacer.

Bảng điều khiển nhiều phiên bản của Firefox

Nếu một năm sau đó, bạn có thể sử dụng chế độ soạn thảo đa dạng trên Firefox, bạn sẽ thấy rất tiếc!

Simplemente, abre la consola, Ctrl + Shift + K o F12, y en la parte superior derecha verá un botón que dice “Cambiar al modo de editor multilínea”. Các phương pháp thay thế, tùy chọn Ctrl + B.

Đây là một trình soạn thảo có nhiều tùy chọn trực tuyến khác nhau trong Firefox.

bảng điều khiển.log

Comencemos với một ejemplo de registro muy básico.

let x = 1
console.log(x)

Ghi eso en la console de Firefox y ejecuta el codigo. Bạn có thể nhấp vào nút “Chạy” ở chế độ ưu tiên Ctrl+Enter.

Ví dụ, deberíamos ver “1” en la consola. Bastante sencillo, ¿verdad?

Nhiều Valores

¿Sabías que puedes bao gồm nhiều giá trị? Agrega una cadena al principio para nhận dạng fácilmente qué es lo que está registrando.

let x = 1
console.log("x:", x)

Vì vậy, bạn có nên đăng ký tên miền không?

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

En lugar de escribir console.log() tres veces podemos incluirlos todos. Y podemos añadir una cadena antes de cada uno de ellos, si queremos también.

let x = 1
let y = 2
let z = 3
console.log("x:", x, "y:", y, "z:", z)

Pero eso es demasiado trabajo. ¡Simplemente envuelve con llaves! Ahora se obtiene un objeto con los valores nombrados.

let x = 1
let y = 2
let z = 3
console.log( {x, y, z} )
Đầu ra bảng điều khiển
Đầu ra bảng điều khiển

Puedes hacer lo mismo con un objeto.

let usuario = {
  nombre: 'Jesse',
  contacto: {
    correoElectronico: '[email protected]'
  }
}
console.log(usuario)
console.log({usuario})

Cơ quan đăng ký sơ bộ đã tạo tiền đề cho các đối tượng sử dụng. Thứ hai, việc xác định đối tượng có thể là “usuario” và bắt buộc phải có các sản phẩm tiếp theo.

Đọc thêm  Mô hình đồng thời JavaScript và vòng lặp sự kiện

Nếu bạn đăng ký nhiều như vậy trong điều khiển, thì bạn có thể có một nhà đăng ký cada nhận dạng.

Các biến trong sổ đăng ký

Bạn có thể sử dụng các biến đăng ký như biến không?

console.log("%s tiene %d anios de edad.", "John", 29)

En este ejemplo, %s se refiere a una opción de cadena incluida después del valor inicial. Esto se giới thiệu một “Juan”.

%d se referiere a una opción de dígitos incluida después del valor inicial. Esto se referiría a 29.

El resultado de esta declaración será: “Juan tiene 29 anios de edad.”.

Phương thức đăng ký

Hay algunas variaciones de registro. Aquí tienes la más usada console.log(). Pero también hay:

console.log('Consola de Registro')
console.info('Consola de Informacion')
console.debug('Console de Depuracion')
console.warn('Consola de Aviso')
console.error('Consola de Error')

Estas variaciones añaden estilo a nuestros registros en la consola. Ví dụ, la advertencia (warn) será de color amarillo, y el error sera de color rojo.

Lưu ý: Los estilos varían de un navergador a otro.

Tùy chọn đăng ký

Podemos imprimir mensajes a la condicionalmente condicionalmente console.assert().

let estaFuncionando = false
console.assert(estaFuncionando, "esta es la razón por la que")

Nếu lập luận cơ bản là sai, thì đó là thông tin đăng ký.

Si cambiamos estaFuncionando một trueel mensaje no se đăng ký.

contador

¿Sabías que puedes contar con la consola?

for(i=0; i<10; i++){
  console.count()
}

Cada iteración de este bucle imprimirá un recuento en la console. Verá “predeterminado: 1, predeterminado: 2”, y así sucesivamente hasta que llegue a 10.

Nếu bạn nói rằng nó không giống nhau, thì bạn vẫn có thể tiếp tục làm điều đó; 20-11.

Để khôi phục lại bộ điều khiển có thể sử dụng console.countReset().

Y, si deseas nombrar el contador a algo que no sea “predeterminado”, ¡puede hacerlo!

for(i=0; i<10; i++){
  console.count('Contador 1')
}
console.countReset('Contador 1')

Ahora que hemos agregado una etiqueta, verás “Contador 1, Contador 2”, and así sucesivamente.

Đọc thêm  Hàm gọi lại trong JavaScript là gì? Hướng dẫn ví dụ về cuộc gọi lại JS

Y para restablecer este contador, tenemos que pasar el nombre a countReset. Trong thời gian này, có thể có nhiều loại bộ điều khiển khác nhau có chức năng sai thời gian và bộ ổn định một mình cũng có những đặc điểm cụ thể.

Tiempo de seguimiento

Además de contar, también puedes cronometrar algo como un cronómetro.

Para iniciar un contador podemos usar la console.time(). Esto no hará nada por sí solo. Por lo tanto, en este ejemplo, usaremos setTimeout() para emular código en ejecución. Luego, dentro del tiempo de espera, detendremos nuestro temporizador usando la console.timeEnd().

console.time()
setTimeout(() => {
  console.timeEnd()
}, 5000)

Như một kỷ nguyên đặc biệt, sau 5 giây, xu hướng đăng ký hoàn thiện thời gian của 5 giây.

También podemos registrar la hora fact de nuestro tiempo mienras se está ejecutando, sin detenerlo. Hacemos esto usando la console.timeLog().

console.time()

setTimeout(() => {
  console.timeEnd()
}, 5000)

setTimeout(() => {
  console.timeLog()
}, 2000)

En este ejemplo, obtendremos nuestro 2 giây timeLog mồi, thứ hai 5 giây timeEnd.

Tất cả những gì người đối lập có thể làm là nghi thức của người tạm thời và các biến thể khác nhau của thời gian khác nhau.

nhóm

Otra cosa que puedes hacer con log es, ¿agruparlos?

Comenzamos un nhóm usando la console.group(). Y terminamos un nhóm con console.groupEnd().

console.log('No estoy en un grupo')

console.group()
console.log('Estoy en un grupo')
console.log('También estoy en un grupo')
console.groupEnd()

console.log('No estoy en un grupo')

Nhóm đăng ký này có thể hợp lệ. Esto facilita la identificación de conjuntos de registerros.

De forma predeterminada, el group no está contraído. Puede configurarlo en contraído mediante la console.groupCollapsed() en lugar de console.grupo().

Las etiquetas también se pueden pasar al grupo() para identificarlas mejor.

Seguimiento de pila

También puede hacer un seguimiento de pila con la console. Đơn giản, đó là một chức năng.

function one() {
  two()
}
function two() {
  three()
}
function three() {
  console.trace()
}
one()

Trong ví dụ này, các chức năng của các chức năng đơn giản nhất mà bạn có thể làm được. Luego, en la última función, lạc đà không bướu console.trace().

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

bảng

Este es uno de los usos more alucinantes para consolas: console.table().

Vì bạn cần cấu hình cả dữ liệu cho công ty đăng ký:

let dispositivo = [
  {
    nombre: 'iPhone',
    marca: 'Apple'
  },
  {
    nombre: 'Galaxy',
    marca: 'Samsung'
  }
]

Ahora registraremos estos datos usando la console.table(dispositivos).

Đầu ra bảng điều khiển
Kết quả của consola

Pero espera – ¡se pone mejor!

Đọc thêm  Kiểm tra JavaScript nếu không xác định – Cách kiểm tra không xác định trong JS

Si solo queremos las marcas, ¡solo console.table(dispositivos, ['marca'])!

Đầu ra bảng điều khiển
Kết quả của consola

¿Qué tal un ejemplo más complejo? Ví dụ, sử dụng jsonplaceholder.

async function obtenUsuarios() {
  let respuesta = await fetch('https://jsonplaceholder.typicode.com/users')
  let datos = await respuesta.json()
 
  console.table(datos, ['nombre', 'correoElectronico'])
}

obtenUsuarios()

Đây là một bản solo được tạo ra từ “nombre” và “correoElectrónico”. Địa điểm console.log todos los datos, verás que or muchas más propiedades para cada usuario.

Estilo?

Bạn có thể sử dụng CSS hỗ trợ cho việc đăng ký tài khoản không?

Para hacer esto, usamos %c para especar que tenemos estilos para agregar. Los estilos se pasan al segundo argumento del log.

console.log("%c Este es un texto amarillo sobre un fondo azul.", "color:yellow; background-color:blue")

Puedes usar esto para que tus registros destaquen.

Claro

Nếu đây là tratando giải pháp của một vấn đề về đăng ký sử dụng, có thể là nó đã được hiện thực hóa nhiều và sự an toàn của nó sẽ kéo dài.

tổng hợp đơn console.clear() en la parte superior de tu codigo y tensrás una consola nueva cada vez que la factices. ?

Đơn giản, no lo agregues al final de tu codigo.

¡Gracias bởi Leer!

Nếu bạn muốn xem xét lại các khái niệm của nghệ thuật này trong quá trình xem video, bạn có thể xem lại phiên bản video này mà thôi.

YouTube: Có nhiều thứ để điều khiển hơn là ghi nhật ký
Hội trường Jesse (codeSTACKr)

Đậu nành Jesse de Texas. Echa un vistazo a mi otro contenido y hazme sabre como puedo ayudarte en tu viaje para convertirte en desarrollador web.



Zik.vn – Biên dịch & Biên soạn Lại

spot_img

Create a website from scratch

Just drag and drop elements in a page to get started with Newspaper Theme.

Buy Now ⟶

Bài viết liên quang

DMCA.com Protection Status