zoukankan      html  css  js  c++  java
  • javascript读书笔记(二)

    对象

    javascript的对象是一种无序的集合数据类型,由若干的键值对组成。用于描述现实世界的对象。

    var xiaoming = {
        name: '小明',
        birth: 1990,
        school: 'No.1 Middle School',
        height: 1.70,
        weight: 65,
        score: null
    };

    声明了一个name**属性值**是’小明’,birth属性,值是1990,以及其他一些属性。最后,把这个对象赋值给变量xiaoming后,就可以通过变量xiaoming来获取小明的属性了:

    xiaoming.name; // '小明'
    xiaoming.birth; // 1990

    访问属性是通过.操作符完成的,但这要求属性名必须是一个有效的变量名。如果属性名包含特殊字符,就必须用”括起来:

    var xiaohong = {
        name: '小红',
        'middle-school': 'No.1 Middle School'
    };

    xiaohong的属性名middle-school不是一个有效的变量,就需要用”括起来。访问这个属性也无法使用.操作符,必须用[‘xxx’]来访问:

    xiaohong['middle-school']; // 'No.1 Middle School'
    xiaohong['name']; // '小红'
    xiaohong.name; // '小红'

    要判断一个属性是否是xiaoming自身拥有的,而不是继承得到的,可以用hasOwnProperty()方法:

    var xiaoming = {
        name: '小明'
    };
    xiaoming.hasOwnProperty('name'); // true
    xiaoming.hasOwnProperty('toString'); // false

    for….in循环

    for循环的一个变体是for … in循环,它可以把一个对象的所有属性依次循环出来:

    var o = {
        name: 'Jack',
        age: 20,
        city: 'Beijing'
    };
    for (var key in o) {
        alert(key); // 'name', 'age', 'city'
    }

    要过滤掉对象继承的属性,用hasOwnProperty()来实现:

    var o = {
        name: 'Jack',
        age: 20,
        city: 'Beijing'
    };
    for (var key in o) {
        if (o.hasOwnProperty(key)) {
            alert(key); // 'name', 'age', 'city'
        }
    }
    

    由于Array也是对象,而它的每个元素的索引被视为对象的属性,因此,for … in循环可以直接循环出Array的索引:

    var a = ['A', 'B', 'C'];
    for (var i in a) {
        alert(i); // **'0', '1', '2'****是字符串不是number**
        alert(a[i]); // 'A', 'B', 'C'
    }

    注意,for … in**对Array的循环得到的是String**而不是Number。

    函数Function


    函数体内部的语句在执行时,一旦执行到return时,函数就执行完毕,并将结果返回。如果没有return语句,函数执行完毕后也会返回结果,只是结果为undefined。JavaScript**允许传入任意个参数**而不影响调用,因此传入的参数比定义的参数多也没有问题,传入的参数比定义的少也没有问题。


    arguments


    只在函数内部起作用,并且永远指向当前函数的调用者传入的所有参数,即使函数不定义任何参数,还是可以拿到参数的值。arguments类似Array但它不是一个Array:

    function foo(x) {
        alert(x); // 10
        for (var i=0; i<arguments.length; i++) {
            alert(arguments[i]); // 10, 20, 30
        }
    }
    foo(10, 20, 30);

    arguments最常用于判断传入参数的个数。你可能会看到这样的写法:

    // foo(a[, b], c)
    // 接收2~3个参数,b是可选参数,如果只传2个参数,b默认为null:
    function foo(a, b, c) {
        if (arguments.length === 2) {
            // 实际拿到的参数是a和b,c为undefined
            c = b; // 把b赋给c
            b = null; // b变为默认值
        }
        // ...
    }

    要把中间的参数b变为“可选”参数,就只能通过arguments判断,然后重新调整参数并赋值。


    为了获取除了已定义参数a、b之外的参数,我们不得不用arguments,并且循环要从索引2开始以便排除前两个参数,这种写法很别扭,只是为了获得额外的rest参数,有没有更好的方法?

    function foo(a, b) {
        var i, rest = [];
        if (arguments.length > 2) {
            for (i = 2; i<arguments.length; i++) {
                rest.push(arguments[i]);
            }
        }
        console.log('a = ' + a);
        console.log('b = ' + b);
        console.log(rest);
    }

    ES6标准引入了rest参数

    function foo(a, b, ...rest) {
        console.log('a = ' + a);
        console.log('b = ' + b);
        console.log(rest);
    }
    
    foo(1, 2, 3, 4, 5);
    // 结果:
    // a = 1
    // b = 2
    // Array [ 3, 4, 5 ]
    
    foo(1);
    // 结果:
    // a = 1
    // b = undefined
    // Array []

    rest参数只能写在最后,前面用…标识
    多余的参数以数组形式交给变量rest,所以,不再需要arguments我们就获取了全部参数。
    如果传入的参数连正常定义的参数都没填满,也不要紧,rest参数会接收一个空数组(注意不是undefined)。


    return语句

    JavaScript引擎有一个在行末自动添加分号的机制

    function foo() {
        return; // 自动添加了分号,相当于return undefined;
            { name: 'foo' }; // 这行语句已经没法执行到了
    }

    所以正确的多行写法是:

    function foo() {
        return { // 这里不会自动加分号,因为{表示语句尚未结束
            name: 'foo'
        };
    }

    变量作用域

    由于JavaScript的函数可以嵌套,此时,内部函数可以访问外部函数定义的变量,反过来则不行:

    'use strict';
    
    function foo() {
        var x = 1;
        function bar() {
            var y = x + 1; // bar可以访问foo的变量x!
        }
        var z = y + 1; // ReferenceError! foo不可以访问bar的变量y!
    }

    JavaScript的函数定义有个特点,它会先扫描整个函数体的语句,把所有申明的变量“提升”到函数顶部:

    'use strict';
    
    function foo() {
        var x = 'Hello, ' + y;            //hello,undefined
        alert(x);
        var y = 'Bob';
    }
    
    foo();

    虽然是strict模式,但语句var x = ‘Hello, ’ + y;并不报错,原因是变量y在稍后申明了。但是alert显示Hello, undefined,说明变量y的值为undefined。这正是因为JavaScript引擎自动提升了变量y的声明,但不会提升变量y的赋值。

    对于上述foo()函数,JavaScript引擎看到的代码相当于:

    function foo() {
        var y; // 提升变量y的申明
        var x = 'Hello, ' + y;
        alert(x);
        y = 'Bob';
    }

    由于JavaScript的这一怪异的“特性”,我们在函数内部定义变量时,请严格遵守“在函数内部首先申明所有变量”这一规则。


    名字空间

    全局变量会绑定到window上,不同的JavaScript文件如果使用了相同的全局变量,或者定义了相同名字的顶层函数,都会造成命名冲突,并且很难被发现。

    减少冲突的一个方法是把自己的所有变量和函数全部绑定到一个全局变量中。例如:

    // 唯一的全局变量MYAPP:
    var MYAPP = {};
    
    // 其他变量:
    MYAPP.name = 'myapp';
    MYAPP.version = 1.0;
    
    // 其他函数:
    MYAPP.foo = function () {
        return 'foo';
    };

    在for循环等语句块中是无法定义具有局部作用域的变量的


    为了解决块级作用域,ES6引入了新的关键字let,用let替代var可以申明一个块级作用域的变量:

    'use strict';
    
    function foo() {
        var sum = 0;
        for (let i=0; i<100; i++) {     //要是改成var i=0
            sum += i;
        }
        i += 1; // SyntaxError         //那么这里面的i是可以被访问的,不会出错
    }

    ES6标准引入了新的关键字const来定义常量,const与let都具有块级作用域

  • 相关阅读:
    数据库设计
    最近发生的事
    轻松搞定面试中的二叉树题目
    二叉树的遍历方法
    静态库Lib和动态库Dll
    深入理解C/C++数组和指针
    夜间日记
    typedef用法小结
    什么是静态链接库,什么是动态链接库
    线段树
  • 原文地址:https://www.cnblogs.com/linewman/p/9918395.html
Copyright © 2011-2022 走看看