39日目 | javascript Stringオブジェクト

授業

new Stringは文字列の文字の数を取得する

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>Stringオブジェクトの生成</title>
</head>
<body>
<script>
var i;
var str2 = new String('文字列を1文字ずつ取り出す');
for(i=0; i<=(str2.length); i++){
	document.write('<h2>', str2.charAt(i),'</h2>');
}
</script>
</body>
</html>

配列の基礎

いっぺんにまとめていろいろな事ができる。楽になる。
＜ルール＞
配列は0からスタートするので、見る人の側は必要に応じて1を足したり引いたりする。

配列を使って順番に名前を表示する

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>配列を使う</title>
</head>
<body>
<script>
var names = new Array(4);
names[0] = '山田太郎';
names[1] = '鈴木一郎';
names[2] = '佐藤花子';
names[3] = '田中健一';

for(var i=0; i<=(names.length-1); i++){
	document.write('<h2>こんにちは', names[i], 'さん</h2>');
}
</script>
</body>
</html>

配列を使った計算


<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>配列を使う</title>
<style>
table{
	border-collapse:collapse;
}
tr{
	width:100%;
}
th{
	background-color:#EEE;
}
th, td{
	width:25%;
	text-align:center;
}
</style>
</head>
<body>
<script>
var a = new Array(3);
var b = new Array(3);
var kai;

a[0] = '5';
a[1] = '12';
a[2] = '18';
b[0] = '33';
b[1] = '14';
b[2] = '65';


function  kakezan0(){
 kai = a[0]*b[0];
 alert('答えは' +kai+ 'です');
}

function  kakezan1(){
 kai = a[1]*b[1];
 alert('答えは' +kai+ 'です');
}

function  kakezan2(){
 kai = a[2]*b[2];
 alert('答えは' +kai+ 'です');
}

</script>
<h3>配列の演算</h3>
<table border="1">
<tr>
<th>添字</th><th>a</th><th>b</th><th>a×bを計算</th>
</tr>
<tr>
<th>0</th><td>5</td><td>33</td><td><button onClick=" kakezan0()">計算結果</button></td>
</tr>
<tr>
<th>1</th><td>12</td><td>14</td><td><button onClick=" kakezan1()">計算結果</button></td>
</tr>
<tr>
<th>2</th><td>18</td><td>65</td><td><button onClick=" kakezan2()">計算結果</button></td>
</tr>
</table>
</body>
</html>

配列で日、曜日を取得する

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>今日は何日で、何曜日です、を日本語で表示する</title>
<style>
</style>
</head>
<body>
<script>
var days= new Array('日','月','火','水','木','金','土');
var date = new Date();
var day = days[date.getDay()];
document.write('<h1>');
document.write('今日は', date.getDate(),'日で、',day, '曜日です。');
document.write('</h1>');
</script>
</body>
</html>

配列で一年後の曜日を取得する

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>曜日を日本語で表示する</title>
<style>
</style>
</head>
<body>
<script>
var days= new Array('日','月','火','水','木','金','土');
var date = new Date();

date.setFullYear(date.getFullYear()+1);
document.write('<h1>一年後は', days[date.getDay()], '曜日</h1>');
</script>
</body>
</html>