小強のHTML 5モバイル開発の道(28)-JavaScriptレビュー3
7412 ワード
一、基本データ型
number:数値タイプ
string:文字列(注意s小文字:stringは基本タイプ)
boolean:ブールタイプ//最初の3つに対応するパッケージクラスがあります
null:空のタイプ
undefined:未定義タイプ
テスト1:
lengthプロパティ:文字列の長さを返します
charAt(index):指定した位置を返す文字
substring(from,to):サブ文字列を返します.
indexOf(str):元の文字列の文字列の位置を返します.
lastIndexOf(str):
match(regexp):正規表現に合致する配列を返す
切り取る
二、Objectタイプ(配列、関数、その他は次編)
1、配列
js配列の長さ可変
js配列要素は任意です(異なるタイプのデータを混在させることができます)
関数の定義
function関数名(パラメータ){
かんすうたい
}
注意すべきいくつかの問題
a.戻りタイプの宣言はできませんが、戻り値はあります.
b.関数は本質的にオブジェクトであり、Functionタイプのインスタンスであり、関数名は変数であり、このオブジェクトのアドレスが格納されている(関数名は変数である)
c.関数内部でargumentsオブジェクトアクセスパラメータを使用
d.関数は再ロードできません
number:数値タイプ
string:文字列(注意s小文字:stringは基本タイプ)
boolean:ブールタイプ//最初の3つに対応するパッケージクラスがあります
null:空のタイプ
undefined:未定義タイプ
テスト1:
<html>
<!-- -->
<head>
<script>
function f1(){ //number
/* function void f1(){}*/
alert('hello');
/*alert(); */
alert('hehe');
var i=100;
//js
i='hello';
//typeof ,
alert(typeof i);
/*js : number i=100; , */
}
function f2(){ //string
var str1='hello';
var str2='hello';
if(str1==str2){
alert("str1==str2");
}else{
alert("str1!=str2");
}
var str3='100';
var i=100;
if(str3==i){ // = ,
alert("str3==i");
}else{
alert("str3!=i");
}
if(str3===i){ // = ,
alert("str3==i");
}else{
alert("str3!=i");
}
}
function f3(){ //boolean
// :true/false;
var flag=true;
alert(typeof flag);
//var str="abc";
var str=new Object();// , true;
var str=null; // false;
var str; //undefined false;
// , true, true;
if(str){
alert(' ');
}else{
alert(' ');
}
}
function f4(){ //null
var obj=null;
//null ——null;
// Object
alert(typeof obj);
}
function f5(){ //undefined
var obj;
alert(typeof obj);
}
</script>
</head>
<body style="font-size:30px;">
<input type="button" value=" "
onclick="f1();"/>
</body>
</html>
テスト2:parseInt<html>
<head>
<script>
/*number--->string
string---->number
*/
function f1(){ //
// var str1='fsfs'; NaN
// var str1="1234fsfs"; 1234
// var str1="fsfs1234";
// var str1="22323.08";
var str1='1234';
//window.parseInt(); window
var n1=parseInt(str1);
//js , x , x
// var n2=parseFloat(str1);
//undefined + = NaN
alert(n1+100);
}
function f2(){
var n1=100;
//number--->Number( ) toString();
var s1=n1.toString();
// var s1=n1+'';
}
</script>
</head>
<body>
<input type="button" value=" " onclick="f1();"/>
</body>
</html>
テスト3:stringの方法lengthプロパティ:文字列の長さを返します
charAt(index):指定した位置を返す文字
substring(from,to):サブ文字列を返します.
indexOf(str):元の文字列の文字列の位置を返します.
lastIndexOf(str):
match(regexp):正規表現に合致する配列を返す
切り取る
function f4(){ //string
var str1="abcdef";
var str2=str1.substring(1,4);
alert(str2);
}
正則 function f5(){
var str="asdfas12323adfasf23423";
// js /reg/, , // RegExp
var reg=/[0-9]+/g;
//reg , , g , i 。
var arr=str.match(reg);
alert(arr);
}
検索 function f6(){
var str1="sdf1223asdfasf23423";
var reg=/[0-9]+/;
//alert(typeof reg);
alert(reg instanceof RegExp);
var index = str1.search(reg);
alert(index);
}
置換 function f7(){
var str1="sdf444asdfadf4423";
var reg=/[0-9]+/g;
var str2 = str1.replace(reg,'888');
alert(str2);
}
二、Objectタイプ(配列、関数、その他は次編)
1、配列
js配列の長さ可変
js配列要素は任意です(異なるタイプのデータを混在させることができます)
<html>
<head>
<script>
function f1(){ //
var arr=new Array(); //()
arr[0]=1;
arr[3]=2;
arr[5]='abc';
alert(arr.length);
alert(arr[1]);
alert(arr[3]);
}
function f2(){ //
var arr=[];
arr[0]=1;
arr[3]=22;
var arr=[1,2,3,4,5,6];
arr[7]=11;
alert(arr.length);
}
function f3(){ //
var arr = new Array();
arr[0]=[1,2,3,4,5];
arr[1]=[6,7,8,9,10,11,12,13];
arr[2]=[14,15,16,17,18,19];
for(var i=0;i<arr.length;i++){
for(j=0;j<arr[i].length;j++){
alert(arr[i][j]);
}
}
}
function f4(){ //
var arr=[11,22,33,44];
arr.length=2; // ,
alert(arr);
alert(typeof abc);
}
</script>
</head>
<body>
<input type="button" value=" " onclick="f4()"/>
</body>
</html>
配列のいくつかの関数<html>
<head>
<script>
function f1(){
var a1 = [1, 2, 3];
var str = a1.join(|);
alert(str);
}
function f2(){
var a1 = [1, 2, 3];
var a2 = [4, 5, 6];
var a3 = a1.concat(a2); //
alert(a3);
}
function f4(){
var a1 = [1, 2, 3];
var a2 = a1.reverse(); //
alert(a2);
alert(a1); //
}
function f5(){
var a1 = [1, 2, 3, 4, 5, 6];
var a2 = a1.slice(2,4); //
alert(a2);
alert(a1); //
}
function f6(){
var a1 = [5, 1, 7, 2, 8];
var a2 = a1.sort(); //
alert(a2);
}
function f7(){
var a1 = [15, 111, 7, 22, 88];
var a2 = a1.sort(); //
alert(a2);
}
function f8(){
var a1 = [15, 111, 7, 22, 88];
var a2 = a1.sort(function(t1, t2){
return t2-t1;
});
alert(a2);
}
function f9(){ //
var a1 = ['abc', 'bb', 'casd', 'a'];
var a2 = a1.sort(function(t3, t4){
return t4.length-t3.length;
});
alert(a2);
}
</script>
</head>
<body>
<input type="button" value="click me" onclick="f9()"/>
</body>
</html>
、関数関数の定義
function関数名(パラメータ){
かんすうたい
}
注意すべきいくつかの問題
a.戻りタイプの宣言はできませんが、戻り値はあります.
b.関数は本質的にオブジェクトであり、Functionタイプのインスタンスであり、関数名は変数であり、このオブジェクトのアドレスが格納されている(関数名は変数である)
c.関数内部でargumentsオブジェクトアクセスパラメータを使用
d.関数は再ロードできません
<html>
<!-- -->
<head>
<script>
function add(a1, a2){
return a1+a2;
}
function test(){
var sum = add(1, 1);
alert(sum);
}
function test2(){
// alert(typeof add);
alert(add instanceof Function); // Function
var f2 = add; //
add = null; //add
var sum = f2(1, 1); // add(1, 1);
alert(sum);
}
function add2(arg1, arg2){
//return arg1 + arg2;
return arguments[0]+arguments[1];
}
function add3(arg1, arg2){ //
return arg1+arg2+100;
}
function add3(){ //
return arguments[0]+arguments[1];
}
function test3(){
//var sum = add2(1); // NaN, arg2 undifined
//var sum(1, 1, 1); // 2
//var sum=add(1, 1);
//var sum = add2(1, 1, 1);
var sum = add3(1, 1);
alert(sum);
}
</script>
</head>
<body>
<input type="button" value="click me" onclick="test3()"/>
</body>
</html>
其他Object类型请看下篇