CĂN BẢN
DOM & BOM
XỨ LÝ FORM
JAVASCRIPT TIPS
TUTORIALS
CÁC CHỦ ĐỀ
BÀI MỚI NHẤT
MỚI CẬP NHẬT

Bài tập tạo hàm trong Javascript

Trong bài này mình sẽ tổng hợp 3 bài tập tạo hàm trong javascript cơ bản nhất, qua đó sẽ giúp bạn ôn tập lại kiến thức về hàm trong javascript.

test php

banquyen png
Bài viết này được đăng tại freetuts.net, không được copy dưới mọi hình thức.

Javascript là ngôn ngữ lập trình có cách hoạt động tương đối khó hiểu. Nó có nhiều khái niệm mà các ngôn ngữ khác không có như ngôn ngữ lập trình hướng đối tượng.

Nhưng mọi thứ đều bắt đầu từ cội nguồn, phải thông qua function trong javascript thì chúng ta mới có thể hiểu và áp dụng vào các phương thức của class. Vì vậy, qua một số bài tập function thì này mình hy vọng sẽ giúp các bạn sẽ hiểu rõ hơn về function trong js.

1. Một số bài tập tạo hàm trong Javascript

Những bài tập này mình sẽ cố gắng giải cả hai cách là có return và không có return để giúp bạn phân biệt hai khái niệm này luôn nhé.

Bài viết này được đăng tại [free tuts .net]

Viết chương trình cộng hai số

Ý tưởng cho bài này như sau: trước tiên cần viết một hàm cộng hai số và hàm này có hai tham số truyền vào. Lúc này, hai tham số đó chúng ta sẽ sử dụng hàm prompt() yêu cầu người dùng nhập vào.

Lưu ý rằng khi lấy dữ liệu từ người dùng thì bạn nên sử dụng hàm parseInt() để chuyển sang kiểu number nhé, nếu không javascript sẽ hiểu là ta đang cộng hai chuỗi nên dẫn đến kết quả sai.

Cách 1: Có return RUN
// Hàm cộng hai số
function tinh_tong(a, b)
{
    return a + b;
}

// Lấy thông tin từ người dùng
var a = parseInt(prompt("Nhập số a"));
var b = parseInt(prompt("Nhập số b"));

// Tính tổng
var tong = tinh_tong(a, b);

// In ra màn hình
document.write("Tổng hai số " + a + " + " + b + " là " + tong);
Cách 2: Không có return RUN
// Hàm cộng hai số
function tinh_tong()
{
    // Lấy thông tin từ người dùng
    var a = parseInt(prompt("Nhập số a"));
    var b = parseInt(prompt("Nhập số b"));
    
    // Tính tổng
    var tong = a + b;

    // In ra màn hình
    document.write("Tổng hai số " + a + " + " + b + " là " + tong);
}

// Gọi hàm tính tổng
tinh_tong();

Xem kỹ hai cách trên ta đưa ra được nhận xét như sau:

  • Đối với hàm có return thì nó chỉ thực hiện một mục đích duy nhất là tính tổng hai số a và b, sau đó trả kết quả về.
  • Đối với hàm không có return thì ta gom hết tất cả code vào trong hàm luôn.

Tính tổng các số lẻ trong mảng

Bài này mình sẽ cho trước một mảng các phần tử, sau đó yêu cầu viết chương trình tính tổng các số lẻ trong mảng đó. Mảng cho trước như sau:

var mang = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16,17, 18, 19, 20];
Cách 1: Có return RUN
var mang = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16,17, 18, 19, 20];

// Hàm tính tổng số lẻ
function tong_so_le(mang)
{
    // Biến lưu trữ tổng
    var tong = 0;

    // Lặp qua mảng và cộng thêm tổng nếu là số lẻ
    for (var i = 0; i < mang.length; i++){
        if (mang[i] % 2 != 0){
            tong += mang[i];
        }
    }

    // Trả kết quả về
    return tong;
}

// In ra trình duyệt
document.write("Tổng số lẻ là: " + tong_so_le(mang));
Cách 2: Không có return RUN
var mang = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16,17, 18, 19, 20];

// Hàm tính tổng số lẻ
function tong_so_le(mang)
{
    // Biến lưu trữ tổng
    var tong = 0;

    // Lặp qua mảng và cộng thêm tổng nếu là số lẻ
    for (var i = 0; i < mang.length; i++){
        if (mang[i] % 2 != 0){
            tong += mang[i];
        }
    }

    document.write("Tổng số lẻ là: " + tong);
}

// Gọi hàm tính tổng số lẻ
tong_so_le(mang);

Như vậy sự khác nhau giữa hàm có return và không có return là một bên có trả về giá trị và một bên không trả về giá trị.

Tính giá trị của biểu thức

Viết chương trình cho người dùng nhập vào số n lớn hơn 0, sau đó dựa vào n tính giá trị của biểu thức: expres = 1/n + 2/n + 3/n + ... + n/n.

Với bài này chúng ta chỉ cần sử dụng vòng lặp for là được. Tuy nhiên, mình vẫn lưu ý với bạn là nên chuyển đổi kiểu dữ liệu và kiểm tra điều kiện nhập của người dùng nhé.

Cách 1: Có return RUN
function tinh_bieu_thuc(n)
{
    // Biến tính tổng
    var tong = 0;

    // Tính toán
    for (var i = 1; i <= n; i++){
        tong += (1/i);
    }

    return tong;
}

// Lấy giá trị
var n = parseInt(prompt("Nhập số cần tính"));

// Kiểm tra giá trị
if (n <= 0){
    alert("Bạn phải nhập số lớn hơn 0");
}
else{
    document.write("Tổng giá trị biểu thức là: " + tinh_bieu_thuc(n));
}
Cách 2: Không có return RUN
function tinh_bieu_thuc()
{
    // Biến tính tổng
    var tong = 0;

    // Lấy giá trị
    var n = parseInt(prompt("Nhập số cần tính"));

    // Kiểm tra giá trị
    if (n <= 0){
        alert("Bạn phải nhập số lớn hơn 0");
    }
    else{
        // Tính toán
        for (var i = 1; i <= n; i++){
            tong += (1/i);
        }
        document.write("Tổng giá trị biểu thức là: " + tong);
    }
}

// Gọi hàm
tinh_bieu_thuc();

2. Lời kết

Bạn có thể giải theo nhiều cách khác nhau và không cần phải giải đúng như cách của mình. Nhưng nếu bạn chưa biết cách giải thì hãy xem và hiểu cách giải của mình, vì như vậy bạn mới có phản xạ nhanh hơn trong quá trình học.

Những bài tập tạo hàm trong javascript này nhằm giúp các bạn hiểu rõ hơn bản chất của hàm có return và hàm không có return nên mình chỉ đưa ra những bài khá đơn giản và dễ hiểu. Hy vọng qua loạt bài tập này sẽ giúp được một phần nào cho các bạn.

Cùng chuyên mục:

Functional Programming là gì? Tại sao và khi nào bạn nên sử dụng trong JavaScript

Functional Programming là gì? Tại sao và khi nào bạn nên sử dụng trong JavaScript

Những tính năng mới trong ES6+ trong JavaScript

Những tính năng mới trong ES6+ trong JavaScript

4 cách tránh memory leaks trong JavaScript

4 cách tránh memory leaks trong JavaScript

Capturing và bubbling Event trong Javascript

Capturing và bubbling Event trong Javascript

Phân biệt prototype và __proto__ trong JavaScript

Phân biệt prototype và __proto__ trong JavaScript

Cách hoạt động của Event Loop trong JavaScript

Cách hoạt động của Event Loop trong JavaScript

Phương thức bind(), call(), và apply() trong JavaScript

Phương thức bind(), call(), và apply() trong JavaScript

Cách khắc phục lỗi

Cách khắc phục lỗi "hoisting" trong JavaScript

Sử dụng Promise.all và Promise.race để quản lý các Promise trong JavaScript

Sử dụng Promise.all và Promise.race để quản lý các Promise trong JavaScript

Xử lý bất đồng bộ bằng vòng lặp for-await trong JavaScript

Xử lý bất đồng bộ bằng vòng lặp for-await trong JavaScript

Sự khác biệt giữa Promise, Callback và Async/Await trong JavaScript

Sự khác biệt giữa Promise, Callback và Async/Await trong JavaScript

Cách sử dụng Async functions trong JavaScript

Cách sử dụng Async functions trong JavaScript

Hàm String isspace() trong Python

Hàm String isspace() trong Python

Cách tạo số ngẫu nhiên trong Javascript

Cách tạo số ngẫu nhiên trong Javascript

Hướng dẫn cách tạo một số ngẫu nhiên ...

Cách gộp hai object javascript lại với nhau

Cách gộp hai object javascript lại với nhau

Cách lấy chiều dài của object trong Javascript

Cách lấy chiều dài của object trong Javascript

Hướng dẫn giải phương trình bậc 1 bằng Javascript

Hướng dẫn giải phương trình bậc 1 bằng Javascript

Cách dùng nextSibling trong javascript

Cách dùng nextSibling trong javascript

Cách dùng insertAdjacentHTML trong javascript

Cách dùng insertAdjacentHTML trong javascript

Cách dùng innerHTML trong Javascript

Cách dùng innerHTML trong Javascript

Top