JavaScript的四种输出语句（一些使用细节）【js学习笔记1】

作者简介：一名大四的学生，致力学习前端开发技术
⭐️个人主页：夜宵饽饽的主页
❔ 系列专栏：JavaScript小贴士
学习格言：成功不是终点，失败也并非末日，最重要的是继续前进的勇气

1.2，JavaScript的输出

1.2.1，页面输出

1.2.2，控制台输出

​ 一些使用控制台输出语句技巧：
​ 1.命名日志打印

 function sum(a, b) {

    console.log({b});//关键语句

    return a + b;

    }

sum(1, 2);

sum(4, 5);

​ 2. 高级化格式

​ 将某些东西打印到控制台最常见方法是简单地使用一个参数调用console.log()，有时我们可能想要打印一条包含多个信息。幸运地是，console.log()可以使用%s,%i 等说明sprintf()格式化字符串

const user = 'john_smith';
const attempts = 5;
console.log(user+"登录失败了"+attempts+"次")//我们也可以用字符串地拼接
console.log('%s 登录失败了 %i 次', user, attempts);//这是高级化格式打印

以下是可用说明符的列表：

说明符作用%s元素转换为字符串

• %d 或 %i元素转换为整数

• %f元素转换为浮点数

• %o元素以最有效的格式显示：

％o说明符(为值关联了正确的打印格式)可以在文本消息中插入数组，对象，DOM元素和常规文本，而不会失去交互性。

const myObject = {

name: 'John Smith',

profession: 'agent'

};

console.log('Neo, be aware of %o', myObject);

• %O元素以最有效的格式显示

• %c应用提供的CSS

3.具有样式打印（了解一下即可）

浏览器控制台允许我们将样式应用于打印的消息。

我们可以通过将％c说明符与相应的CSS样式结合使用来实现。例如，让我们发送一条日志消息，该消息显示字体大小和字体粗细情况：

console.log('%c Big message', 'font-size: 36px; font-weight: bold');

说明符％c应用CSS样式’font-size: 36px; font-weight: bold’

4.深度不受限制地cossole.dir()

const myObject = {
    propA: {
    
    propB: {

    propC: { 

    propD: 'hello'  
    
    }
    
    }
    
    }
    
    };
    console.log(myObject)
    console.dir(myObject,{depth:null})

1.2.3，弹出窗口输出

如何使用JavaScript向弹出窗口输出一句话，请参考以下代码。

1.2.4，弹出输入框

如何使用JavaScript弹出窗口输入框，请参考以下代码。

var a=prompt('这是一个输入框')
console.log(a)