目 录CONTENT

文章目录

JavaScript 第三天:盒子里装什么?认识数据类型

老李学编程
2025-07-01 / 0 评论 / 0 点赞 / 56 阅读 / 0 字 / 正在检测是否收录...
温馨提示:
本文最后更新于2025-07-22,若内容或图片失效,请留言反馈。 眼看十遍,不如手敲一遍!‌ ‌打开控制台‌ ‌Windows/Linux‌:按 F12 或 Ctrl+Shift+I ‌......Mac‌:按 Option+Command+I 也可右键网页 → 选择「检查」→ 切换到「Console」标签 ‌ ......动手实践‌ ▶ 在闪烁的光标处直接输入教程代码 ▶ 按 Enter 执行代码,立即看到结果 ▶ 用 ↑↓ 方向键快速调出历史命令 ......当需要编写多行代码时: 正常输入第一行代码 按住 Ctrl 键(Mac用户按 Command) 再按 Enter 换行而不执行 代码输入完成后,单独按 Enter 执行全部 ‌.......小技巧‌ 输入 clear() 可清空控制台 错误提示是好朋友!红色报错能帮你快速定位问题 💡 记住:每个程序员都从这里开始你的第一行代码吧! ⚠️ 注意:部分旧版浏览器可能不支持此功能,建议使用Chrome/Edge/Firefox最新版

前言

欢迎回来小魔法师们!上节课我们学会了制作变量盒子,今天我们要探索这些盒子里能装什么宝贝🧳。就像在现实生活中,有些盒子装书本📖,有些装水果🍎,变量盒子也可以装不同类型的"魔法物品"!

回顾昨天学的

上节课我们掌握了:

  • 变量就像贴标签的盒子

  • var boxName;创建空盒子

  • =符号给盒子放东西

  • 示例:var lunchBox = "三明治";

今天学什么

今天我们重点学习盒子里的两种基础魔法物品​:

  1. 文字类物品 → 字符串(String)

  2. 数字类物品 → 数字(Number)

今天要学的内容

我们一步一步探索这些奇妙的数据类型:


第一种物品:字符串(文字珍珠)

想象这是串起来的珍珠项链​:

var message = "你好,世界!";

➤ ​拆解说明:​

  1. 整体作用:告诉电脑"我要存一串文字"

  2. 关键标志:​双引号""包裹着文字

  3. 珍珠特点:

    • 每颗"珍珠"都是一个字符

    • 数字在引号里也变成文字(如"2023"是文字年份)

生活比喻:​
就像在作业本上写名字——
名字"小明"必须写在""内
电脑才能认出这是名字文字


第二种物品:数字(魔法水晶)

想象这是可以计算的水晶​:

var appleCount = 5;

➤ ​拆解说明:​

  1. 整体作用:告诉电脑"我要存可以做计算的数字"

  2. 关键标志:​没有引号

  3. 水晶特性:

    • 可以直接做数学计算

    • 示例:5 + 3能得到8

    • 小数也可以:3.14

避坑指南:​

类型

正确写法

错误写法

结果

数字

2023

"2023"

"2023"是文字不能计算

文字

"100分"

100分

会报错停止运行


区分练习:猜猜盒子里是什么?

var boxA = 10;       // 水晶
var boxB = "10";     // 珍珠
var sum = boxA + 5;  // 水晶可以计算 → 结果15
var text = boxB + 5; // 珍珠只是拼接 → 结果"105"

➤ ​逐步分析:​

  1. boxA + 5 → 数字水晶相加:10 + 5 = 15

  2. boxB + 5 → 文字珍珠拼接:"10"和"5"粘在一起 → "105"

  3. 关键区别:​引号决定能否计算

动手试试:​

<script>
  var myAge = 20;              // 水晶
  var myName = "小星";          // 珍珠
  
  alert("姓名:" + myName);     // 拼接文字 → "姓名:小星"
  alert("明年年龄:" + (myAge+1)); // 水晶计算 → "明年年龄:21"
</script>

魔法打印机:console.log()

当你需要悄悄查看盒子内容:

console.log("查看我的宝盒:", appleCount);

➤ ​逐行解释:​

  1. console.log() → 魔法打印机

  2. 作用:在浏览器的控制台打印内容(按F12查看)

  3. 优势:比alert更安静,不会弹出窗口干扰

  4. 可以同时打印多个物品:console.log("苹果:", 5, "橘子:", 3);

操作指南:​

  1. 浏览器中右键 → 检查 → Console选项卡

  2. 看到打印结果:

    查看我的宝盒:5
    苹果:5 橘子:3
    

数据类型小测验

var itemA = "100";  // 文字珍珠
var itemB = 100;    // 数字水晶

console.log(itemA + itemA); // 结果?
console.log(itemB + itemB); // 结果?

✅ ​答案(自己测试前先思考)​

  1. itemA + itemA"100100"(文字拼接)

  2. itemB + itemB200(数学加法)


明天学什么

第四课我们将升级魔法技能:

  • 用变量进行数学计算、文字拼接的花样玩法、认识第三种魔法物品

成长秘诀

"数据类型是代码世界的材质基础,选对材料才能建造稳固的程序城堡"

0
  1. 微信打赏

    qrcode weixin
    1. 微信打赏

      qrcode weixin

评论区