javascript教程：从变量到函数，零基础30天入门【附实例代码】

是不是很多零基础的朋友，一听说要学 JavaScript 就头大？觉得这东西听起来就难，变量啊函数啊，光听名字就晕乎乎的？担心自己学不会，或者学了 3 天就放弃？别慌，兔子哥当初也是这么过来的。今天就给大伙整个 30 天入门的教程，从最基础的变量讲到函数，一步步来，保证你能跟上，还附了实例代码，一起往下看吧！

变量到底是个啥？为啥非得用它？

咱先说说变量。变量啊，你就把它当成个小盒子，用来装东西的。比如你想记一个人的年龄，总不能每次用都写一遍数字吧？用个变量存起来，下次直接叫盒子的名字就行。
那怎么定义变量呢？很简单，用 var、let 或者 const 这三个词开头。比如：
javascript

let age = 18; // 定义一个叫age的变量，里面装着18console.log(age); // 这行代码会在控制台显示18

有人可能会问，这三个词有啥区别？var 是老版本的用法，现在不太推荐了；let 定义的变量可以改值；const 定义的是常量，不能改。要是你用 const 定义了变量又想改，就会报错，这点得记牢。
为啥非得用变量呢？你想啊，要是写个计算工资的程序，员工的基本工资、奖金都用变量存着，以后想改数值，直接改变量就行，不用在代码里到处找数字改，多方便。

函数又是啥？怎么写个简单的函数？

函数啊，就像个小机器，你给它点材料，它就给你加工出个结果。比如你想算两个数的和，不用每次都写 a + b，把这个计算过程装进函数里，下次直接叫函数的名字，输入两个数就行。
写函数的格式大概是这样：
javascript

function add(a, b) { // 定义一个叫add的函数，a和b是输入的材料return a + b; // 加工后返回a加b的结果}let result = add(3, 5); // 调用函数，输入3和5，结果存到result里console.log(result); // 控制台会显示8

是不是不难？函数名自己起，输入的材料叫参数，用括号括起来，函数里的代码用大括号包着，最后用 return 把结果送出去。
那函数写在哪呢？一般写在 script 标签里，或者单独的.js 文件里，再在 HTML 里引入。刚开始学，直接写在 HTML 的 script 标签里最方便，不用操心文件引用的问题。

变量和函数咋一起用？不用会出啥问题？

变量和函数一起用，才能发挥大作用。比如你定义个变量存用户输入的数字，再用函数处理这个数字。
举个例子，计算圆的面积：
javascript

let radius = 5; // 圆的半径，用变量存着function calculateArea(r) { // 计算面积的函数，参数r是半径return 3.14 * r * r;}let area = calculateArea(radius); // 用radius作为参数调用函数console.log(area); // 显示面积78.5

要是不用变量和函数，每次算面积都得写 3.14 * 5 * 5，换个半径又得重写，多麻烦。而且代码乱得很，回头想改个计算方式，都不知道从哪下手。

30 天入门计划，每天学点啥？

给大伙整个大概的 30 天计划，你们可以参考着来：

• 第 1-5 天：熟悉变量、数据类型（数字、字符串这些）、基本运算；
• 第 6-10 天：学函数的定义、调用，还有函数里的变量；
• 第 11-15 天：学条件语句（if...else）、循环语句（for、while）；
• 第 16-20 天：操作 DOM，比如用 JS 改网页上的文字、颜色；
• 第 21-25 天：学事件处理，比如点击按钮触发函数；
• 第 26-30 天：做个小项目，比如简单的计算器、待办清单。

每天不用学太久，1-2 小时就行，但得动手写代码，光看没用。遇到报错别慌，看看提示信息，多半是拼写错了，或者少了个括号啥的，慢慢找总能解决。
兔子哥觉得，学 JavaScript 最重要的是别怕错，多写多练。刚开始可能觉得难，但跟着这个节奏来，30 天入门肯定没问题。别想着一口吃成胖子，每天进步一点点，过段时间再回头看，你会发现自己已经能写不少东西了。希望这篇教程能帮到你，加油学起来吧！

标签： 小盒子 里面装