배열

서현서현·2022년 4월 6일
0

Html/CSS/JavaScript

목록 보기
4/15
post-thumbnail

배열

  • 따로 자료형을 선언 하지 않는다!

생성방법

  1. 리터럴로 배열 생성
  2. Array객체로 배열 생성

우선 다음과같이 HTML파일을 작성했다.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel = "stylesheet" href ="../css/outStyle.css">
<style>
div{
	border : 2px dotted gold;
	height : 20px;
	margin: 10px;
	padding: 10px;
}
</style>
</head>
<body>
<script src ="../js/array.js"></script>
	<h4> 리터럴로 배열 생성 </h4>
	<input type="button" value="생성" onclick="proc1()"><br>
	<div id="d1"></div>

	<h4> 생성자로 배열 생성 </h4>
	<input type="button" value="생성" onclick="proc2()"><br>
	<div id="d2"></div>
	<input type="button" value="생성" onclick="proc3()"><br>
	<div id="d3"></div>

</body>
</html>

리터럴로 배열생성

function proc1() {
	// 리터럴로 배열 생성
	var fruit = ["사과","포도",100,12.34,true,"복숭아"];
	document.getElementById('d1').innerText = fruit;
	
	// for문을 통해 형식을 바꿔 출력 할 수도 있다
/*	var fruit = ["사과","포도",100,12.34,true,"복숭아"];
	var ff="";
	for(var i=0; i<fruit.length;i++){
		if(i!=0) {ff+="/";}
		ff+=fruit[i]
	document.getElementById('d1').innerText = ff;
	}*/
	// print함수로 출력 ㄱㄴ
	print(fruit, "d1");
}

Array객체로 배열생성

function proc2() {
	// 생성자로 배열 생성
	var fruit = new Array("참외","수박","키위");
	//document.getElementById('d2').innerText = fruit;
	print(fruit,"d2");
}

function proc3() {
	var fruit = new Array();
	fruit[0] = "자두";
	fruit[1] = "샤인머스캣";
	fruit[2] = "스타후르츠";
	fruit[3] = "체리";
	fruit[4] = "망고스틴";
	fruit[5] = "용과";
	// document.getElementById('d3').innerText = fruit;
	
	print(fruit,"d3");
	// 프린트 따로 선언한거 로출하기 ㄱㄴ
	
}

// 형식대로 프린ㅁ트하려고 만든 for문은 계속 쓸 수 있으니까 아예 따로 선언 할 수 있다
function print(f,id){
	var ff="";
	for(var i=0; i<f.length;i++){
		if(i!=0) {ff+="/";}
		ff+=f[i]
	}
	document.getElementById(id).innerText = ff;
}

0개의 댓글

관련 채용 정보