Node.js中如何使用console

本篇內容介紹了“Node.js中如何使用console”的有關知識，在實際案例的操作過程中，不少人都會遇到這樣的困境，接下來就讓小編帶領大家學習一下如何處理這些情況吧！希望大家仔細閱讀，能夠學有所成！

在這篇文章中，我們將學習如何更有效地使用Node.js console 類中的大多數方法?！就扑]學習：《nodejs 教程》】

前提條件

本教程在Chrome瀏覽器70.0.3538.77版本和Node.js 8.11.3版本中得到驗證。

使用console.log,console.info, 和console.debug

console.log 方法會打印到標準輸出，無論是終端還是瀏覽器控制臺。
它默認輸出字符串，但可以與模板字符串結合使用，以修改其返回的內容。

console.log(string, substitution)

console.info 和console.debug 方法在操作上與 console.log 相同。

你可以在Firefox瀏覽器控制臺中默認使用console.debug ，但要在Chrome瀏覽器中使用它，你必須在所有級別菜單中把日志級別設置為Verbose。

模板字符串中的參數被傳遞給 util.format它將處理這些參數，用相應的轉換值替換每個替換標記。

支持的替換代幣是。

%s

const msg = `Using the console class`;
console.log('%s', msg);
console.log(msg);

這段代碼將輸出以下內容。

OutputUsing the console class
Using the console class

%s 是默認的替換模式。

%d，%f，%i，%o

const circle = (radius = 1) => {
  const profile = {};
  const pi = 22/7;
  profile.diameter = 2 * pi * radius;
  profile.circumference = pi * radius * 2;
  profile.area = pi * radius * 2;
  profile.volume = 4/3 * pi * radius^3;

  console.log('This circle has a radius of: %d cm', radius);
  console.log('This circle has a circumference of: %f cm', profile.diameter);
  console.log('This circle has an area of: %i cm^2', profile.area);
  console.log('The profile of this cirlce is: %o', profile);
  console.log('Diameter %d, Area: %f, Circumference %i', profile.diameter, profile.area, profile.circumference)
}

circle();

這段代碼將輸出以下內容。

OutputThis circle has a radius of: 1 cm
This circle has a circumference of: 6.285714285714286 cm
This circle has an area of: 6 cm^2
The profile of this cirlce is: {diameter: 6.285714285714286, circumference: 6.285714285714286, area: 6.285714285714286, volume: 7}
Diameter 6, Area: 6.285714285714286, Circumference 6

• %d 將被一個數字（整數或浮點數）所替代。

• %f 將被一個浮動值所取代。

• %i 將被一個整數取代。

• %o 將被一個對象所取代。

%o 特別方便，因為我們不需要用 JSON.stringify來展開我們的對象，因為它默認顯示對象的所有屬性。

請注意，你可以使用任意多的令牌替換。它們只是按照你傳遞的參數的順序被替換。

%c

這個替換令牌將CSS樣式應用于被替換的文本。

console.log('LOG LEVEL: %c OK', 'color: green; font-weight: normal');
console.log('LOG LEVEL: %c PRIORITY', 'color: blue; font-weight: medium');

console.log('LOG LEVEL: %c WARN', 'color: red; font-weight: bold');
console.log('ERROR HERE');

這段代碼將輸出以下內容。

在%c 替換標記之后，我們傳遞給console.log 的文本會受到樣式的影響，但之前的文本則保持原樣，沒有樣式。

使用console.table

傳給它的第一個參數是要以表的形式返回的數據。第二個是要顯示的選定列的數組。

console.table(tabularData, [properties])

這個方法將把傳遞給它的輸入格式化為表格，然后在表格表示之后記錄輸入對象。

數組

如果一個數組作為數據被傳遞給它，數組中的每個元素將是表格中的一行。

const books = ['The Silmarillion', 'The Hobbit', 'Unfinished Tales'];
console.table(books);

對于一個深度為1的簡單數組，表格中的第一列有標題索引。在第一列的索引標題下是數組的索引，數組中的項目在第二列的值標題下列出。

這就是嵌套數組的情況。

const authorsAndBooks = [['Tolkien', 'Lord of The Rings'],['Rutger', 'Utopia For Realists'], ['Sinek', 'Leaders Eat Last'], ['Eyal', 'Habit']];
console.table(authorsAndBooks);

對象

對于深度為1的對象，對象的鍵會列在索引標題下，而對象中的值則列在第二列標題下。

const inventory = { apples: 200, mangoes: 50, avocados: 300, kiwis: 50 };
console.table(inventory);

對于嵌套的對象。

const forexConverter = { asia: { rupee: 1.39, renminbi: 14.59 , ringgit: 24.26 }, africa: { rand: 6.49, nakfa: 6.7 , kwanza:0.33 }, europe: { swissfranc: 101.60, gbp: 130, euro: 115.73 } };
console.table(forexConverter);

還有一些嵌套的對象。

const workoutLog = { Monday: { push: 'Incline Bench Press', pull: 'Deadlift'}, Wednesday: { push: 'Weighted Dips', pull: 'Barbell Rows'}};
console.table(workoutLog);

這里，我們指定只想看到列推下的數據。

console.table(workoutLog, 'push');

要對某一列下的數據_進行排序_，只需點擊該列標題。

很方便，是嗎？

試著把一個帶有一些數值的對象作為數組傳給console.table!

使用console.dir

傳給這個函數的第一個參數是要記錄的對象，而第二個參數是一個包含選項的對象，這些選項將定義結果輸出的格式，或者對象中的哪些屬性將被顯示。

返回的是一個由node的util.expect函數格式化的對象。

輸入對象中的嵌套或子對象可在披露三角形下展開。

console.dir(object, options);
// where options = { showHidden: true ... }

讓我們看看這個動作。

const user = {
  details: {
    name: {
      firstName: 'Immanuel',
      lastName: 'Kant'
    },
    height: `1.83m"`,
    weight: '90kg',
    age: '80',
    occupation: 'Philosopher',
    nationality: 'German',
    books: [
      {
        name: 'Critique of Pure Reason',
        pub: '1781',
      },
      {
        name: 'Critique of Judgement',
        pub: '1790',
      },
      {
        name: 'Critique of Practical Reason',
        pub: '1788',
      },
      {
        name: 'Perpetual Peace',
        pub: '1795',
      },
    ],
    death: '1804'
  }
}

console.dir(user);

這里是Chrome瀏覽器的控制臺。

使用console.dirxml

這個函數將為傳遞給它的XML/HTML渲染一棵交互式樹。如果無法渲染節(jié)點樹，它默認為一個Javascript對象。

console.dirxml(object|nodeList);

與console.dir ，渲染的樹可以通過點擊披露三角形來擴展，在其中可以看到子節(jié)點。

它的輸出類似于我們在瀏覽器的Elements標簽下發(fā)現(xiàn)的輸出。

這是我們從維基百科頁面?zhèn)魅胍恍〩TML時的情況。

const toc = document.querySelector('#toc');
console.dirxml(toc);

讓我們從這個網站上的一個頁面?zhèn)魅胍恍〩TML。

console.dirxml(document)

這就是我們傳入一個對象時的情況。

試著在一些HTML上調用console.dir ，看看會發(fā)生什么。

使用console.assert

傳遞給函數的第一個參數是一個要測試是否為真值的值。所有傳遞的其他參數被認為是信息，如果傳遞的值沒有被評估為真值，就會被打印出來。

Node REPL將拋出一個錯誤，停止后續(xù)代碼的執(zhí)行。

console.assert(value, [...messages])

下面是一個基本的例子。

console.assert(false, 'Assertion failed');

OutputAssertion failed: Assertion failed

現(xiàn)在，讓我們找點樂子。我們將建立一個小型測試框架，使用console.assert

const sum = (a = 0, b = 0) => Number(a) + Number(b);

function test(functionName, actualFunctionResult, expected) {
  const actual = actualFunctionResult;
  const pass = actual === expected;
  console.assert(pass, `Assertion failed for ${functionName}`);
  return `Test passed ${actual} === ${expected}`;
}

console.log(test('sum', sum(1,1), 2)); // Test passed 2 === 2
console.log(test('sum', sum(), 0));    // Test passed 0 === 0
console.log(test('sum', sum, 2));      // Assertion failed for sum
console.log(test('sum', sum(3,3), 4)); // Assertion failed for sum

使用console.error 和console.warn

這兩個基本上是相同的。它們都會打印傳遞給它們的任何字符串。

然而，console.warn 在信息傳遞之前會打印出一個三角形的警告符號。

console.warn(string, substitution);

而console.error ，在信息傳遞前打印出一個危險符號。

console.error(string, substitution);

讓我們注意到，字符串替換可以用與console.log 方法相同的方式來應用。

下面是一個使用console.error 的迷你日志函數。

const sum = (a = 0, b = 0) => Number(a) + Number(b);

function otherTest(actualFunctionResult, expected) {
  if (actualFunctionResult !== expected) {
    console.error(new Error(`Test failed ${actualFunctionResult} !== ${expected}`));
  } else {
    // pass
  }
}

otherTest(sum(1,1), 3);

使用console.trace(label)

這個控制臺方法將打印字符串Trace: ，后面是傳遞給函數的標簽，然后是堆棧跟蹤到函數的當前位置。

function getCapital(country) {
  const capitalMap = {
    belarus: 'minsk', australia: 'canberra', egypt: 'cairo', georgia: 'tblisi', latvia: 'riga', samoa: 'apia'
  };
  console.trace('Start trace here');
  return Object.keys(capitalMap).find(item => item === country) ? capitalMap[country] : undefined;
}

console.log(getCapital('belarus'));
console.log(getCapital('accra'));

使用console.count(label)

Count將開始并遞增一個名為label 的計數器。

讓我們建立一個單詞計數器來看看它是如何工作的。

const getOccurences = (word = 'foolish') => {
  const phrase = `Oh me! Oh life! of the questions of these recurring, Of the endless trains of the faithless, of cities fill’d with the foolish, Of myself forever reproaching myself, for who more foolish than I, and who more faithless?`;

  let count = 0;
  const wordsFromPhraseArray = phrase.replace(/[,.!?]/igm, '').split(' ');
  wordsFromPhraseArray.forEach((element, idx) => {
    if (element === word) {
      count ++;
      console.count(word);
    }
  });
  return count;
}

getOccurences();

getOccurences('foolish');

在這里，我們看到foolish 這個詞被記錄了兩次。該詞在短語中每出現(xiàn)一次就記錄一次。

[secondary_label]
foolish: 1
foolish: 2
2

我們可以用這個方法來查看一個函數被調用了多少次，或者我們的代碼中的某一行被執(zhí)行了多少次。

使用console.countReset(label)

顧名思義，這將重置一個計數器，該計數器有一個由console.count 方法設置的label 。

const getOccurences = (word = 'foolish') => {
  const phrase = `Oh me! Oh life! of the questions of these recurring, Of the endless trains of the faithless, of cities fill’d with the foolish, Of myself forever reproaching myself, for who more foolish than I, and who more faithless?`;

  let count = 0;
  const wordsFromPhraseArray = phrase.replace(/[,.!?]/igm, '').split(' ');
  wordsFromPhraseArray.forEach((element, idx) => {
    if (element === word) {
      count ++;
      console.count(word);
      console.countReset(word);
    }
  });
  return count;
}

getOccurences();

getOccurences('foolish');

[secondary_label]
foolish: 1
foolish: 1
2

我們可以看到，我們的getOccurences 函數返回2，因為在這句話中確實有兩次出現(xiàn)foolish ，但由于我們的計數器在每次匹配時都被重置，所以它記錄了兩次foolish: 1 。

使用console.time(label) 和console.timeEnd(label)

console.time 函數啟動一個定時器，并將label 作為參數提供給該函數，而console.timeEnd 函數停止一個定時器，并將label 作為參數提供給該函數。

console.time('<timer-label>');
console.timeEnd('<timer-label>');

我們可以通過向兩個函數傳遞相同的label 名稱來計算出運行一個操作所需的時間。

const users = ['Vivaldi', 'Beethoven', 'Ludovico'];

const loop = (array) => {
  array.forEach((element, idx) => {
    console.log(element);
  })
}

const timer = () => {
  console.time('timerLabel');
  loop(users);
  console.timeEnd('timerLabel');
}

timer();

我們可以看到計時器停止后顯示的計時器標簽與時間值相對應。

OutputVivaldi
Beethoven
Ludovico
timerLabel: 0.69091796875ms

循環(huán)函數花了0.6909ms完成了對數組的循環(huán)操作。

“Node.js中如何使用console”的內容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業(yè)相關的知識可以關注億速云網站，小編將為大家輸出更多高質量的實用文章！