声明前置 作用域 闭包 DOM 事件

102 阅读1分钟

DOM 事件

// dom0     onClick             onClick = null          click
// dom2     addEventListener    removeEventListener     click
// IE       attachEvent         detachEvent             click
// 数量, 同名callback, 触发, 移除同名回调函数, e, this
// target, srcElement,  currentTarget
// 冒泡:stopPropagation, cancelBubble
// 默认行为: preventDefault, returnValue
// clientXY, offsetXY, pageXY, layerXY, screenXY

声明前置 作用域 闭包

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<script>
// a没有声明,使用的时候会报错
console.log(a);
// a声明了,因此使用的时候不会报错
var a = 10;
console.log(a);

// 声明提升
console.log(a);
var a = 20;
// 等价写法
var a;
console.log(a);
a = 20;

// 函数声明提升

// 1.函数表达式:undefined
console.log(fun);
var fun = function() {}
// 等价写法
var fun;
console.log(fun);
fun = function() {}

// 2.函数定义式: function() {}
console.log(fun);
function fun() {}
等价写法
function fun() {}
console.log(fun);

// 作用域
var a = 10;
function demo() {
    var a = 30;
}
demo()
function main() {
    // var a = 20;
    console.log(a);
    // 只能从内向外查找,不能从外向内查找
    // function demo() {
    //     var a = 40;
    // }
    // demo();
}
main();

// 1 词法分析   参数,
// 2 执行过程
// console.log('hello');
// console.log(a);
// ^&*();

</script>
</body>
</html>

面试题

// 面试题
var num = 10;
console.log(111, num);
// AO.num: undefined
function main(num = 20) {
    console.log(222, num);
    // AO.num: undefined
    var num = 30;
    console.log(333, num);
    // AO.num: 定义式
    function num() {
        console.log('函数定义式');
    }
    console.log(444, num);
    // AO.num: undefined
    var num = function() {
        console.log('函数表达式');
    }
    console.log(555, num);
}
console.log(666, num);
var num = 40;
console.log(777, num);
main(50);
console.log(888, num);
1    6   7   2   3   4   5   8
10   10  40  50  30  30  表达式  40

var num = 10;
console.log(111, num);
// AO.num: undefined
function main(num = 20) {
    console.log(222, num);
    // AO.num: undefined
    num = 30;
    console.log(333, num);
    // AO.num: 定义式
    console.log(444, num);
    // AO.num: undefined
    num = function() {
        console.log('函数表达式');
    }
    console.log(555, num);
}
console.log(666, num);
var num = 40;
console.log(777, num);
main(50);
console.log(888, num);

console.log(a);
var a = 10;
function a () {}
console.log(a);

闭包

全局
var a = 10;
function test1() {
   a++
}
function test2() {
   a += 2;
}
test1()
test1()
test2()
console.log(a);

// 闭包
function outer(a) {
   var b = 10;
   // 将外部环境中的数据私有化,可以记录外部环境中的数据
   return function inner(x) {
       var y = 100;
       a++;
       b++;
       x++;
       y++;
       console.log(a, b, x, y);
   }
}
// 创建闭包
var demo = outer(20);
demo(2);
demo(2);
demo(2);
// 创建新的闭包
var demo2 = outer(30);
demo2(3);
demo2(3);
demo2(3);
demo2(3);