By GokiSoft.com| 20:14 26/11/2021|
Học JS

[Share Code] Tìm hiểu Object & Array trong Javascript - Khóa học lập trình Javascript

#index.html


<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Array & Object Tutorial</title>
	<!-- <link rel="stylesheet" type="text/css" href="">//css -->
	<script type="text/javascript" src="studentjs.js"></script>
</head>
<body>
<table border="1" cellpadding="5">
	<tr>
		<th>STT</th>
		<th>Ho & Ten</th>
		<th>Tuoi</th>
		<th>MSV</th>
		<th>Dia Chi</th>
		<th>SDT</th>
		<th>Email</th>
	</tr>

<script type="text/javascript">
	//Cach 1
	/**
	var index = 0
	for(std of studentList) {
		document.write(`<tr>
				<td>${++index}</td>
				<td>${std.fullname}</td>
				<td>${std.age}</td>
				<td>${std.rollno}</td>
				<td>${std.address}</td>
				<td>${std.phone_number}</td>
				<td>${std.email}</td>
			</tr>`)
	}*/

	//Cach 2
	showStudents(studentList)
</script>
</table>
</body>
</html>


#studentjs.js


//Phan 1: Khai bao mang rong trong javascript
var arr1 = []
var arr1 = new Array()

//Them 1 phan tu vao trong mang.
arr1.push(5)
arr1.push(2)
arr1.push(56)

console.log(arr1)

//Lay phan tu ra
console.log(arr1[0])

//duyet qua cac phan tu trong mang
//arr1.length: so phan tu trong mang
for (var i = 0; i < arr1.length; i++) {
	console.log('--> ' + arr1[i])
}

//foreach -> rat hay dung
for(var v of arr1) {
	console.log('*** ' + v)
}

//Xoa phan tu trong mang
arr1.splice(1, 1) //Xoa index = 1

console.log(arr1)

//Chen 1 phan tu bat vao 1 vi tri index = 1
arr1.splice(1, 0, 100)

console.log(arr1)
arr1.splice(1, 0, 5, 6, 7)

console.log(arr1)

//Khai bao 1 mang co phan tu san: 5, 8, 10
var arr2 = [5, 8, 10]
console.log(arr2)

arr1.splice(1, 0, arr2)
console.log(arr1)

//Tuong tu -> thay int thanh -> float, char, string, ...

//Phan 2: Tim hieu object trong Javascript
//object -> nhom cac thuoc tinh cua 1 doi tuong
//sinh vien a, sinh vien b, mon hoc lap trinh c, ... -> object
//Doi tuong -> gom nhieu thuoc tinh
//sinh vien: ten, tuoi, ma sinh vien, dia chi, sdt, email, ...
//TRAN VAN A, 20, R001, HA NOI, 123456, TRANVANA@GMAIL.COM -> OBJECT
var stdA1 = ["TRAN VAN A", 20, "R001", "HA NOI", "123456", "TRANVANA@GMAIL.COM"]
//lay ten sinh vien => stdA1[0], ma sinh vien => stdA1[2], ... => kho nho -> lap trinh rat kho

//To chuc object theo key => value
var stdA2 = {
	"fullname": "TRAN VAN A",
	"age": 20,
	"rollno": "R001",
	"address": "Ha Noi",
	"phone_number": "123456",
	"email": "tranvana@gmail.com"
}
console.log(stdA2.fullname)
console.log(stdA2.rollno)

stdA2.email = "test01@gmail.com"

console.log(stdA2.email)

//Bieu dien 1 mang object -> nhu the nao
//Bieu dien 1 mang sinh vien
var studentList = [
	{
		"fullname": "TRAN VAN A",
		"age": 20,
		"rollno": "R001",
		"address": "Ha Noi",
		"phone_number": "123456",
		"email": "tranvana@gmail.com"
	}, {
		"fullname": "TRAN VAN B",
		"age": 22,
		"rollno": "R001",
		"address": "Ha Noi",
		"phone_number": "123456",
		"email": "tranvana@gmail.com"
	}, {
		"fullname": "TRAN VAN C",
		"age": 25,
		"rollno": "R001",
		"address": "Ha Noi",
		"phone_number": "123456",
		"email": "tranvana@gmail.com"
	}
]

console.log(studentList)

studentList.push({
	"fullname": "TRAN VAN D",
	"age": 28,
	"rollno": "R001",
	"address": "Ha Noi",
	"phone_number": "123456",
	"email": "tranvana@gmail.com"
})

console.log(studentList)

std = {
	"fullname": "TRAN VAN E",
	"age": 21,
	"rollno": "R001",
	"address": "Ha Noi",
	"phone_number": "123456",
	"email": "tranvana@gmail.com"
}
studentList.push(std)

console.log(studentList)

for(std of studentList) {
	console.log(std.fullname)
}

// document.write -> ko su dung
function showStudents(studentList) {
	var index = 0
	for(std of studentList) {
		document.write(`<tr>
				<td>${++index}</td>
				<td>${std.fullname}</td>
				<td>${std.age}</td>
				<td>${std.rollno}</td>
				<td>${std.address}</td>
				<td>${std.phone_number}</td>
				<td>${std.email}</td>
			</tr>`)
	}
}

function showMsg() {
	alert('1233412312312')
}


Tags:

Phản hồi từ học viên

5

(Dựa trên đánh giá ngày hôm nay)