JavaScript作用域、对象、Math、Date(笔记)

JavaScript作用域

就是代码名字(变量)在某个范围内起作用和效果，目的是为了提高程序的可靠性，更重要的是减少命名冲突

作用域又分为全局作用域和局部作用域
全局变量只有在浏览器关闭的时候才会销毁，比较占内存
局部变量在执行完程序后就会销毁，比较节约内存

    <script>
        // 这里是全局作用域
        // 全局作用域下的变量在全局下都可以使用
        var num = 10;

        function fn() {
            // 这里是局部作用域(函数作用域)
            //函数的形参也可以看做是局部变量
            // 如果在函数内部，没有声明直接赋值的变量也属于全局变量
            var num1 = 1;
        }
    </script>

<script>
    var num = 10;
    // 内部函数访问外部函数的变量，采取的是链式查找的方式来决定取哪个值
    function fn() { //外部函数
        var num = 20;

        function fun() { //内部函数
            console.log(num);

        }
        fun();
    }
    fn();
</script>

JS引擎运行js分为两步：预解析 代码执行
预解析会把JS里的所有var还有function提到当前作用域的最前面
代码执行 按招代码书写顺序从上往下执行
预解析分为变量预解析（变量提升）和函数预解析（函数提升）
变量提升就是把所有的变量声明提升到当前作用域的最前面，不提升赋值操作
函数提升就是把所有的函数声明提升到当前作用域的最前面，不调用函数

<script>
    var num = 10;
    fun();
    function fun() {
        console.log(num);
        var num = 20;
    }
    // 相当于执行了下面的操作
    // var num;
    // function fun() {
    //     var num;
    //     console.log(num);
    //     num = 20;
    // }
    // num = 10;
    // fun();
</script>

<script>
    function f1() {
        var a;
        a = b = c = 9;
        // 相当于var a=9; b=9; c=9; b和c想当于全局变量
        console.log(a);
        console.log(b);
        console.log(c);
    }
    f1();
    console.log(c);
    console.log(b);
    // 因为不是全局变量，所以会报错
    console.log(a);
</script>

对象

对象是一个具体的事物，看得见摸得着
对象是由属性和方法组成的

创建对象的三种方式
1、利用字面量创建对象

<script>
    // 创建对象
    // 里面的属性或方法用键值对的方式存储
    // 多个属性或方法中间由逗号隔开
    // 方法冒号后跟的是一个匿名函数
    var obj = {
            uname: 'yyyy',
            age: 21,
            sex: 'nan',
            say: function() {
                console.log('shuohuale');
            }
        }
        // 使用对象两种方式
        // 对象名.属性名
    console.log(obj.uname);
    // 对象名[属性名]
    console.log(obj['age']);

    // 调用对象的函数
    // 需要加小括号
    obj.say();
</script>

2、利用new Object来创建对象

<script>
    var obj = new Object();
    obj.uname = 'yyyy';
    obj.age = 18;
    obj.sex = 'nan';
    obj.say = function() {
        console.log('shuohua');
    }
</script>

3、构造函数创建对象

<script>
    // 因为一次创建一个对象，里面的很多方法和属性是相同的 
    // 所以我们可以可以把它封装成一个函数（构造函数）
    // function 构造函数名() {
    //     this.属性 = 值;
    //     this.方法 = function() {

    //     }
    // }
    function Star(uname, age, sex) {
        this.uname = uname;
        this.age = age;
        this.sex = sex;
    }
    // 构造函数名字首字母要大写
    // 不需要return就能返回结果
    // 调用构造函数必须使new
    var xinde = new Star('yyyy', 21, 'nan');
    console.log(typeof xinde);
    console.log(xinde.uname);
    console.log(xinde.age);
    console.log(xinde.sex);
</script>

new关键字执行过程

1、new构造函数在内存创建了一个空的对象
2、this指向创建的对象
3、执行构造函数的代码，添加方法和属性
4、返回对象

for in 遍历对象

<script>
    var obj = {
        uname: 'yyyy',
        age: 21,
        sex: 'nan',
        say: function() {
            console.log('shuohuale');
        }
    }
    for (var k in obj) {
        console.log(k); //k变量输出得到的是属性名
        console.log(obj[k]); //obj[k]得到的是属性值
    }
</script>

Math

Math不是构造函数，而是具有数学常数和函数的数学和方法，跟数学相关的运算，可以使用Math中的成员

    Math.PI; //圆周率
    Math.floor; //向下取整
    Math.ceil; //向上取整
    Math.round; //四舍五入 
    Math.abs; //绝对值
    Math.max; //最大值
    Math.min; //最小值
    Math.random //随机数

<script>
    // 随机得到两个数之间的随机整数
    function getRandom(min, max) {
        return Math.floor(Math.random() * (max - min + 1) + min);
    }
    console.log(getRandom(1, 2));
</script>

Date

<script>
    // 无参数就返回当前时间
    var date = new Date();
    console.log(date);
    var date1 = new Date(2019, 5, 1);
    // 这种返回的月份多一个月
    console.log(date1);
    var date2 = new Date('2010-05-01 0:0:0');
    console.log(date2);
</script>

<script>
    var date = new Date();
    console.log(date.getFullYear()); //返回当前年
    console.log(date.getMonth() + 1); //返回当前月
    console.log(date.getDate()); //返回的是几号
    console.log(date.getDay()); //返回周几(按招外国来)
</script>

<script>
	//封装一个显示当前时间的函数
    function getNowTime() {
        var date = new Date();
        var year = date.getFullYear();
        var month = date.getMonth() + 1;
        var dates = date.getDate();
        var arr = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
        var day = arr[date.getDay()];
        var hour = date.getHours();
        var minute = date.getMinutes();
        var second = date.getSeconds();
        console.log('今天是:' + year + '年' + month + '月' + dates + '日 ' + day + ' ' + hour + ':' + minute + ':' + second);
    }
    getNowTime();
</script>

<script>
    var date = new Date();
    //显示现在距1970/01/01的毫秒数
    console.log(date.valueOf());
    console.log(date.getTime());
    // 简单的写法
    var date1 = +new Date();
    console.log(date1);
    // H5新增的
    console.log(Date.now());
</script>