LAB 5: JAVASCRIPT
LÀM VIỆC VỚI MẢNG TRONG JAVASCRIPT
A – LÝ THUYẾT
I – ĐỐI TƯỢNG MẢNG TRONG
JAVASCRIPT
1 – Khái niệm về mảng
Mảng là một đối tượng được
sử dụng để lưu trữ nhiều giá trị trong một biến duy nhất
2 – Các cách thức đơn giản để khởi tạo một mảng
A – Khai báo mảng kèm giá trị của các phần tử mảng
Cú pháp:
var tenMang = new Array(gia_tri_1, gia_tri_2,…
gia_tri_n)
3 – Thêm một phần tử vào mảng
Cú pháp:
tenMang[0] = gia_tri;
B – Khai báo mảng rỗng
Cú pháp:
tenMang = new Array();
tenMang[0] = gia_tri_1;
tenMang[0] = gia_tri_2;
…
tenMang[n] = gia_tri_n;
4 – Xuất giá trị của một phần tử trong mảng
5 – Duyệt qua tất cả các giá trị của một mảng
II – MỘT SỐ HÀM LÀM VIỆC
MẢNG
1 – Hàm length()
Hàm length() dùng để lấy ra
độ dài của một mảng
Cú pháp:
mang.length();
2 – Hàm concat()
Hàm concat() dùng để gom
tất cả các phần tử của nhiều mảng riêng rẽ tập trung vào một mảng
Cú pháp:
mang.concat(mang2, mang3,…
,mangN);
3 – Hàm join()
Hàm
join() giúp chúng ta tao ra một chuỗi từ các phần tử trong một mảng và được
ngăn cách bằng một ký tự bất kỳ
Cú pháp:
mang.join(“ky_tu_bat_ky“);
4 – Hàm pop()
Hàm
pop() dùng để xóa phần tử cuối cùng trong một mảng
Cú pháp:
mang.pop();
5 – Hàm push()
Hàm
push() dùng để thêm một hoặc nhiều phần tử vào cuối mảng
Cú pháp:
mang.push(“phan_tu_1“, “phan_tu_2“,..., “phan_tu_n”);
6 – Hàm splice()
Hàm splice() dùng để chia nhỏ mảng ra, hàm này nhận vào 2 đối
số, đối số thứ nhất là vị trí của phần tử bắt đâu, đối số thứ hai là vị trí kết
thúc
Cú pháp:
mang.sort();
7 – Hàm sort()
Hàm sort() dùng để sắp xếp
mảng theo thức tự tăng dần
Cú pháp:
mang.sort();
8 – Hàm reverse()
Hàm reverse() Trả lại một mảng với thứ tự các phần tử bị đảo ngược
Cú pháp:
mang.sort();
B – THỰC HÀNH
I – BÀI TẬP THỰC HÀNH
1 – Bài tập
Bài 1:
II – BÀI TẬP VỀ NHÀ
1 – Bài tập
Bài 1:
2 – Hướng dẫn
<html>
<head><title>Bai 15 --> bai tap 1.html</title>
<style type="text/css">
.chan{
color: #0c0;
text-transform: capitalise;
font-size: 12px;
font-family: arial;
font-weight: bold;
}
.le{
color: red;
text-transform: capitalise;
font-size: 12px;
font-family: arial;
font-weight: bold;
}
</style>
</head>
<body>
<script language="javascript">
var so = prompt("Nhập vào số số nguyên dương");
var mang = new Array();
var mangChan = new Array();
var mangLe = new Array();
var i = 1;
var kt;
var keyChan = 0;
var keyLe = 0;
for(i=1; i<=so; i++)
{
soNguyenDuong = prompt("Nhập vào: ");
kt = soNguyenDuong % 2;
if(kt == 0)
{
mangChan = mangChan.concat(soNguyenDuong);
}
if(kt != 0)
{
mangLe = mangLe.concat(soNguyenDuong);
}
}
document.write("Bạn vừa khỏi tạo một mảng có các số nguyên dương <span class=\"chan\"> Chẵn </span> với các phần tử: <span class=\"chan\">" + mangChan + "</span><br><br>");
document.write("Bạn vừa khỏi tạo một mảng có các số nguyên dương <span class=\"le\"> Lẻ </span> với các phần tử: <span class=\"le\">" +mangLe + "</span><br>");
</script>
</body>
</html>
Bài 2
<html>
<head><title>Bai 15 --> bai tap 2.html</title>
<style type="text/css">
</style>
</head>
<body>
<script language="javascript">
var soPhanTu = prompt("Bạn muốn khởi tạo một mảng chưa bao nhiêu phần tử");
soPhanTu = parseInt(soPhanTu);
var mang = new Array();
for(var i = 1; i<=soPhanTu; i++){
mang[i-1] = prompt("Bạn vui lòng nhập vào giá trị của phần tử thứ " + i + " trong mảng ");
}
document.write("Bạn đã khởi tạo một mảng có " + soPhanTu + " phần tử <br>");
document.write("Các phần tử thuộc mảng đó là: " + mang);
</script>
</body>
</html>
Bài 3
<html>
<head><title>Bai 15 --> bai tap 3.html</title>
<style type="text/css">
</style>
</head>
<body>
<script language="javascript">
var soPhanTu = prompt("Bạn muốn khởi tạo một mảng chưa bao nhiêu phần tử?");
soPhanTu = parseInt(soPhanTu);
var mang = new Array();
for(var i = 1; i<=soPhanTu; i++){
mang[i-1] = prompt("Nhập vào phần tử thứ " + i + " của mảng");
}
alert("Bạn vừa khởi tạo một mảng có chứa các phần tử: " + mang);
var noiChuoi = prompt("Bạn có muốn nối các phần tử của mảng thành một chuỗi được phân cách với nhau bởi ký tự \"-\" hay không? Điền yes/no");
if( noiChuoi == "no"){
alert("Bạn đã từ chối nối các phần tử mảng thành chuỗi");
}else{
mang = mang.join("-");
document.write("Chuỗi hình thành từ các phần tử của mảng " + mang);
}
</script>
</body>
</html>
Bài 4:
<html>
<head><title>Bai 15 --> bai tap 4.html</title>
<style type="text/css">
</style>
</head>
<body>
<script language="javascript">
var soPhanTu = prompt("Bạn muốn khởi tạo một mảng nguyên dương với bao nhiêu phần tử?");
soPhanTu = parseInt(soPhanTu);
var mang = new Array();
for(var i=1;i<=soPhanTu; i++){
mang[i-1] = prompt("Nhập vào phần tử thứ " + i + " của mảng ");
}
document.write("Mảng ban đầu với giá trị của các phần tử được sắp xếp như sau: <b><font color=\"#32CD32\">" + mang + "</font></b><br>");
var mangTang = mang.sort();
document.write("Mảng với giá trị của các phần tử được sắp xếp theo thứ tự tăng dần: <b><font color=\"red\">" + mangTang + "</font></b><br>");
var mangGiam = mangTang.reverse();
document.write("Mảng với giá trị của các phần tử được sắp xếp theo thứ tự tăng dần: <b><font color=\"orange\">" + mangGiam + "</font></b><br>");
</script>
</body>
</html>
Bài 5:
<html>
<head><title>Bai 15 --> bai tap 5.html</title>
<style type="text/css">
#red{
font-weight: bold;
color: red;
font-family: arial;
font-size: 12px;
}
#green{
font-weight: bold;
font-family: arial;
font-size: 12px;
color: green;
}
</style>
</head>
<body>
<script language="javascript">
var mang = new Array();
var phanTuMang = 0;
for(var i=1; i>0; i++){
phanTuMang = prompt("Bạn hãy nhập giá trị cho một phần tử của mảng đang khởi tạo. Nếu bạn muốn dừng việc khởi tạo phần tử mới thì hãy vui lòng nhập giá trị 0 vào ô dưới");
if(phanTuMang ==0)
{
break;
}
else
{
mang[i-1]=phanTuMang;
}
}
document.write("Bạn vừa khởi tạo một mảng chứa <span id=\"red\">" + mang.length + "</span> phần tử, giá trị của các phần tử đó trong mảng lần lượt là: <span id=\"green\">" + mang + "</span>");
</script>
</body>
</html>
Bài 6:
<html>
<head><title>Bai 15 --> bai tap 6.html</title>
<style type="text/css">
#red{
font-family: arial;
font-weight: bold;
color: red;
font-size: 12px;
text-transform: uppercase;
}
#green{
font-family: arial;
font-weight: bold;
color: #0c0;
font-size: 12px;
text-transform: lowercase;
}
</style>
</head>
<body>
<script language="javascript">
alert("Bạn hãy khởi tạo một mảng chứa 4 phần tử có giá trị lần lượt từ 1 đến 4");
var mangSo = new Array();
for(var i=1; i<=4; i++)
{
mangSo[i-1] = prompt("Bạn vui lòng nhập phần tử thứ " + i + " cho mảng nguyên");
}
alert("Bạn hãy khởi tạo một mảng chứa 4 phần tử có giá trị lần lượt từ a đến d");
var mangChu = new Array();
for( var i = 1; i<=4; i++)
{
mangChu[i-1] = prompt("Bạn vui lòng nhập phần tử thứ " + i + " cho mảng chữ");
}
for(i=1; i<=4; i++)
{
var mangKetHop = new Array();
mangKetHop = mangKetHop.concat(mangSo[i-1], mangChu[i-1]);
document.write("Mảng <span id=\"red\">"+mangSo[i-1] + "" + mangChu[i-1]+"</span> chứa các phần tử <span id=\"green\">"+mangSo[i-1]+" và "+mangChu[i-1]+"</span><br>");
}
</script>
</body>
</html>
>>Xem bài trước: Bài 17 biểu thức điều kiện và vòng lặp trong javascript
>>Xem bài tiếp theo: Bài 19 Hàm trong javascript
No comments:
Post a Comment