2019-02-23_js_07定时器、函数

定时器、函数

一、定时器

1.)setTimeout(function(){},time) 单次执行
    表示在time毫秒后执行function
2.)clearTimeout(timer):清除计时器
    timer:表示定义的计时器
3.)setInterval(function(){},time):可循环执行function
      表示每隔time毫秒后执行的函数
4.)clearInterval(timer)
    timer:表示定义的计时器
//鼠标按下时间
var div = document.querySelector(".test");
//封装长按功能函数
function longpress(el,callback){//el:传入元素、callback:传入一个函数
    var timer;
    el.addEventListener("mousedown",function(){
        timer = setTimeout(function(){//长按
                callback();
            },1000)
        })
    //鼠标抬起
    document.addEventListener("mouseup",function(){
        //console.log("鼠标被抬起了");
        clearTimeout(timer);//清除计时器
    })
        
    }
longpress(div,function(){
    alert("哈哈哈哈");
});
//模拟一个双击事件(提示,用定时器实现)
function twoClick(el,callback){
    var isClick = false;
    el.addEventListener("click",function(){
        if(isClick==true){
            callback();
            isClick = false;
            clearTimeout(t);
        }else{
            isClick = true;
            var t = setTimeout(function(){
                isClick = false;
            },300)
        }
    })
}

二、函数

函数无论在声明的前面或者是声明的后面都可以调用
argument:数组的形式接收函数的参数
length:获取到函数的形参个数

function calc(){
    if(arguments.length==1){
        alert("你的名字:"+arguments[0]+"\n 经过我的神机妙算,你的未来无可限量");
    }else{
        alert("请输入你的名字");
    }
}
calc("啥啥啥");//函数提前,无论在声明的后面还是前面,都可以调用
console.log(calc.length);

闭包(函数体内嵌套函数):使得函数可以调用其他函数体内变量

//valueOf
function fun(){
    var x = 1;
    // 闭包(函数体内嵌套函数)
    function func(){
        console.log("我是func函数里面的函数",x);
    }
    func();
    return x;
}
fun();
console.log(fun.valueOf());//获取函数体
console.log(typeof fun.toString());//输出函数 类型是字符串

1.函数声明的方式:

      1)函数声明:function name(){}
      2)函数表达式:var fun = function(){}
         调用方法:变量名+小括号
      3)箭头函数(es6语法):
          第一种形式:()=>{};
          第二种形式:(name=>{})();
          第三种形式:(name=>())();
  注意:
      当我们使用函数表达式的方式来声明函数的时候,也给了函数名,
      这个函数名是不能够在函数体外进行调用,只能够在函数体内调用
//当我们使用函数表达式的方式来声明函数的时候,也给了函数名,
//这个函数名是不能够在函数体外进行调用,只能够在函数体内调用
var test = function func1(){
    console.log(func1);
    console.log("哈哈哈");
}
console.log(test.name);//func1
//          func1();//直接报错  func1 is not defined 一整个是一个值
test();//哈哈哈
go1();//函数声明,调用第二个函数 因为全局任意地方都可以调用
var go1 = function(){
    console.log("函数表达式")
}
go1();//函数表达式
function go1(){
    console.log("函数声明");
}//会提前,被覆盖掉
go1();//函数表达式

2.函数this的指向(箭头函数除外):

谁调用函数,这个this就指向谁
this的指向一般有3种情况:
        1.全局作用域内调用函数,this指向window
        2.通过事件来调用函数,this指向这个事件的调用者
        3.对象调用其方法,this指向这个对象
setTimeout(function(){
    console.log(this);//window
},1000)
window.setTimeout(function(){
    console.log("通过window来调用定时器",this);
},1000)//setTimeout是window的方法


function foo(){
    console.log(this);//window
}
foo();//最大的对象是window
var div = document.querySelector(".test");
div.addEventListener("click",function(){
    console.log(this);//div
});

//对象的方法调用
var obj ={
    name:"bgg神教,一统江湖",
    skill:function(){
        console.log(this);
    }
}
//obj.skill();//obj
var skr = obj.skill;
skr();//window

div.addEventListener("click",()=>{
    console.log(this);
});//window //箭头函数指向window

3.箭头函数案例

//箭头函数()=>{}
//第一种
((age)=>{
    console.log(age);
    console.log(window);
})(20);

//箭头函数()=>{}
//第二种
(age =>{
    console.log(age);
})(222);
setTimeout(age =>{
    console.log("sss")
},1000);

//箭头函数()=>{}
//第三种 只能写一个语句(语句后不能有分号;)
(age=>console.log(age))(888);
//(age=>console.log(age);console.log("aaaaa");)(888);//报错
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 205,386评论 6 479
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,939评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,851评论 0 341
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,953评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,971评论 5 369
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,784评论 1 283
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,126评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,765评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,148评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,744评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,858评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,479评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,080评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,053评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,278评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,245评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,590评论 2 343

推荐阅读更多精彩内容

  • Lua 5.1 参考手册 by Roberto Ierusalimschy, Luiz Henrique de F...
    苏黎九歌阅读 13,738评论 0 38
  • 这是16年5月份编辑的一份比较杂乱适合自己观看的学习记录文档,今天18年5月份再次想写文章,发现简书还为我保存起的...
    Jenaral阅读 2,731评论 2 9
  • 函数参数的默认值 基本用法 在ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法。 上面代码检查函数l...
    呼呼哥阅读 3,357评论 0 1
  • 函数参数的默认值 基本用法 在ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法。 上面代码检查函数l...
    陈老板_阅读 446评论 0 1
  • 函数参数的默认值 基本用法 ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法。 上面代码检查函数lo...
    oWSQo阅读 243评论 0 0