《javaScript高级程序设计》笔记（二）

第四章 变量、作用域和内存问题

1、变量类型：

（1）基本类型： Undefined 、 Null 、 Boolean 、 Number 和 String 

var a=1
var b=a
b //1
a=2
b //1
b=3
a=2

（2）引用类型：Object  Function

var aa={a:1,b:2}
var bb=aa
bb //{a:1,b:2}
bb.a=3
aa //{a:3,b:2}
//当引用bb中的元素改变bb时，aa会随之改变。当整体改变bb时，aa的值不受影响。

2、垃圾回收机制

（1）标记清除（比较常用）：标记变量为“进入环境”，“离开环境”

（2）引用计数（原来IE在用，后来会出现性能问题，废弃），当值被一个变量引用一次，则该值的引用次数+1，当变量的值被改变时，该值的引用次数-1，直至引用次数变为0时，则说明没有办法再访问这个值了，就可以将其占用的内存空间回收回来（当代码中存在循环引用（两个值互相引用）现象时，该算法会导致问题）。

第五章 引用类型

1、访问对象的方法：

    （1）常用，点访问。person.name

    （2）方括号访问。person["name"]

    方括号访问的优点是，方括号里面可以是变量，person[variable]

2、栈方法：对于数组的操作（后入先出），对应的方法：pop()移除数组末尾的最后一项，返回值为最后一项。push()向数组的末尾追加值，返回值为追加后的数组的长度。

3、队列方法：对于数组的操作（先进先出），对应的方法：shift()移除数组的第一项，返回值为第一项。push()。

4、数组的重排序方法：reverse()，sort()，返回值都是经过排序后的数组。reverse将当前数组逆转。sort将当前数组进行排序。

可对sort函数进行参数传递来规定排序方式。

function compare(value1, value2) {
    if (value1 < value2) {
        return 1;
    } else if (value1 > value2) {
        return -1;
    } else {
        return 0;
    }
}
var values = [0, 1, 5, 10, 15];
values.sort(compare);
alert(values); // 15,10,5,1,0


//为了简化上面的比较函数，可讲上面的函数简化为,2-1是降序，1-2是升序

function compare(value1, value2){
    return value2 - value1;
}

5、数组的操作方法：

（1）concat()：基于当前数组的所有项创建一个新的数组，当括号中有传参时，会将这些参数添加到数组的末尾，返回新数组，在没有给concat传参时，则将返回当前数组的副本。

var colors = ["red", "green", "blue"];
var colors2 = colors.concat("yellow", ["black", "brown"]);
alert(colors); //red,green,blue
alert(colors2); //red,green,blue,yellow,black,brown

（2）slice()：基于当前数组中的一项或多项创建一个新数组，接受1或2个参数，即返回项的起始和结束位置（不包括结束项），若只传递一个参数，则返回起始项直至末尾的项。

var colors = ["red", "green", "blue", "yellow", "purple"];
var colors2 = colors.slice(1);
var colors3 = colors.slice(1,4);
alert(colors2); //green,blue,yellow,purple
alert(colors3); //green,blue,yellow

（3）splice()：
       删除：可以删除任意数量的项，包括两个参数，要删除的第一项的位置和要删除的项数。splice(0,2)会删除数组的前两项。

       插入：可以向指定位置插入任意数量的项，包含三个参数，插入位置，0（要删除的项数），和要插入的项。如果要插入更多的项，则可以继续传递第四，五，六等参数。

        替换：可以向指定位置插入任意数量的项，同时删除任意数量的项，用法同上。

（4）位置方法：indexOf()和lastIndexOf()，这两个方法都接受两个参数，要查找的项和（可选）表示查找起点位置的索引。其中， indexOf() 方法从数组的开头（位置 0）开始向后查找， lastIndexOf() 方法则从数组的末尾开始向前查找。这两个方法都返回要查找的项在数组中的位置，或者在没找到的情况下返回-1。

（5）迭代方法：

       ECMAScript 5 为数组定义了 5 个迭代方法。每个方法都接收两个参数：要在每一项上运行的函数和、（可选的）运行该函数的作用域对象——影响 this 的值。传入这些方法中的函数会接收三个参数：数组项的值、该项在数组中的位置和数组对象本身。

          every() ：对数组中的每一项运行给定函数，如果该函数对每一项都返回 true ，则返回 true 。
          filter() ：对数组中的每一项运行给定函数，返回符合条件的值组成的数组。
          forEach() ：对数组中的每一项运行给定函数。这个方法没有返回值。
          map() ：对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组。
          some() ：对数组中的每一项运行给定函数，如果该函数对任一项返回 true ，则返回 true 。

          以上方法都不会修改数组中的包含的值。

          every()、some()用法：判断数组中的每一项是否符合某个条件

var numbers = [1,2,3,4,5,4,3,2,1];
var everyResult = numbers.every(function(item, index, array){
    return (item > 2);
});
alert(everyResult); //false，有一项不符合条件即返回false
    var someResult = numbers.some(function(item, index, array){
    return (item > 2);
});
alert(someResult); //true，存在一项符合条件即返回true

           filter()用法：筛选出数组中符合条件的值

var numbers = [1,2,3,4,5,4,3,2,1];
var filterResult = numbers.filter(function(item, index, array){
    return (item > 2);
});
alert(filterResult); //[3,4,5,4,3]

         map()用法：对数组中的每一项进行统一操作

var numbers = [1,2,3,4,5,4,3,2,1];
var mapResult = numbers.map(function(item, index, array){
    return item * 2;
});
alert(mapResult); //[2,4,6,8,10,8,6,4,2]

          forEach()用法：这个方法没有返回值，只是对数组中的每一项运行传入的函数，本质上与使用for循环迭代数组一样

var numbers = [1,2,3,4,5,4,3,2,1];
numbers.forEach(function(item, index, array){
    //执行某些操作
});

（6）归并方法：reduce()、reduceRight()

          这两个方法都会迭代数组的所有项，然后构建一个最终返回的值。其中， reduce() 方法从数组的第一项开始，逐个遍历
到最后。而 reduceRight() 则从数组的最后一项开始，向前遍历到第一项。

        这两个方法都接收两个参数：一个在每一项上调用的函数和（可选的）作为归并基础的初始值。传给 reduce() 和 reduceRight() 的函数接收 4 个参数：前一个值、当前值、项的索引和数组对象。第一次迭代发生在数组的第二项上，因此第一个参数是数组的第一项，第二个参数就是数组的第二项。

var values = [1,2,3,4,5];
var sum = values.reduce(function(prev, cur, index, array){
    return prev + cur;
});
alert(sum); //15

           第一次：pre=1，cur=2

           第二次：pre=3(1+2)，cur=3

            ......

6、Date()类型：

     

var now = new Date();//无传参

      在调用 Date 构造函数而不传递参数的情况下，新创建的对象自动获得当前日期和时间。

     

var someDate = new Date("May 25, 2004");//有传参

// 本地时间 2005 年 5 月 5 日下午 5:55:55
var allFives = new Date(2005, 4, 5, 17, 55, 55);

7、Function类型：

      （1）函数声明与函数表达式：虽然二者在定义函数上使用的效果是一样的，但是当解析器在执行环境中加载数据时，对函数声明和函数表达式并非一视同仁，解析器会率先读取函数声明，并使其在执行任何代码之前可用（可以访问）；而函数表达式则必须等到代码执行到它所在行时，才会真的被执行。（函数声明会被提升到顶部）。

      （2）作为值的函数：可以把函数当做参数一样的传递给另外一个函数，而且可以将一个函数作为另一个函数的结果返回。

function callSomeFunction(someFunction, someArgument){
    return someFunction(someArgument);
}

      （4）函数的内部属性：在函数内部，有两个特殊的属性：arguments和this。arguments用于保存函数的参数，这个对象还有一个名叫callee的属性，该属性是一个指针，指向拥有这个arguments对象的函数。

        callee：

         应用实例：阶乘函数，递归算法。

         在不使用callee属性时，直接使用函数名称调用函数。

function factorial(num){
    if (num <=1){
        return 1;
    }
    else{
        return num * factorial(num-1)
    }
}

         但这样会使函数与函数名紧耦合，为了消除这种紧耦合的现象，我们使用arguments的callee属性：

function factorial(num){
    if (num <=1){
        return 1;
    }
    else{
        return num * arguments.callee(num-1)
    }
}

                     

         this:

         this引用的是函数据以执行的环境对象，当在网页全局作用域中调用函数时，this对象引用的就是window。

window.color = "red";
var o = { color: "blue" };
function sayColor(){
    alert(this.color);
}
sayColor(); //"red"
o.sayColor = sayColor;
o.sayColor(); //"blue"

8、基本包装类型：js中的数据类型包括两大类，基本类型（string、number、null、undefined、boolean），引用类型（object，function）。不可对基本类型设置属性，设置后再引用查看也无法访问。

var s1 = "some text";
s1.color = "red";
alert(s1.color); //undefined

  注意：使用 new 调用基本包装类型的构造函数，与直接调用同名的转型函数是不一样的。

var value = "25";
var number = Number(value); //转型函数
alert(typeof number); //"number"
var obj = new Number(value); //构造函数
alert(typeof obj); //"object"

  9、toFixed()方法：控制保留几位小数，四舍五入。

var num = 10.005;
alert(num.toFixed(2)); //"10.01"

10、String类型：

      （1）字符方法：用于访问字符串中特定字符的方法：charAt()和charCodeAt()。这两个方法都接收一个参数，即基于0的字符的位置。

       charAt()返回查询位置所在的字符，charCodeAt()返回查询位置所在字符对应的ASCII码。

var stringValue = "hello world";
alert(stringValue.charAt(1)); //"e"

var stringValue = "hello world";
alert(stringValue.charCodeAt(1)); // 输出"101"

     （2）字符串操作方法：

       concat() :用于将一个或多个字符串拼接起来，返回拼接得到的新字符串。

var stringValue = "hello ";
var result = stringValue.concat("world");
alert(result); //"hello world"
alert(stringValue); //"hello"

      slice()、substr()、substring()：这三个方法都会返回被操作字符的的一个子字符串，而且也都接受一或两个参数。第一个参数为指定子字符串的开始位置，第二个参数表示字符串到哪里结束。具体来说， slice() 和substring() 的第二个参数指定的是子字符串最后一个字符后面的位置。而 substr() 的第二个参数指定的则是返回的字符个数。如果没有给这些方法传递第二个参数，则将字符串的长度作为结束位置。以上三种方法不会改变原始数组。

var stringValue = "hello world";
alert(stringValue.slice(3)); //"lo world"
alert(stringValue.substring(3)); //"lo world"
alert(stringValue.substr(3)); //"lo world"
alert(stringValue.slice(3, 7)); //"lo w"
alert(stringValue.substring(3,7)); //"lo w"
alert(stringValue.substr(3, 7)); //"lo worl"

       字符串位置方法：同数组中的indexOf和lastIndexOf。找到字符串所在位置时，则返回其下标，未找到时，则返回-1。第一个参数是要搜索的字符，第二个参数是规定从指定位置向后搜索。

（3）trim()方法：

        去掉字符串的前置和后缀的所有空格，返回一个新的字符串。

var stringValue = " hello world ";
var trimmedStringValue = stringValue.trim();
alert(stringValue); //" hello world "
alert(trimmedStringValue); //"hello world"

（4）match()、search()、replace()：

          match()：寻找字符串中的匹配字符。

var text = "cat, bat, sat, fat";
var pattern = /.at/;
//与 pattern.exec(text)相同
var matches = text.match(pattern);
alert(matches.index); //0
alert(matches[0]); //"cat"
alert(pattern.lastIndex); //0
//其中matches是一个数组，0位为第一个匹配的字符，1位是index返回匹配字符的首位置，2位为input返回整个操作的字符串

         search()：用法同match()。返回项不同，如果搜索到，则返回匹配字符的首位置，如果没有搜索到，则返回-1。

         replace()：接受两个参数，要替换的字符，替换成的字符。

var text = "cat, bat, sat, fat";
var result = text.replace("at", "ond");
alert(result); //"cond, bat, sat, fat"
result = text.replace(/at/g, "ond");
alert(result); //"cond, bond, sond, fond"

（5）eval()方法：

         eval()方法就像是一个强大的ECMAScript解析器，它只接受一个参数，即要执行的ECMAScript字符串。它会将传入的参数当做语句来解析执行，然后把执行结果插入到原位置，通过eval执行的代码可以引用在包含环境中定义的变量。

          

var msg = "hello world";
eval("alert(msg)"); //"hello world"

我们也可以在 eval()调用中定义一个函数，然后再在该调用的外部代码中引用这个函数： 

eval("function sayHi() { alert('hi'); }");
sayHi();