JS 对象

什么是对象:

JavaScript 中的所有实物都是对象: 字符串、数值、数组、函数 ...

每个对象都带有属性和方法

创建对象

<script>
    /*通过new创建对象*/
    people = new Object();
    people.name = "Tom";
    people.age = "12";
    document.write("name: "+people.name+",age: "+people.age);

    /*直接赋值创建对象*/
    people = {name:"John",age:"21"};

    /*通过函数创建对象*/
    function people(name,age) {
        this.name = name;
        this.age = age;
    }
    son = new people("pig",32);
    document.write("name: "+son.name+", age: "+son.age);
</script>

String 字符串对象

String 对象用于处理已有的字符串,常用的有:

在字符串中查找字符串: indexOf()

内容匹配: match()

更换内容: replace()

字符串大小写转换: toUpperCase()/toLowerCase()

字符串转换为数组: strong>split()

<script>
    var str = "Hello world";
    document.write("字符串长度:"+str.length);
    document.write(str.indexOf("world"));<!--返回 6，不匹配返回 -1 -->
    document.write(str.match("world"));<!--返回 world，不匹配返回 null -->
    document.write(str.replace("World","everyone"));<!--返回 Hello everyone-->
    document.write(str.toUpperCase());<!--全部转换为大写-->

    var s = str.split(" ");<!--以空格分割-->
    document.write(s[1]);
</script>
字符串属性和方法:

属性: length、prototype、constructor

方法: charAt()、charCodeAt()、concat()、fromCharCode()、indexOf()、lastIndexOf()、match()、replace()、search()、slice()、substring()、substr()、valueOf()、toLowerCase()、toUpperCase()、split()

Date 对象

Date 对象:

日期对象用于处理日期和时间

获得当日的日期: var date = new Date(); document.write(date);

常用方法:

getFullYear: 获得年份

getTime: 获取毫秒，从时间戳到现在的毫秒数

setFullYear(): 设置具体日期。如: date.setFullYear(2020,1,1);

getDay(): 获取星期

toLocaleDateString(): 年月日

toLocaleTimeString(): 时分秒

实例:

<body onload="dateTime()">
    <script>
        function  dateTime() {
            var date = new Date();
            var h = date.getHours();
            var m = date.getMinutes();
            var s = date.getSeconds();
            m = setTwo(m);
            s = setTwo(s);
            document.getElementById("time").innerHTML=h+":"+m+":"+s;
            setTimeout(dateTime,500)
        }

        function setTwo(i) {
            if(i<10){
                i = "0"+i;
            }
            return i;
        }
    </script>
    <div id="time" style="color:white;"></div>
<body>

Array 数组对象

数组的创建：

var myArray = ["Hello","iwen","ime"];

数组的常用方法:

concat(): 合并数组

sort(): 排序

push(): 末尾追加元素

reverse(): 数组元素翻转

var a = ["5","3","9","2"];
//document.write(a.sort()); //升序
document.write(a.sort(function(a,b){
    return a-b;//升序
    return b-a;

    a.push("6");//末尾追加
    document.write(a.reverse());//翻转
}));

Math 对象

执行常见的算数任务

常用方法:

round(): 四舍五入

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

max(): 返回最高值。

min(): 返回最低值。

abs(): 返回绝对值。

浏览器对象

window 对象:

window 对象是 BOM 的核心，window 对象指当前的浏览器窗口

所有 JavaScript 全局对象、函数以及变量均自动成为 window d对象的成员

全局变量是 window 对象的属性

全局函数 是 window 对象的方法

甚至 HTML DOM 的 document 也是 window 对象的属性之一

window 尺寸：

window.innerHeight - 浏览器窗口的内部高度，不包括工具栏和滚动条

window.innerWidth - 浏览器窗口的内部宽度

window 方法:

window.open() - 打开新窗口。

window. close() - 关闭当前窗口

例如： 
window.open("xx.html","windowname","height = 200,width = 200,top = 100,left = 100,toolbar = no,menubar = no");

计时器:

计时事件:

通过使用 JavaScript,我们有能力做到在一个设定的时间间隔之后执行代码，而不是在函数调用后立即执行，我们称之为计时事件

计时方法：

setInterval() - 间隔指定的毫秒数不停地执行指定的代码

——clearInterval() - 用于停止 setInterval() 方法执行的函数代码

setTimeout() - 暂停指定的毫秒数后执行指定的代码

——clearTimeout() - 用于停止执行 setTimeout() 方法的函数代码

实例： 
<p id="ptime"></p>
<button onclick="stopTime()">停止</button>
<script>
    var myTime = setInterval(function () {
        getTime();
    },1000);
    function getTime() {
        var date = new Date();
        var t = date.toLocaleString();
        document.getElementById("ptime").innerHTML = t;
    }
    function stopTime() {
        clearInterval(myTime);
    }
    getTime();
</script>

History 对象

History 对象:

window.history 对象包含浏览器的历史 (url) 的集合

History 方法:

history.back() - 与在浏览器点击后退按钮相同

history.forward() - 与在浏览器中单击按钮向前相同

history.go() - 进入历史中的某个页面

<form>
   <input type="text" id="username"/>
   <button id="btn" onclick="safe();return false;">登录</button>
</form>
<script>
   function safe() {
       var v = document.getElementById("username").value;
       if(v == "hello"){
           window.history.go(-1);
       }else{
           alert("输入错误");
       }
   }
</script>

Location 对象

Location 对象:

window.location 对象用于获得当前页面的地址（URL），并把浏览器重定向到新的页面。

Location 对象的属性:

location.hostname - 返回 web 主机的域名

location.pathname - 返回当前页面的路径和文件名

location.port - 返回 web 主机的端口

location.protocol - 返回所使用的 web 协议 (http:// 或 https://)

location.href - 属性返回当前页面的 URL

location.assign() - 方法加载新的文档

Screen 对象

window.screen 对象包含有关用户屏幕的信息

属性:

screen.availWidth - 可用的屏幕宽度

screen.availHeight - 可用的屏幕高度

screen.height - 屏幕高度

screen.width - 屏幕宽度