Skip to content

基础练习

欢迎来到JavaScript基础练习!这些练习专为初学者设计,帮助你掌握JavaScript的基础概念。

📝 变量和数据类型

练习 1.1: 变量声明

javascript
// 练习:声明不同类型的变量
// 1. 声明一个字符串变量存储你的姓名
// 2. 声明一个数字变量存储你的年龄
// 3. 声明一个布尔变量表示你是否是学生
// 4. 声明一个数组存储你的爱好
// 5. 声明一个对象存储你的个人信息

// 你的代码:

练习 1.2: 数据类型检测

javascript
// 练习:使用typeof检测数据类型
let name = "张三";
let age = 25;
let isStudent = true;
let hobbies = ["读书", "游泳", "编程"];
let person = {name: "李四", age: 30};

// 使用typeof检测每个变量的类型并输出
// 你的代码:

🔢 运算符和表达式

练习 2.1: 算术运算

javascript
// 练习:计算器功能
// 创建一个简单的计算器,实现加减乘除运算
function calculator(num1, operator, num2) {
    // 你的代码:
    // 根据operator执行相应的运算
    // 支持 '+', '-', '*', '/' 四种运算
}

// 测试用例
console.log(calculator(10, '+', 5)); // 应该输出 15
console.log(calculator(10, '-', 3)); // 应该输出 7
console.log(calculator(6, '*', 4));  // 应该输出 24
console.log(calculator(15, '/', 3)); // 应该输出 5

练习 2.2: 比较运算

javascript
// 练习:年龄比较
// 编写函数比较两个人的年龄
function compareAge(age1, age2) {
    // 你的代码:
    // 返回比较结果的字符串描述
    // 例如:"第一个人更年长"、"第二个人更年长"、"两人同龄"
}

// 测试用例
console.log(compareAge(25, 30));
console.log(compareAge(35, 25));
console.log(compareAge(28, 28));

🔀 条件语句

练习 3.1: 成绩等级判断

javascript
// 练习:根据分数判断等级
function getGrade(score) {
    // 你的代码:
    // 90-100: A
    // 80-89: B
    // 70-79: C
    // 60-69: D
    // 0-59: F
    // 其他: 无效分数
}

// 测试用例
console.log(getGrade(95)); // A
console.log(getGrade(85)); // B
console.log(getGrade(75)); // C
console.log(getGrade(65)); // D
console.log(getGrade(55)); // F

练习 3.2: 季节判断

javascript
// 练习:根据月份判断季节
function getSeason(month) {
    // 你的代码:
    // 春季:3,4,5月
    // 夏季:6,7,8月
    // 秋季:9,10,11月
    // 冬季:12,1,2月
}

// 测试用例
console.log(getSeason(3));  // 春季
console.log(getSeason(7));  // 夏季
console.log(getSeason(10)); // 秋季
console.log(getSeason(1));  // 冬季

🔄 循环结构

练习 4.1: 数字累加

javascript
// 练习:计算1到n的累加和
function sumToN(n) {
    // 你的代码:
    // 使用for循环计算1+2+3+...+n
}

// 测试用例
console.log(sumToN(5));   // 15 (1+2+3+4+5)
console.log(sumToN(10));  // 55
console.log(sumToN(100)); // 5050

练习 4.2: 九九乘法表

javascript
// 练习:打印九九乘法表
function multiplicationTable() {
    // 你的代码:
    // 使用嵌套循环打印九九乘法表
    // 格式:1×1=1  1×2=2  1×3=3 ...
}

multiplicationTable();

练习 4.3: 数组遍历

javascript
// 练习:遍历数组并处理元素
let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

// 1. 使用for循环打印所有偶数
function printEvenNumbers(arr) {
    // 你的代码:
}

// 2. 使用while循环计算数组元素的乘积
function calculateProduct(arr) {
    // 你的代码:
}

// 测试
printEvenNumbers(numbers);
console.log(calculateProduct(numbers));

🔧 函数基础

练习 5.1: 函数声明和调用

javascript
// 练习:创建各种类型的函数

// 1. 函数声明:判断一个数是否为偶数
function isEven(num) {
    // 你的代码:
}

// 2. 函数表达式:计算圆的面积
const calculateCircleArea = function(radius) {
    // 你的代码:
    // 面积 = π × r²
};

// 3. 箭头函数:将摄氏度转换为华氏度
const celsiusToFahrenheit = (celsius) => {
    // 你的代码:
    // 华氏度 = 摄氏度 × 9/5 + 32
};

// 测试用例
console.log(isEven(4));  // true
console.log(isEven(7));  // false
console.log(calculateCircleArea(5)); // 约78.54
console.log(celsiusToFahrenheit(0)); // 32

练习 5.2: 参数和返回值

javascript
// 练习:函数参数处理

// 1. 默认参数:问候函数
function greet(name = "朋友") {
    // 你的代码:
    // 返回问候语,如果没有提供姓名则使用默认值
}

// 2. 多参数:计算平均值
function calculateAverage(...numbers) {
    // 你的代码:
    // 使用剩余参数计算所有数字的平均值
}

// 3. 对象参数:创建用户信息
function createUser({name, age, email}) {
    // 你的代码:
    // 返回格式化的用户信息对象
}

// 测试用例
console.log(greet());           // "你好,朋友!"
console.log(greet("小明"));     // "你好,小明!"
console.log(calculateAverage(1, 2, 3, 4, 5)); // 3
console.log(createUser({name: "张三", age: 25, email: "zhang@example.com"}));

📊 数组操作

练习 6.1: 数组基础操作

javascript
// 练习:数组的增删改查

let fruits = ["苹果", "香蕉", "橙子"];

// 1. 在数组末尾添加"葡萄"
// 你的代码:

// 2. 在数组开头添加"草莓"
// 你的代码:

// 3. 删除数组中的"香蕉"
// 你的代码:

// 4. 查找"橙子"的索引
// 你的代码:

// 5. 将"苹果"替换为"红苹果"
// 你的代码:

console.log(fruits);

练习 6.2: 数组方法练习

javascript
// 练习:使用数组方法处理数据

let students = [
    {name: "小明", age: 18, score: 85},
    {name: "小红", age: 19, score: 92},
    {name: "小刚", age: 18, score: 78},
    {name: "小丽", age: 20, score: 96}
];

// 1. 找出所有成绩大于80分的学生
function getHighScoreStudents(students) {
    // 你的代码:使用filter方法
}

// 2. 计算所有学生的平均成绩
function calculateAverageScore(students) {
    // 你的代码:使用reduce方法
}

// 3. 获取所有学生的姓名数组
function getStudentNames(students) {
    // 你的代码:使用map方法
}

// 4. 按成绩从高到低排序
function sortByScore(students) {
    // 你的代码:使用sort方法
}

// 测试
console.log(getHighScoreStudents(students));
console.log(calculateAverageScore(students));
console.log(getStudentNames(students));
console.log(sortByScore(students));

📦 对象操作

练习 7.1: 对象创建和访问

javascript
// 练习:创建和操作对象

// 1. 创建一个表示汽车的对象
let car = {
    // 你的代码:
    // 包含品牌、型号、年份、颜色等属性
    // 包含启动、停止、加速等方法
};

// 2. 访问和修改对象属性
// 你的代码:
// 输出汽车信息
// 修改汽车颜色
// 调用汽车方法

// 3. 动态添加属性和方法
// 你的代码:
// 给汽车对象添加价格属性
// 添加计算车龄的方法

练习 7.2: 对象方法和this

javascript
// 练习:理解this关键字

let person = {
    firstName: "张",
    lastName: "三",
    age: 25,
    
    // 1. 创建获取全名的方法
    getFullName: function() {
        // 你的代码:使用this访问属性
    },
    
    // 2. 创建自我介绍的方法
    introduce: function() {
        // 你的代码:返回自我介绍的字符串
    },
    
    // 3. 创建生日方法(年龄+1)
    haveBirthday: function() {
        // 你的代码:增加年龄并返回祝福语
    }
};

// 测试
console.log(person.getFullName());
console.log(person.introduce());
console.log(person.haveBirthday());

🎯 综合练习

练习 8.1: 学生管理系统

javascript
// 练习:创建一个简单的学生管理系统

let studentManager = {
    students: [],
    
    // 添加学生
    addStudent: function(name, age, grade) {
        // 你的代码:
    },
    
    // 删除学生
    removeStudent: function(name) {
        // 你的代码:
    },
    
    // 查找学生
    findStudent: function(name) {
        // 你的代码:
    },
    
    // 获取所有学生
    getAllStudents: function() {
        // 你的代码:
    },
    
    // 计算平均年龄
    getAverageAge: function() {
        // 你的代码:
    }
};

// 测试系统
studentManager.addStudent("小明", 18, "高三");
studentManager.addStudent("小红", 17, "高二");
studentManager.addStudent("小刚", 19, "高三");

console.log(studentManager.getAllStudents());
console.log(studentManager.findStudent("小红"));
console.log("平均年龄:", studentManager.getAverageAge());

练习 8.2: 简单计算器

javascript
// 练习:创建一个功能完整的计算器

function Calculator() {
    this.result = 0;
    
    // 加法
    this.add = function(num) {
        // 你的代码:
        return this; // 支持链式调用
    };
    
    // 减法
    this.subtract = function(num) {
        // 你的代码:
        return this;
    };
    
    // 乘法
    this.multiply = function(num) {
        // 你的代码:
        return this;
    };
    
    // 除法
    this.divide = function(num) {
        // 你的代码:
        return this;
    };
    
    // 获取结果
    this.getResult = function() {
        // 你的代码:
    };
    
    // 清零
    this.clear = function() {
        // 你的代码:
        return this;
    };
}

// 测试计算器
let calc = new Calculator();
let result = calc.add(10).multiply(2).subtract(5).divide(3).getResult();
console.log("计算结果:", result);

💡 学习提示

  1. 多动手练习:每个练习都要亲自编写代码
  2. 理解原理:不要只是复制代码,要理解为什么这样写
  3. 调试技能:学会使用console.log调试代码
  4. 代码规范:注意代码的可读性和规范性
  5. 举一反三:尝试修改练习,创造新的变化

🔗 相关链接


记住:编程是一门实践性很强的技能,只有通过大量练习才能真正掌握! 💪