为什么浏览器控制台（Console）运行JavaScript代码有时会出现“undefined”？

浏览器“控制台”（console）使用简介

about:blank是打开浏览器空白页的命令——内置在浏览器中的命令，可以打开浏览器空白页（没有任何内容）。

打开浏览器，按下 F12键 【或 按 Ctrl+Shift+J (Windows、Linux) 或 Command+Option+J (macOS)】，然后选择 “控制台”（console） 面板，就进入了控制台。进入控制台以后，就可以在提示符（> 符号）后输入代码，然后按回车（Enter键），代码就会执行。如果按Shift + Enter键，就是代码换行，不会触发执行。执行结果显示在<•符号之后。

浏览器的开发者工具使用介绍https://blog.csdn.net/cnds123/article/details/120822401

一、在浏览器控制台（Console）运行javascript代码有时会出现“undefined”，为什么？

在浏览器“控制台”（console）中运行下面两段代码

代码段1

function fun1() {  //定义函数fun1，没有return语句
}
fun1();//调用函数

代码段2

function fun2() {  //定义函数fun2，有return语句
  return 'Hello!';
}
fun2(); //调用函数

运行情况如下：

先看undefined 是什么？

JS 有6种基本类型（原始类型）：

  String:字符串  

  Number:数值 

  Boolean:布尔值  

  Null:空值  

  Undefined:未定义

  Symbol: (ES2015增加)

JavaScript的Undefined类型是基本类型（原始类型）之一，只有一个唯一的字面值undefined，undefined 表示变量未赋值时的属性。而undefined是JavaScript中的一个全局变量，即挂载在window对象上的一个变量，并不是关键字。

undefined是一个特殊的值，当访问未初始化的变量、不存在的对象属性、不存在的数组元素、没有返回值的函数等时，将接收到一个undefined 的值。例如：

let number;

number; //未初始化的变量=> undefined

let movie = { name: "Interstellar" };

movie.year; //一个不存在的对象属性=> undefined

let movies = ["Interstellar", "Alexander"];

movies[3]; //不存在数组元素 => undefined

使用没有用return返回值的函数，将接收到一个undefined 的值，可以参看开头的示例。如果你纠结那些示例太简单，下面再给出有点用处的示例，你再运行试试吧：

计算两个数字的乘积的函数：

代码1、用return返回乘积的值

function myFun1(a,b)
{   
    let z=a*b //计算两个数字的乘积
    return z;
}
myFun1(2,3)

代码2、不使用return返回值，而用alert()弹出乘积的值

function myFun2(a,b)
{
    z= a*b; //计算两个数字的乘积
    alert(z)  
}
myFun2(2,3)

顺便提示，在浏览器的开发者工具中输入let a = 10回车后，也返回Undefined，说明：

控制台返回 undefined 不是表示 a 的值，而是表示这个语句（statement）本身没有返回值，而控制台总是显示每个输入的返回值，这种行为是 JavaScript 控制台的一个特性（控制台行为），目的是为了在每次输入后提供一些反馈。当一个操作不返回值时（如变量声明），控制台会显示 undefined 来表示操作已完成。如果您在输入 let a = 10 后立即在控制台输入 a，您会看到输出是 10，这才是 a 的实际值。

二、为什么console.log()会返回undefined？

如：console.log(1+2);

console.log方法（method）是用来在控制台输出信息。

console.log本身是一个函数，函数是可以有返回值的，若不设置返回值，默认返回值为undefined。

先执行表达式1+2 结果为3，再执行console.log()函数无返回值，默认为undefined

console.log本身是一个函数

console.log(typeof(console.log));

关于typeof运算符（operator）可见 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/typeof