Maison > interface Web > js tutoriel > Partie 1 Démarrage rapide : objets Date, Math et Global dans la pratique de base de js

Partie 1 Démarrage rapide : objets Date, Math et Global dans la pratique de base de js

php是最好的语言
Libérer: 2018-07-28 10:41:46
original
1752 Les gens l'ont consulté

tool.js

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

function print(str){

    document.write(str);

}

 

function println(str){

    document.write(str+"<br/>");

}

 

///////通过prototype属性扩展js API的对象的功能/////////

 

//※把trim方法融入到String对象中: str.trim()

String.prototype.trim = function(){

     var start=0;//第一个非空格字符的位置

     var end=this.length-1;//最后一个非空格字符的位置

     while(start<=end && this.charAt(start)==&#39; &#39;){

         start++;

     }

     while(start<=end && this.charAt(end)==&#39; &#39;){

         end--;

     }

     return this.substring(start,end+1);

};

 

//给String对象添加一个toCharArray()方法

String.prototype.toCharArray = function(){

    var chs=[];

    for(var x=0;x<this.length;x++){

        chs[x]=this.charAt(x);

    }

    return chs;

};

 

//给String对象添加一个reverse()方法

String.prototype.reverse = function(){

    //函数内部可以再定义函数----Java做不到

    function swap(arr,start,end){

        var temp=arr[start];

        arr[start]= arr[end];

        arr[end] = temp;

    }

     

    var arr = this.toCharArray();

    for(var start=0,end=arr.length-1; start<end; start++,end--){

        swap(arr,start,end);

    }

    return arr.join("");

};

String.prototype.compareTo=function(str){

    if(typeof(str)!="string"){

        return 1;

    }

     

    var len1=this.length;

    var len2=str.length;

    var shortLen=len1>len2?len2:len1;

    var longLen=len1>len2?len1:len2;

    for(var i=0; i<shortLen; i++){

        if(this.charAt(i)!=str.charAt(i)){

            return this.charAt(i)-str.charAt(i);

        }

    }

    if(len1>len2){

        return 1;

    }else if(len1<len2){

        return -1;

    }else{

        return 0;

    }

     

};

 

 

//为数组对象的shift()和unshift()函数取两个我们习惯的别名

Array.prototype.removeFirst=function(){

    return this.shift();

};

 

Array.prototype.addFirst=function(e){

    return this.unshift(e);

};

 

Array.prototype.addLast=function(e){

    return this.push(e);

};

Copier après la connexion

Objet en langage JS - Objet Date

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>JS语言中的对象--Date对象</title>

<script type="text/javascript" src="tools.js"></script>

</head>

<body>

    <script type="text/javascript">

        var date = new Date();

        println(date);//date.toString()

        println(date.toDateString());//只显示日期

        println(date.toLocaleString());//本地格式

        println(date.toLocaleDateString());//本地格式:只显示日期

 

        var year = date.getYear(); //建议使用getFullYear()代替

        println(year); //118 = 2018-1900

        year = date.getFullYear();//※

        println(year);

 

        var month = date.getMonth();//※ 0~11  我们用时要 +1

        println(month);

 

        var day1 = date.getDay(); //※星期几, 其中星期日是0

        var day2 = date.getDate(); //※月份中的第几天,就是我们平时用的“日期”

 

        println(year + "." + (month + 1) + "." + day2);

    </script>

 

    <hr/>

 

    <script type="text/javascript">

        //格式转换

 

        //日期对象 和 毫秒值之间的转换

        var date2 = new Date();

        var time = date2.getTime(); //日期对象     毫秒值

        println("毫秒值:" + time);

 

        time = time + 2 * 24 * 60 * 60 * 1000;//2天后

        var date3 = new Date(time); //也可以用setTime() // 毫秒值     日期对象

        println("后天:" + date3.toLocaleString());

 

        //日期对象 和  字符串之间的转换

        var str = date3.toLocaleString();//日期对象      字符串

 

        //字符串     日期对象

        //var str = "6/27/2018"; //格式 OK

        //var str = "July 23, 2018"; //格式 OK

        //var str = "2010/08/08"; //格式 OK

        var str = "2010-08-08"; //格式 OK

        var time = Date.parse(str);

        var d = new Date(time);

        println(d.toLocaleString());

    </script>

 

    <hr/>

     

    <script type="text/javascript">

        /*一个小语法:

           with(对象){

             //在该区域内可以直接使用"对象"的内容(属性和方法),不需要“对象.”

          }

              

         */

        var date=new Date();

        with (date) {

            var year = getFullYear();

            var month = getMonth() + 1;

            var day = getDate();

            println(">>> " + year + "年" + month + "月" + day + "日");

        }

    </script>

</body>

</html>

Copier après la connexion

Objets en langage JS en langage JS - Objets mathématiques

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>JS语言中的对象--Math对象</title>

<script type="text/javascript" src="tools.js"></script>

</head>

<body>

    <script type="text/javascript">

        var x = -323.78;

        x = Math.abs(x);

        println("x=" + x);

 

        x = 7.89;

        x = Math.floor(x);

        println(x);//8

        x = Math.ceil(x);

        println(x);//7

        x = Math.exp(x);

        println(x);//e^2

 

        y = 5;

        println(Math.pow(x, y)); //x 的 y 次幂

 

        //round(x) 四舍五入

        println(Math.round(4.56));

 

        //random() 返回 0 ~ 1 之间的随机小数。

        //生成10个[1,10]范围内的随机整数

        for(var i=1;i<=10;i++){

            //int n = (int)(Math.random()*10) +1; //Java写法

            //var n = Math.floor( Math.random()*10 ) +1; //JS写法1---用Math.floor()实现取整

            var n=parseInt(Math.random()*10)+1;//JS写法2---用parseInt()实现取整

            print(n+" ");

        }

         println("");

    </script>

</body>

</html>

Copier après la connexion

Objets en langage JS - Objets globaux, fonctions de niveau supérieur (fonctions globales)

js définit certaines fonctions communes dans un objet appelé Global, et vous ne pouvez pas écrire « Global » lors de l'appel.

eval(str) : Évaluer et exécuter la chaîne en tant qu'instruction js

Number(s) : Convertir le paramètre s en "Valeur (Valeur de type numérique)", si le paramètre est une Date, la valeur en millisecondes est renvoyée. Si le paramètre ne peut pas être converti en valeur, il est renvoyé : NaN

parseFloat() : Analyse une chaîne et renvoie un nombre à virgule flottante.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>JS语言中的对象--Global对象, 顶层函数(全局函数)</title>

<script type="text/javascript" src="tools.js"></script>

</head>

<body>

    <script type="text/javascript">

        //js把一些通用的函数定义在一个叫Global的对象中,调用时不能写"Global."

        //eval(str): 把字符串当成js语句来进行评估且执行

        eval("x=10;y=20;document.write(x*y);");

 

        document.write("<br/>" + eval("2+2") + "<br/>");

        var x = 10;

        document.write(eval(x + 17) + "<br/>");

 

        //isNaN(s): 判断s是否是一个"非Number类型"的值

        var str = "123";

        println(isNaN(str)); //false ---不是"非Number类型"

        str = "abc123";

        println(isNaN(str)); //true ---是"非Number类型"

    </script>

 

    <hr />

 

    <script type="text/javascript">

        //Number(s): 把参数s转换成"数值(Number类型的值)",如果参数是Date则返回毫秒值,如果参数不能转换成数值则返回: NaN

        var test1 = new Boolean(true);

        var test2 = new Boolean(false);

        var test3 = new Date();

        var test4 = new String("999");

        var test5 = new String("999 888");

 

        document.write(Number(test1) + "<br />");

        document.write(Number(test2) + "<br />");

        document.write(Number(test3) + "<br />");

        document.write(Number(test4) + "<br />");

        document.write(Number(test5) + "<br />");

 

        document.write(Number.MAX_VALUE + "<br />");

        document.write(Number.MIN_VALUE + "<br />");

        document.write(Number.NEGATIVE_INFINITY + "<br />");

    </script>

 

    <hr />

 

    <script type="text/javascript">

        //parseFloat(): 解析一个字符串并返回一个浮点数。

        var str = "3.14159";

        var val = parseFloat(str);

        val *= 2;

        println(val);

 

        //parseInt(): 解析一个字符串,并返回一个整数。

        //parseInt(str, radix) : 没有参数radix时为十进制

 

        //将字符串     十进制数

        var num = parseInt("110", 10); //10进制的字符串"110"     110

        println(num);//110

        var num = parseInt("110", 2); //2进制的字符串"110" --> 6

        println(num);//6

        var num = parseInt("110", 16); //16进制的字符串"110" --> 272

        println(num);//272

 

        //将十进制数 --> 其它进制格式的字符串

        var num = 100; //js自动会把一个数值包装成一个Number对象

        //NumberObject.toString(radix)

        println(num.toString(2)); //把num转换成2进制的字符串

        println(num.toString(16)); //把num转换成16进制的字符串

     

    </script>

</body>

</html>

Copier après la connexion

Articles connexes :

Partie 2 Démarrage rapide – Bases de JS Nomenclature pratique – Modèle d'objet de navigateur, DOM

Partie 3 Démarrage rapide : Partage de code d'application pratique de base JS

Vidéos associées :

27 didacticiels vidéo pratiques classiques pour le développement JS front-end - Tutoriel vidéo en ligne gratuit

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal