ความแตกต่างระหว่าง console.log () และ console.debug () หรือไม่

143

Google ไม่ได้มีประโยชน์สำหรับฉันเลยเนื่องจากการค้นหา "console.debug" จะแสดงหน้าต่างๆที่มีคำว่า "console" และ "debug" อยู่

ฉันสงสัยว่าความแตกต่างระหว่างconsole.log()และconsole.debug()คืออะไร มีวิธีการใช้console.debug()ข้อความสั่งจำนวนมากและจากนั้นเพียงกดสวิตช์เพื่อปิดงบ debug ทั้งหมดไม่ให้ส่งไปยังคอนโซล (เช่นหลังจากเปิดตัวเว็บไซต์)?

— CaptSaltyJack
แหล่งที่มา

นี่คือวิธีปิดใช้งาน console.log เอาต์พุตstackoverflow.com/questions/1215392/…

— frazras

คุณสามารถใส่สี console.log ('% c ข้อความตัวอย่าง', 'color: green;'); หรือเพิ่ม VAR บางส่วนในข้อความโดยใช้: console.log (`ตัวอย่าง $ {variable}`, 'color: green;');

— Gilberto B. Terra Jr.

74

อย่างน้อย IE, Firefox และ Chrome consoles, .debug () เป็นเพียงนามแฝงสำหรับ. log () ที่เพิ่มเข้ากัน

https://developer.mozilla.org/en-US/docs/Web/API/console

https://developers.google.com/chrome-developer-tools/docs/console-api#consoledebugobject_object

https://msdn.microsoft.com/en-us/library/ie/hh772183(v=vs.85).aspx

— Pete TNT
แหล่งที่มา

55

ใน Chrome debug()จะมีสีน้ำเงินและlog()สีดำ

— Simon_Weaver

38

การปรับปรุงอย่างจริงจังเกี่ยวกับบันทึก ()

— Vael Victus

32

จากdeveloper.mozilla.org/en-US/docs/Web/API/console : console.debug () - หมายเหตุ: การเริ่มต้นด้วย Chromium 58 วิธีนี้จะปรากฏใน Chromium เบราว์เซอร์คอนโซลเท่านั้นเมื่อเลือกระดับ "Verbose"

— cilf

การใช้ Debug ใน Chrome: ไม่อนุญาตให้ทำการดีบัก

— Masoud Bimar

103

ในทางเทคนิค console.log console.debugและconsole.infoเหมือนกันอย่างไรก็ตามวิธีที่พวกเขาแสดงข้อมูลแตกต่างกันเล็กน้อย

console.log ข้อความสีดำไม่มีไอคอน

console.info ข้อความสีฟ้าพร้อมไอคอน

console.debug ข้อความสีดำบริสุทธิ์

console.warn ข้อความสีเหลืองพร้อมไอคอน

console.error ข้อความสีแดงพร้อมไอคอน

var playerOne = 120;
var playerTwo = 130;
var playerThree = 140;
var playerFour = 150;
var playerFive = 160;

console.log("Console.log" + " " +  playerOne);
console.debug("Console.debug" + " " +playerTwo);
console.warn("Console.warn" + " " + playerThree);
console.info("Console.info" + " " + playerFour);
console.error("Console.error" + " " + playerFive);

— ปราปาการ์ Undurthi
แหล่งที่มา

ในinfoบันทึกระดับเบราว์เซอร์ของ Google chrome จะแสดงพร้อมไอคอน (เช่นเดียวกับภาพรวม) แต่ข้อความ ( console.infoข้อความในโพสต์ของคุณ) เป็นสีดำและสีพื้นหลังของแถวเป็นสีขาว อาจเป็นไปได้ว่าภาพรวมของคุณสำหรับเบราว์เซอร์ Firefox

— RBT

3

ขอบคุณสำหรับคำตอบชัดเจนมากกับภาพหน้าจอ ทำไมต้องต่อสายเข้าด้วยกัน? ทำไมไม่ลองconsole.log("Console.log");แทนconsole.log("Console.log" + " " + playerOne);ล่ะ อะไร" " + playerOneทำอย่างไร

— hofnarwillie

ในคอนโซลของฉันฉันได้รับการแสดงผลเดียวกันกับ

console.log("Console.log"); console.debug("Console.debug"); console.warn("Console.warn");  console.info("Console.info");  console.error("Console.error");

— kotchwane

36

ความแตกต่างเพียงอย่างเดียวคือข้อความ debug จะถูกซ่อนไว้ตามค่าเริ่มต้นใน Chrome รุ่นล่าสุด (คุณต้องตั้งค่าระดับการบันทึกเป็นVerboseในแถบด้านบน Devtools ในขณะที่อยู่ในคอนโซลเพื่อดูข้อความการแก้ปัญหา

— user2486570
แหล่งที่มา

2

สวัสดีนี่เป็นเรื่องจริง แต่ฉันไม่สามารถหาข้อมูลเกี่ยวกับพฤติกรรมนี้ได้ เอกสาร Chromeไม่พูดถึงมันเป็นของวันนี้

— oligofren

3

ในที่สุดฉันก็เข้าใจ "ตั้งค่าระดับการบันทึกเป็น Verbose ด้านบนของคอนโซล" คุณหมายถึงใน Dev Tools มีคอนโซลอยู่ที่ด้านล่าง ที่ด้านบนของส่วนนี้พร้อมด้วยตัวกรองและตัวเลือกเฟรมนอกจากนี้ยังมีรายการแบบเลื่อนลงสำหรับบันทึก (ตั้งค่าล่วงหน้าเป็น "ข้อมูล")

— oligofren

1

นี่คือคำตอบที่เกี่ยวข้องมากที่สุด ทุกคนพูดถึงสี แต่นี่เป็นสิ่งสำคัญมากสำหรับ IMO

— DurkoMatko

15

console.info, วิธีการจะเหมือนกับconsole.debugconsole.log

console.log พิมพ์คำสั่ง
console.info ข้อความสีดำพร้อมไอคอน "i" เป็นสีน้ำเงิน
console.debug ข้อความสีฟ้า

เอกสารอ้างอิง:

— Venkat
แหล่งที่มา

Console.info พิมพ์สีน้ำเงิน, console.warn พิมพ์สีเหลืองและ console.error พิมพ์สีแดง

— 59

ฉันได้ทดสอบใน Chrome 52.0.2743.82 Console.Info พิมพ์ในสีดำด้วยไอคอนสีน้ำเงิน Console.warn พิมพ์ในสีดำด้วยไอคอนสีเหลือง console.error พิมพ์ในสีแดงพร้อมไอคอนสีแดง

— Venkat

โปรดแก้ไขคำตอบของคุณเพื่อให้ฉันสามารถเพิ่มหรือลบ downvote คุณสังเกตเห็นไอคอน "i" สีฟ้าก่อนข้อความที่พิมพ์ขณะที่ใช้ console.info ()

— shivgre

2

หากคุณต้องการความสามารถในการปิดการใช้งานการบันทึกหลังจากผลิตภัณฑ์เสร็จสิ้นคุณสามารถแทนที่console.debug()ฟังก์ชั่นหรือสร้างใหม่ที่กำหนดเอง

console.debug = function() {
    if(!console.debugging) return;
    console.log.apply(this, arguments);
};

console.debugging = true;
console.debug('Foo', {age:41, name:'Jhon Doe'});

Foo▸ {อายุ: 41, ชื่อ: "Jhon Doe"}

console.debugging = false;
console.debug('Foo', {age:26, name:'Jane Doe'});

ไม่มีเอาต์พุต

อย่างไรก็ตามฉันยังไม่ได้คิดวิธีที่จะออกสีเช่นกัน

— Espen MS
แหล่งที่มา

1

จากเอกสารของเบราว์เซอร์, The log, debugและinfoวิธีการนั้นเหมือนกันในการนำไปใช้อย่างชาญฉลาด แต่แตกต่างกันไปในสีและไอคอน

https://jsfiddle.net/yp4z76gg/1/

— Venkat
แหล่งที่มา

1

นี่ควรเป็นความคิดเห็นหรือเพิ่มคำอธิบายเพิ่มเติมพร้อมคำตอบว่าทั้งสองเหมือนกันหรือไม่ต่างกันที่จะเข้าใจ OP และคนอื่น ๆ

— ขอบคุณ