Javascript常用对象

Javascript是基于对象的语言，大部分对象都是系统创建好了的，所以不需要像Java中new的方式创建对象。

String对象

创建方式：

var str = new String("hello") ;
var str = "hello" ;

常用方法

valueOf()

返回指定对象的原始值，在比较两个字符串内容的时候直接比较会返回false，需要调用valueOf()方法来比较。

charAt(index)

返回字符串中指定索引处的字符。

indexOf(string)

返回参数中字符串第一次出现的索引

lastIndexOf(string)

返回参数中字符串最后一次出现的索引

fontcolor("color")

给字符串设置颜色

substring(start, end)

截取指定区间内的字符串

substr(start , length)

指定起始位置截取指定长度的字符串

---

Array对象

• 在JavaScript中数组可以存储任何类型的元素。
• JavaScript中数组不会发生脚标越界会自动添加。

创建方式

    var arr = new Array();
    var arr = new Array(3); 
    var arr=new Array("hello",100,true,'a');
    var arr=[10,"hello",false,'a'];

属性

length

• 返回当前数组的长度

遍历

<script type="text/javascript">
    var arr=[10,"hello",false,'a'];
    for (var i = 0; i < arr.length; i++) {
        document.write(arr[i]+'<br/>') ;
    }
</script>

方法

join()

• 将数组中的元素用参数中的内容进行拼接，返回一个新的字符串。

<script type="text/javascript">
    var arr=[10,"hello",false,'a'];
    var arrs=arr.join('-');
    document.write(arrs);//10-hello-false-a
</script>

reverse()

• 将数组中的元素进行反转

<script type="text/javascript">
    var arr=[10,"hello",false,'a'];
    var arrs=arr.reverse();
    document.write(arrs);//a,false,hello,10
</script>s

Number对象

创建方式

var num1 = new Number(100)；
var num1 = 100；

Boolean对象

创建方式

var b = new Boolean(true)；
var b = true;

Math对象

方法

ceil(number)

取整

floor(number)

四舍五入

round(number)

求一个与参数最接近的整数

random()

获取介于 0 和 1 之间的一个伪随机数。

max(...)

获取参数中最大的一个数，参数可以为任意个。

Date对象

创建

var date  = new Date() ;

方法

getFullYear()

获取年

getMonth()

获取月份，计数从0开始

getDate()

获取日

getHours()

获取小时

getMinutes()

获取分钟

getSeconds()

获取秒

window对象

• 表示浏览器窗口对象
• window对象因为经常调用所以window可以省略不写。

方法

setInterval("function",time)

每经过多少毫秒执行一次方法，返回值是定时器id值

setTimeout("function",time)

经过多少毫秒后只执行一次方法，返回值是定时器id值

clearInterval(iIntervalID)

取消setInterval操作，参数中需要给一个定时器的id值

clearTimeout(timeoutId)

取消setTimeout操作，参数中需要给一个定时器的id值

open(URL,name,features,replace)

打开一个页面

参数	描述
URL	可选字符串参数，规定要打开页面的URL。不写则打开一个空白页面。
name	可选字符串参数，新窗口的名称，可以省略。
features	可选字符串参数，声明新窗口的特征，包括是否全屏，是否显示菜单栏，状态栏，标题栏等。
replace	可选布尔值。true表示替换当前的历史记录，false表示在历史中创建新的项目

• features常用参数：
  
  • ”_blank”：新窗口打开
  • “_self”：当前窗口打开
• 窗口特征

alert("提示框") 

弹框

confirm("消息对话框")

有确认和取消按钮的提示框，返回一个布尔值用来表示点击的按钮。

prompt("提示对话框") 

含有一条提醒，一个输入框，和确认，取消按钮。返回值为布尔值。

---

location对象

• window对象的一部分，可以通过window.location调用

属性

href

可以设置或返回当前页面的URL，可以用来作为页面跳转

方法

reload()

刷新当前页面，可以添加参数

• true：参数为true时每次调用都从服务器下载网页
• false：为false时会优先从缓存加载，服务器如果更新了内容才从服务器下载，和浏览器的刷新功能相同。

---

history对象

• window的一部分通过window.history调用

方法

forward()

载入历史列表的下一个，和浏览器中的前进一样

back()

载入历史列表上一个，和浏览器中的后退一样

go(number|URL)

参数为URl时跳转到指定的URL页面，参数为数字时则跳转到历史列表的相对位置
- go(-1)：相当于back()
- go(1)：相当于forward()
- go(0)：相当于刷新reload()

---

screen对象

• 获取工作区域的宽高

属性

availHeight

返回显示屏幕的高度 (除 Windows 任务栏之外)

availWidth

返回显示屏幕的宽度 (除 Windows 任务栏之外)。

height

返回显示屏幕的高度。

width

返回显示屏幕的宽度。

---

创建自定义对象

• 类似于Java构造方法的形式，也使用function作为关键字。

方式1

• 通过类似Java有参构造的方式创建对象

<script type="text/javascript">
    //自定义对象
    function Student(name, age) {
        this.name = name;
        this.age = age;
        //可以在对象内定义方法
        this.speak = function () {
            alert('我的名字是：' + name + '我的年龄是：' + age);
            //我的名字是：张三我的年龄是：20
        }
    }
    //创建对象
    var s = new Student("张三", 20);
    //调用方法
    s.speak();
    //Javascript中将自定义对象的属性当作数组处理.可以使用for-in遍历
    for (var i in s) {
        document.write(s[i] + "<br />")
    }
    //对象里面的方法也会被遍历
    /*输出：
        张三
        20
        function () { alert('我的名字是：' + name + '我的年龄是：' + age); }
    */
    //也可以像Java中的访问方式调用
    document.write(s.name + " " + s.age); //张三 20
</script>

方式2

• 通过追加的方式创建对象

<script type="text/javascript">
    //自定义对象
    function Student(name, age) {
        this.name = name;
        this.age = age;
    }
    var p = new Student();
    //也可以通过追加的方式创建
    p.name = "李四";
    p.age = 21;
    //追加方法
    p.play = function () {
        document.write("玩游戏中...");
    }
    document.write(p.name + "--" + p.age+'<br/>');
    //李四--21
    p.play();
    //玩游戏中...
</script>

方式3

• 通过json解析

<script type="text/javascript">
    //自定义对象
    function Student(name, age) {
        this.name = name;
        this.age = age;
    }
    var p = {
        "name": "王五",
        "age": 25,
        "play": function () {
            document.write('玩游戏')
        }
    };
    document.write(p.name + "--" + p.age + '<br/>');
    //王五--25
    p.play();
    //玩游戏
</script>

---

原型

• 给JavaScript中内置对象追加方法
• 通过内置对象的prototype属性为内置对象追加方法

给Array对象追加查询最大值的方法。

<script type="text/javascript">
    //追加查询最大值的方法
    Array.prototype.max = function () {
        //获取第一个元素作为参考值
        var max = this[0];
        for (let i = 0; i < this.length; i++) {
            if (this[i] > max) {
                max = this[i];
            }
        }
        return max;
    }
    //测试
    var arr=[10,50,82,62,12,85,45];
    document.write(arr.max());//85
</script>

---

常用属性

innerHTML

获取HTML标签的文本对象

案例

网页时钟

<html>
    <head>
        <meta charset="utf-8" />
        <title>Javascript</title>
        <script type="text/javascript">
            function time() {
                //创建Date对象
                var date = new Date();
                //字符串拼接当前时间
                var str = date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate();
                str += "&nbsp; " + date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
                //获取span标签的内容
                document.getElementById("time").innerHTML = str;
            }
            //定时器
            window.setInterval("time()", 1000);
        </script>
    </head>

    <body>
        当前系统时间：<span id="time"></span>
    </body>
</html>

• 显示效果