JS第3课-js对象和定时器-九期线上班

1.js对象和定时器

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js对象</title>
</head>
<body>
<button name="send" id="send" onclick="send()">获取验证码</button>
<script>
    //定义对象
    function func1() {
        //第一种创建方式
        var obj = new Object();
        obj.name = 'jason';
        obj.age = 18;
        obj.func2 = function () {
            console.log(this.name,this.age);
        };
        obj.func22= function (name,age) {
            console.log(name,age);
        };
        //第二种创建方式
        obj.func2();
        console.log(obj);
        var obj1 = {'name':'jack','age':15};
        obj1.func3 = function(){
            console.log(obj1.name,obj1.age);
        };
        obj1.func33 = function(){
            obj.func22('li',1);
        };
        obj1.func3();
        console.log(obj1);
        var obj2 = {
            'name':'liu',
            'age':12,
            objFunc:function () {
                console.log(name,age);
            },
        };
        //调用
        obj1.func33();
        obj2.objFunc();
    }
    //匿名函数
    function func2() {
        //setTimeout的使用
        setTimeout(function () {
            console.log('3秒后运行');
        },3000);
        function timeFunc() {
            console.log('5秒后运行timeFunc()');
        }
        setTimeout(timeFunc,5000);
    }
    // setInterval 使用
    function func3() {
        var f1 = setInterval( function () {
            console.log('每三秒调用一次');
            //删除定时器
            clearInterval(f1);
        },3000);
        //5次后删除定时器
        var count = 0;
        var f2 = setInterval(function () {
            count++;
            console.log('每三秒调用一次'+count);
            if (count == 5){
                clearInterval(f2);
            }
        },3000);
    }
    function send() {
        var time = 10;
        var f3 = setInterval(function () {
            time--;
            document.getElementById('send').textContent = time+'秒后重新获取';
            if (time == 0){
                clearInterval(f3);
                document.getElementById('send').textContent = '重新获取';
            }
        },1000);
    }
</script>
</body>
</html>

总结
今天主要学习了对象的创建和使用，函数和匿名函数的使用，还有两种定时器的使用，很好用。

相关文章