Bảng điều khiển Công cụ dành cho nhà phát triển Chrome - đăng nhập xếp chồng, làm cách nào để xem nội dung được ghi lại [Screenshot Inside]?

Question

Tôi vừa bắt đầu sử dụng bảng điều khiển trong Công cụ dành cho nhà phát triển Chrome (khá mới đối với Javascript nói chung). Tôi nhận thấy rằng khi tôi liên tục đăng nhập cùng một biến hai lần (một đối tượng trong trường hợp này), rằng nhật ký ngăn xếp này và đặt một biểu tượng số nhỏ bên cạnh nó. Tôi nhấp vào suy nghĩ này rằng tôi sẽ có thể nhìn thấy đối tượng hai lần (vì nó được cập nhật hai lần), tuy nhiên không có gì xảy ra.

hình ảnh để làm rõ hơn:

Như bạn có thể thấy có một chút "2" trong một vòng tròn màu xanh bên cạnh Object thả xuống. Nhật ký đầu tiên sẽ có Object.num ở mức 3 và cột thứ hai ở mức 4, tuy nhiên tất cả những gì tôi có thể thấy là lần thứ hai.

Bất kỳ câu trả lời nào về cách xem cả hai nhật ký sẽ được đánh giá cao.

:).

Answer 1

Chức năng tùy chỉnh log này sẽ ghi lại "ảnh chụp nhanh" của đối tượng, vì vậy trong ví dụ của bạn, bạn sẽ thấy thuộc tính "num" được cập nhật của đối tượng được phản ánh trong mọi cuộc gọi đến log.

Đó là loại gian lận bằng cách ghi nhật ký thủ công từng thuộc tính của đối tượng vào nhóm "bảng điều khiển". Nhưng, nó kết thúc tìm kiếm khá gần với đầu ra bình thường console.log (không có hành vi lạ bạn chỉ ra trong câu hỏi của bạn).

Ngoài ra, nó có thể chỉ hoạt động trong Chrome.

function log(obj) { 
    console.groupCollapsed(({}).toString.call(obj).split(' ')[1].split(']')[0]); 
    for (var k in obj) obj.hasOwnProperty(k) && console.log(k + ': ', obj[k]); 
    console.log('__proto__: ', obj.__proto__); 
    console.groupEnd(); 
}​ 

Hãy dùng thử here.

---

Câu hỏi hay, nhân tiện. Tôi đã học được rất nhiều về giao diện điều khiển mà tôi không biết trước đây. :)

Answer 2

Điều này đã xảy ra với tôi trước đây. Giải pháp duy nhất tôi có thể tìm được là xuất ra thứ gì đó giữa hai cuộc gọi đầu ra. Vì vậy, ví dụ, nếu bạn có điều này:

console.log(var); 
... 
console.log(var); 

làm cho nó:

console.log(var); 
console.log('asdf'); 
... 
console.log(var); 

Answer 3

Điều này xảy ra bởi vì bạn đang đăng nhập các đối tượng chính xác cùng một hai lần. Ngay cả khi điều này không dẫn đến việc xếp chồng, bạn chỉ thấy 'num' là 4, vì bàn điều khiển không - theo hiểu biết tốt nhất của tôi, ít nhất - lấy các bản sao của các đối tượng bạn đăng nhập. Điều này đôi khi hơi bất tiện, tôi đồng ý.

Một cách tôi chỉ nghĩ đến việc đảm bảo rằng bạn sẽ nhận được các bản ghi riêng biệt - nhưng với việc sử dụng bộ nhớ thêm - là để làm một cái gì đó giống như

console.log(JSON.parse(JSON.stringify(obj))); 

(Điều này sẽ làm việc, ít nhất). Nếu đối tượng của bạn tương đối đơn giản để diễn giải bằng mắt, bạn chỉ có thể bỏ qua JSON.parse ở đó và sử dụng biểu mẫu chuỗi JSON của đối tượng của bạn để ghi nhật ký.

Tôi cũng đề nghị xem xét câu lệnh debugger; - bất cứ khi nào gặp phải trong chương trình JS, nó sẽ làm cho môi trường ngừng thực thi mã và thoát ra khỏi trình gỡ rối tập lệnh. Nó có thể hoặc có thể không được nhiều hơn apt cho bất cứ điều gì bạn đang gỡ lỗi.

Answer 4

Theo documentation, tin nhắn xếp chồng có thể được tắt bằng cách timestamps cho phép trong các thiết lập giao diện điều khiển chung: