JS基础day13

内边宽度，高度:

window.innerWidth，document.documentElement.clientWidth

window.innerHeight，document.documentElement.clientHeight

外边宽度，高度:

window.outerWidth,window.outerHeight

网页元素的宽高

document.body.clientWidth，document.body.clientHeight

滚动条向下滚动的像素：

document.documentElement.scrollTop，document.body.scrollTop

滚动条向右滚动的元素：

document.documentElement.scrollLeft，document.body.scrollLeft

创建函数的几种方法：

①声明式

function fun() {
      //功能代码
    }

②立即执行函数

(function fun() {
      //功能代码 
    })();
或
(function fun() {
      //功能代码 
    }());
//用括号包裹住一个匿名函数并且立马调用
//使用立即执行函数可以防止变量被外界改变

立即执行函数也能传参
(function fun(a,b) {
   console.log(a+b);    //5
})(2,3);

③赋值型函数

let fun1 = function(){
    //功能代码
}
fn1();

④箭头函数

var fn = ()=>{
    //功能代码    
}
fn();

//如果是单行，可以省略{}
var fn = ()=>//功能代码
fn();

//如果只有单个参数，可以如下
var fn = a=>console.log(a)
fn();

//如果没有参数，可以如下
var fn = _=>//功能代码
fn();

④箭头函数

返回值

let fun = function(a,b){
    return a*b;
}
let result = fun(2,3); //result==6
console.log(result);

function fn1(a,b) {
    function fn2() {
        console.log("内层函数");
    }
    console.log(a+b);
    return fn2;    //返回的是函数体
}
let cs1 = fn1(2,4);
console.log(cs1)

function fn1(a,b) {
    function fn2() {
        console.log("内层函数");
    }
    console.log(a+b);
    return fn2();    //返回的是结果
}
let cs2 = fn1(2,4);
console.log(cs1)

this函数

this指向调用的作用域，谁调用函数，this就指向谁

1：全局作用下，this指向的是window

2：函数独立调用时，函数内部的this也指向window

function fun (){
    console.log(this);    //window
}    
fun();

3：被嵌套的函数独立调用时，this默认指向了window

function fun1() {
    function fun2() {
        console.log(this);    //window
    }
    fun2(); 
}
fun1();

4：IIFF自执行函数中内部的this也是指向window

5：构造函数中的this用于定义新成员

function fn (a){
    this.name = a;
    this.newfn = function(){
        console.log("内部函数功能")
    }
}

//调用构造函数
let people = new fn('张三');
people.newfn();