JavaScript内置对象

最新推荐文章于 2024-04-26 15:46:18 发布

来自江湖的周星星

最新推荐文章于 2024-04-26 15:46:18 发布

阅读量334

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/henanzhg/article/details/51025048

版权

JavaScript 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

JavaScript创建对象的方式有三种：

1.通过new关键字创建

2.通过{}方式创建

3.通过function形式创建

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JavaScript内置对象</title>
</head>
<body>
    <!--创建对象-->
    <script>
        <!--通过new创建-->
        people = new Object();
        people.name = "Alex";
        people.age = "26";
        document.write("name:"+people.name+"<br/>"+"age:"+people.age);

        <!--通过{}创建-->
        people = {name:"Alex",age:"26"};
        document.write("name:"+people.name+"<br/>"+"age:"+people.age);

        <!--通过function创建-->
        function people(name,age){
            this.name = name;
            this.age = age;
        }
        var son = new people("Alex",26);
        document.write("name:"+son.name+"<br/>"+"age:"+son.age);
    </script>
</body>
</html>

三种方式都能得到显示结果：

name:Alex

age:26

String字符串对象

String字符串对象用于处理已有的字符串，字符串可以使用双引号和单引号（当使用双引号会产生冲突的时候，使用单引号）

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>String对象</title>
</head>
<body>
    <script>
        <!--String对象简单属性方法-->
        var str = "Hello World";

        //通过.length属性获取字符串的长度
        var strLength = str.length;
        document.write("字符串的长度:"+strLength+"<br/>");

        //通过indexOf()判断是否存在字符串,如果存在返回字符串位置,否则返回-1
        document.write(str.indexOf("World")+"<br/>");

        //通过match()匹配字符串,如果匹配成功则打印字符串,匹配不成功返回null
        document.write(str.match("World")+"<br/>");

        //通过replace()替换字符串
        document.write(str.replace("World","Alex")+"<br/>");

        //通过toUpperCase()/toLowerCase()将字符串全部转换成大写/小写
        document.write(str.toUpperCase()+"<br/>");

        //通过strong>split()将字符串转化为数组
        var players = "Kobe,James,Wade,Durant";
        var sepratePlayers = players.split(",");
        for (i=0;i<4;i++){
            document.write(sepratePlayers[i]+"<br/>");
        }
    </script>
</body>
</html>

打印结果：

字符串的长度:11
6
World
Hello Alex
HELLO WORLD
Kobe
James
Wade
Durant

Date日期对象

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Date日期对象</title>
</head>
<body οnlοad="startTime()">
    <script>
        <!--Date日期对象 我们做一个简单的电子时钟-->
        function startTime(){
            var currentDate = new Date();
            var hours = currentDate.getHours();
            var minutes = currentDate.getMinutes();
            var seconds = currentDate.getSeconds();
            hours = checkTime(hours);
            minutes = checkTime(minutes);
            seconds = checkTime(seconds);

            document.getElementById("timetxt").innerHTML = hours+":"+minutes+":"+seconds;
            //此处需要每秒刷新一次,采用递归方式调用
            setTimeout(function(){
                startTime();
            },1000);
        }

        function checkTime(obj){
            //判断时,分,秒是不是2位数
            if(obj < 10){
                return "0"+obj;
            }
            return obj;
        }
    </script>

    <div id="timetxt"></div>
</body>
</html>

Array数组对象

1.Array对象：使用单独变量名来存储一系列的值

2.数组的创建：var playerArray = ["Kobe","James","Wade"];

3.数组的访问：通过制定的数组名和索引访问特定的元素

4.数组常用方法：

concat() 合并数组

sort() 排序

push() 末尾追加元素

reverse()数组元素翻转

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Array对象</title>
</head>
<body>
    <script>
        //合并数组
        var array1 = ["Kobe","Jame"];
        var array2 = ["Curry","Durant"];
        var concatArray = array1.concat(array2);
        //打印排序过后的数组
        document.write(concatArray.sort()+"<br/>");

        //末尾追加元素
        concatArray.push("Howard");
        document.write(concatArray.sort()+"<br/>");

        //数组翻转
        document.write(concatArray.sort().reverse()+"<br/>");
    </script>
</body>
</html>

输出为：

Curry,Durant,Jame,Kobe
Curry,Durant,Howard,Jame,Kobe
Kobe,Jame,Howard,Durant,Curry

Math对象

执行常见的算术任务

常用方法：

round() 四舍五入

random() 返回0-1之间的随机数

max() 返回最高值

min() 返回最低值

abs() 返回绝对值

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Math对象</title>
</head>
<body>
    <script>
        <!--四舍五入-->
        document.write(Math.round(2.5)+"<br/>");

        <!--Math.random()会带有小数,很多时候我们不需要小数-->
        <!--默认random()的取值范围是0-1,如果取值范围为0-10则需要*10-->
        
        document.write(parseInt(Math.random()*10)+"<br/>");

        <!--max()和min()括号中的个数不固定-->
        document.write(Math.max(10,20,35,50)+"<br/>");
        document.write(Math.min(10,20,35,50)+"<br/>");

        <!--绝对值-->
        document.write(Math.abs(-10)+"<br/>");
    </script>
</body>
</html>

输出结果：

3
8
50
10
10