js基础

函数


this对象转换

函数对象的apply()、call()方法与fun()调用效果是一样的,不同之处在于

  1. 使用fun()调用时,fun是windows的方法
  2. 而是用call与apply调用时,使用将fun方法赋给了对应的对象中
    function fun(){
        alert(this.name);
    }
    var obj1={name:"obj1"};
    ###输出为空windows对象没有name属性
    fun();
    ###输出obj1
    fun.call(obj1);
    fun.apply(obj1);

  1. 用call与apply将函数赋给对应的对象后,如果函数需要参数只需在后面加上对应的参数就行

    apply中传递参数的时候需要数组进行传递
    call中不需要,直接单个单个传入

    function fun(a,b){
        alert(a+b);
    }
    var obj1={name:"obj1",a:1,b:2};

    fun(2,3);
    #######参数进行传递
    fun.call(obj1,1,1);
    fun.apply(obj1,[5,6]);


函数参数arguments

  1. arguments是一种类数组结构,里面保留了传递给函数的实参
function fun(){
    console.log(arguments.length);
}
fun("hello","2");
###打印为2
  1. 使用arguments对象中的实参
    我们也可以通过使用arguments[0]、arguments[1]等在函数中直接使用,而不使用形参;但这种方法比较麻烦

  2. arguments的callee属性等于当前执行的函数对象

function fun(){
    console.log(arguments.callee==fun );
}
###arguments的函数对象为fun返回true
fun()

Date构造函数

  1. 当新建一个Date对象的时候,打印的为创建Date对象的时间
#####Sat Mar 16 2019 11:44:23 GMT+0800 (中国标准时间)#
##创建对象时间
var d=new Date()
console.log(d)
  1. 指定时间进行创建
    使用参数赋值给Date对象;
    格式为: 月份/日/年 空格 时:分:秒

Date的主要方法

实践一个时钟方法

主要还是要使用setTimeout()这个函数,函数可以传递一个函数或者一个表达式;

    function startTime(){
        var now=new Date();
        var hours=now.getHours();
        var minute=now.getMinutes();
        var second=now.getSeconds();
        if(minute<=10){
            minute='0'+minute;
        }
        if(second<=10){
            second='0'+second;
        }
        document.getElementById("time").innerHTML=hours+":"+minute+":"+second;
        t=setTimeout('startTime()',500);
    }
    startTime();

Math对象

Math中封装了对应的数学属性和方法,在windows中已经生成好了Math对象,在使用Math中的方法时,直接使用即可,不必像Date一样需要构造函数进行生成


####取绝对值
console.log(Math.abs(-1));
#####向上取整数
console.log(Math.ceil(1.4));
>>2 
#######向下取整
console.log(Math.floor(1.4));
>>1
####round()四舍五入取整数
####random()返回0~1的随机数

0~10随机数
round(Math.random()*10)
1~10随机数
round(Math.random()*9)+1

Math中方法与属性

包装类

三个基本的包装类String 、Number、Boolean;分别对应着三个构造函数
在基本数据类型中没有封装对应的方法和属性,当我们使用对应的方法时,浏览器会创建一个临时的数据对象使用其中的方法;

var s=123;
###创建临时字符串String对象,使用toString方法
s=s.toString();

###将11赋值给临时1对象的hello属性;之后销毁临时对象1
s.hello="11";
####打印临时对象2的hello属性
console.log(s.hello);
>>undefind

DOM对象

document object model文档对象模型

  1. 网页都是由文档构成
  2. 网页中的每一个部分都转换成对象
  3. 使用模型来表示对象之间的关系,方便获取对象

例如我通过模型中的任意一个节点就可以找到文档中的其他任意节点

节点分类

  • 文档节点
  • 元素节点
  • 属性节点
  • 文本节点
    节点属性
##浏览器默认提供一个document对象,覆盖整个网页
btn=document.getElementById("button")
##修改id为button的属性
btn.innerHTML="dsad"

事件

包括对浏览器的操作,包括缩放网页、关闭网页、鼠标移动、点击按钮….

js事件处理

btn=document.getElementById("button");
btn.onclick=function(){
    alert("sddsa");
}

jquery事件

$("#button").click(function(){
    alert("gg");
})

js获取文档对象的几种方法

  • getElementById()
  • getElementByTagName()
  • getElementsByName()

事件冲突

当js代码在事件标签之前时,不能执行成功;得把代码写标签之后;或者可以考虑使用onload()事件

windows.onload=function(){
    js 代码区
}

js事件
jquery事件