javaScript高级程序设计----笔记前五章

第一章:javaScript简介

javaScript的三个组成部分

 

  1. 核心(ECMAScript)提供核心语言功能
  2. 文档对象模型(DOM)提交访问和操作网页内容的方法和接口
  3. 浏览器对象模型(BOM)提供与浏览器交互的功能和方法

ECMA-262规定这个语言的几个组成部分

  1. 语法
  2. 类型
  3. 语句
  4. 关键字
  5. 保留字
  6. 操作符
  7. 对象

第二章:在HTML中使用javaScript

<script>元素

六个元素:

  1. async:可选。表示应该立即下载脚本,但不应妨碍页面中的其他操作,比如下载其他资源或 等待加载其他脚本。只对外部脚本文件有效。即async是下载完脚本就执行,渲染引擎会中断渲染,执行完这个脚本后,再继续渲染。 
  2. charset:可选。表示通过 src 属性指定的代码的字符集。由于大多数浏览器会忽略它的值, 因此这个属性很少有人用。
  3. defer:可选。表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有 效。IE7 及更早版本对嵌入脚本也支持这个属性。即defer要等到整个页面在内存中正常渲染结束(Dom结构完全生成,以及其他脚本执行完成),才会执行。
  4. language:已废弃。原来用于表示编写代码使用的脚本语言(如 JavaScript、JavaScript1.2或 VBScript)。大多数浏览器会忽略这个属性,因此也没有必要再用了。
  5. src:可选。表示包含要执行代码的外部文件。
  6. type:可选。可以看成是 language 的替代属性;表示编写代码使用的脚本语言的内容类型(也称为 MIME 类型)。虽然 text/javascript 和 text/ecmascript 都已经不被推荐使用,但人 们一直以来使用的都还是 text/javascript。实际上,服务器在传送 JavaScript 文件时使用的MIME 类型通常是 application/x–javascript,但在 type 中设置这个值却可能导致脚本被 忽略。另外,在非 IE 浏览器中还可以使用以下值:application/javascript 和 application/ecmascript。考虑到约定俗成和最大限度的浏览器兼容性,目前 type 属性的值依旧还是text/javascript。不过,这个属性并不是必需的,如果没有指定这个属性,则其默认值仍为text/javascript。

两种使用方法:

  1. 直接在页面中嵌入 JavaScript 代码,只须为<script>指定 type 属性
  2. 包含外部 JavaScript文件,必须设置src属性

第三章:基本概念

语法

区分大小写:

ECMAScript 中的一切(变量、函数名和操作符)都区分大小写。这也就 意味着,变量名 test 和变量名 Test 分别表示两个不同的变量

标识符:

标识符指变量、函数、属性的名字或者函数的参数

标识符组成规则

  • 第一个字符必须是一个字母、下划线(_)或一个美元符号($)
  • 其他字符可以是字母、下划线、美元符号或数字

一般命名都以驼峰式命名,即第一个字母小写,剩下的每一个单词首字母大写,例子:myCar,firstCome

严格模式:

  1. 要在整个脚本中启用严格模式,可以在顶部添加如下代码:
    "use strict";
    
  2. 在函数内部的上方包含这条编译指示,也可以指定函数在严格模式下执行:
    function doSomething(){
        "use strict";
        //函数体
    }

     

数据类型

6种基本数据类型1种复杂数据类型:

  1. Undefined
  2. Null
  3. Boolean
  4. Number
  5. String
  6. Object

typeof操作符:

typeof主要用于检测给定变量的数据类型

var message = "some string";

alert(typeof message);// "string" 

alert(typeof(message));// "string" 

alert(typeof 95);// "number"

 

Number方法

isNaN()方法:

这个函数接受一个参数,该参数可以 是任何类型,而函数会帮我们确定这个参数是否“不是数值”

alert(isNaN(NaN));//true
alert(isNaN(10));//false(10 是一个数值)
alert(isNaN("10"));//false(可以被转换成数值 10)
alert(isNaN("blue")); //true(不能转换成数值)
alert(isNaN(true)); //false(可以被转换成数值 1)

Number()方法(转换字符串时比较复杂而且不够合理基本不用):

转型函数 Number()可以用于任何数据类型

var num1= Number("Hello world!"); //NaN 
var num2= Number(""); //0
var num3= Number("000011"); //11 
var num4= Number(true); //1

parseInt()方法:第一个参数:需要转化的内容。第二个参数:转换时使用的基数(即多少进制)

var num1 = parseInt("10", 2);//2 (按二进制解析)
var num2 = parseInt("10", 8); //8 (按八进制解析)
var num3 = parseInt("10", 10);//10(按十进制解析)
var num4 = parseInt("10", 16); //16(按十六进制解析)
 

parseFloat()方法:

  • 只解析十进制值
  • 字符串中的第 一个小数点是有效的,而第二个小数点就是无效的了
  • 始终都会忽略前导的零
  • 十六进制格式的字符串则始终会被转换成 0
var num1 = parseFloat("1234blue");//1234 (整数)
var num2 = parseFloat("0xA"); //0
var num3 = parseFloat("22.5");//22.5
var num4 = parseFloat("22.34.5"); //22.34
var num5 = parseFloat("0908.5");//908.5 
var num6 = parseFloat("3.125e7");//31250000

String方法

toString()方法:

数值、布尔值、对象和字符串值(没错,每个字符串也都有一个 toString()方法,该方法返回字 符串的一个副本)都有 toString()方法。但 null 和 undefined 值没有这个方法。

var age = 11;
var ageAsString = age.toString(); // 字符串"11"
var found = true;
var foundAsString = found.toString(); // 字符串"true"

String()方法:

转换规则:

  • 如果值有 toString()方法,则调用该方法(没有参数)并返回相应的结果
  • 如果值是 null,则返回"null"
  • s如果值是 undefined,则返回"undefined"
var value1 = 10;
var value2 = true;
var value3 = null;
var value4;
alert(String(value1));// "10"
alert(String(value2));// "true"
alert(String(value3));// "null"
alert(String(value4));// "undefined"

Object方法:

函数:

ECMAScript 中的参数在内部是用一个数组来表示的。函数接收 到的始终都是这个数组,而不关心数组中包含哪些参数

即便你定义的函数只接收两个参数, 在调用这个函数时也未必一定要传递两个参数。可以传递一个、三个甚至不传递参数,而解析器永远不 会有什么怨言。

function howManyArgs() {
    alert(arguments.length);
}
howManyArgs("string", 45);  //2
howManyArgs();              //0
howManyArgs(12);            //1

根据以上特性可以实现类似重载功能

function doAdd() {
    if(arguments.length == 1) {
        alert(arguments[0] + 10);
    } else if (arguments.length == 2) {
        alert(arguments[0] + arguments[1]);
    }
doAdd(10);         //20
doAdd(30, 20);     //50

没有重载:

如果在 ECMAScript 中定义了两个名字相同的函数,则该名字只属于后定义的函数

function addSomeNumber(num){
    return num + 100;
}
function addSomeNumber(num) {
    return num + 200;
}
var result = addSomeNumber(100);//300

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

基本类型和引用类型的值

动态的属性:

引用类型的值,我们可以为其添加属 性和方法,也可以改变和删除其属性和方法。但是,我们不能给基本类型的值添加属性,尽管这样做不会导致任何错误。

var person = new Object();
person.name = "Nicholas"; //为引用类型的值赋值
alert(person.name); //"Nicholas"



var name = "Nicholas";
name.age = 27;    //为基本类型的值赋值
alert(name.age);      //undefined

复制变量值:

从一个变量向另一个变量复制基本类型值和引用类型值时。

基本类型值----会创建一个新值,然后把值复制为新变量分配的地址上

应用类型值----也会复制值,不同的是复制的是指针,这个指针指向存储在堆中的一个对象

var obj1 = new Object();
var obj2 = obj1;
obj1.name = "Nicholas";
alert(obj2.name);  //"Nicholas"

检测类型:

instanceof()方法

语法---result = variable instanceof constructor

alert(person instanceof Object); // 变量 person 是 Object 吗? 
alert(colors instanceof Array); // 变量 colors 是 Array 吗? 
alert(patterninstanceof RegExp); //变量pattern是RegExp吗?

执行环境和作用域

每个函数都有自己的执行环境。当执行流进入一个函数时,函数的环境就会被推入一个环境栈中。 而在函数执行之后,栈将其环境弹出,把控制权返回给之前的执行环境。ECMAScript 程序中的执行流 正是由这个方便的机制控制着。

var color = "blue";
    function changeColor(){
        var anotherColor = "red";
        function swapColors(){
            var tempColor = anotherColor;
            anotherColor = color;
            color = tempColor;
            // 这里可以访问color、anotherColor和tempColor 
        }
        // 这里可以访问color和anotherColor,但不能访问tempColor
        swapColors();
    }
// 这里只能访问color 
changeColor();

没有块级作用域:

for (var i=0; i < 10; i++){
    doSomething(i);
}
alert(i);      //10

对于有块级作用域的语言来说,for 语句初始化变量的表达式所定义的变量,只会存在于循环的环 境之中。而对于 JavaScript 来说,由 for 语句创建的变量 i 即使在 for 循环执行结束后,也依旧会存在 于循环外部的执行环境中。

垃圾收集

标记清除:垃圾收集器在运行的时候会给存储在内存中的所有变量都加上标记(当然,可以使用任何标记方 式)。然后,它会去掉环境中的变量以及被环境中的变量引用的变量的标记。而在此之后那些被加上标记的变量将被视为准备删除的变量,原因是环境中的变量已经无法访问到这些变量了。

引用计数:当声明了一个变量并将一个引用类型值赋给该变量时,则这个值的引用次数就是 1。 如果同一个值又被赋给另一个变量,则该值的引用次数加 1。相反,如果包含对这个值引用的变量又取 得了另外一个值,则这个值的引用次数减 1。当这个值的引用次数变成 0 时,则说明没有办法再访问这 个值了,因而就可以将其占用的内存空间回收回来。

存在的缺陷:循环引用

function problem(){
    var objectA = new Object();
    var objectB = new Object();
    objectA.someOtherObject = objectB; 
    objectB.anotherObject = objectA;
}

在这个例子中,objectA 和 objectB 通过各自的属性相互引用;也就是说,这两个对象的引用次 数都是 2。在采用标记清除策略的实现中,由于函数执行之后,这两个对象都离开了作用域,因此这种 相互引用不是个问题。但在采用引用计数策略的实现中,当函数执行完毕后,objectA 和 objectB 还 将继续存在,因为它们的引用次数永远不会是 0。假如这个函数被重复多次调用,就会导致大量内存得 不到回收。

内存管理:使用具备垃圾收集机制的语言编写程序,开发人员一般不必操心内存管理的问题。但是,JavaScript在进行内存管理及垃圾收集时面临的问题还是有点与众不同。其中最主要的一个问题,就是分配给 Web浏览器的可用内存数量通常要比分配给桌面应用程序的少。

因此,确保占用最少的内存可以让页面获得更好的性能。而优化内存占用的最佳方式,就是为执行 3中的代码只保存必要的数据。一旦数据不再有用,最好通过将其值设置为 null 来释放其引用——这个 做法叫做解除引用(dereferencing)。这一做法适用于大多数全局变量和全局对象的属性。局部变量会在 它们离开执行环境时自动被解除引用

第五章:引用类型

  1. Object类型
  2. Array类型
  3. Date类型
  4. RegExp类型
  5. Function类型
  6. 基本包装类型
    1. Boolean类型
    2. Number类型
    3. String类型
  7. 单体内置对象
    1. Global对象
    2. Math对象

Object类型

虽然 Object 的实例不具备多少功能,但对于在应用程序中存储 11和传输数据而言,它们确实是非常理想的选择。

两种Object创建方法:

第一种是使用 new 操作符后跟 Object 构造函数

var person = new Object();
person.name = "Nicholas";
person.age = 29;

另一种方式是使用对象字面量表示法

var person = {
    name : "Nicholas",
    age : 29
};

两种对象属性访问方法:

第一种:访问对象属性时使用的都是点表示法(主要)

第二种:方括号表示法来访问对象的属性(特殊情况使用,如:包含会导致语法错误的字符,或者属性名使用的是关键字或保留字)

alert(person["name"]); //"Nicholas" 
alert(person.name); //"Nicholas"

Array类型

ECMAScript 数组的每一项可以保存任何类型的数据。也 就是说,可以用数组的第一个位置来保存字符串,用第二位置来保存数值,用第三个位置来保存对象, 以此类推。而且,ECMAScript 数组的大小是可以动态调整的,即可以随着数据的添加自动增长以容 纳新增数据。

两种Array类型创建方法:

第一种是使用 Array 构造函数

var colors = new Array();
var colors = new Array(20);//创建一个数组长度为20的数组
var colors = new Array("red", "blue", "green");//创建包含3个字符串值的数组

//在使用 Array 构造函数时也可以省略 new 操作符

var colors = Array(3); // 创建一个包含 3 项的数组
var names = Array("Greg"); // 创建一个包含 1 项,即字符串"Greg"的数组

第二种基本方式是使用数组字面量表示法,由一对包含数组项的方括号表示,多个数组项之间以逗号隔开

var colors = ["red", "blue", "green"]; // 创建一个包含 3 个字符串的数组
var names = [];// 创建一个空数组
var values = [1,2,];// 不要这样!这样会创建一个包含 2 或 3 项的数组
var options = [,,,,,]; // 不要这样!这样会创建一个包含 5 或 6 项的数组

检测数组:

自从 ECMAScript 3 做出规定以后,就出现了确定某个对象是不是数组的经典问题。对于一个网页,

或者一个全局作用域而言,使用 instanceof 操作符就能得到满意的结果:

if (value instanceof Array){ 
    //对数组执行某些操作
}

instanceof 操作符的问题在于,它假定只有一个全局执行环境。如果网页中包含多个框架,那实 际上就存在两个以上不同的全局执行环境,从而存在两个以上不同版本的 Array 构造函数。如果你从一个框架向另一个框架传入一个数组,那么传入的数组与在第二个框架中原生创建的数组分别具有各自不同的构造函数。

为解决上述问题ECMAScript 5 新增了 Array.isArray()方法

这个方法的目的是最终确定某 个值到底是不是数组,而不管它是在哪个全局执行环境中创建的

if (Array.isArray(value)){ 
    //对数组执行某些操作
}

转换方法:

toString()方法会返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串。

valueOf()返回的还是数组

var colors = ["red", "blue", "green"]; // 创建一个包含 3 个字符串的数组
alert(colors.toString());// red,blue,green
alert(colors.valueOf());// red,blue,green
alert(colors);// red,blue,green

栈方法:push()pop()

push()方法可以接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度

pop()方法则从数组末尾移除最后一项,减少数组的 length 值,然后返回移除的项

var colors = new Array();// 创建一个数组 
var count = colors.push("red", "green"); // 推入两项
alert(count); //2
count = colors.push("black");// 推入另一项 
alert(count);     //3
var item = colors.pop();// 取得最后一项
alert(item);      //"black"
alert(colors.length);   //2

队列方法:shift()unshift()

shift(),它能够移除数组中的第一个项并返回该项,同时将数组长度减 1

//头部取数据,尾部加数据

var colors = new Array();//创建一个数组
var count = colors.push("red", "green"); //推入两项
alert(count); //2
count = colors.push("black");//推入另一项
alert(count);     //3
var item = colors.shift();//取得第一项
alert(item); //"red" 
alert(colors.length); //2

unshift(),它能在数组前端添加任意个项并返回新数组的长度

//头部加数据,尾部取数据

var colors = new Array(); //创建一个数组 
var count = colors.unshift("red", "green"); //推入两项 
alert(count); //2
count = colors.unshift("black");//推入另一项
alert(count);   //3
var item = colors.pop();//取出最后一项
alert(item);    //"green"
alert(colors.length); //2

重排序方法:reverse()sort()

reverse()方法会反转数组项的顺序

var values = [1, 2, 3, 4, 5]; 
values.reverse();
alert(values); //5,4,3,2,1

sort()方法默认情况:按升序排列数组项——即最小的值位于最前面,最大的值排在最后面。为了实现排序,sort()方法会调用每个数组项的 toString()转型方法,然后比较得到的字符串。

var values = [0, 1, 5, 10, 15];
values.sort();
alert(values);     //0,1,10,15,5

存在的缺陷:通过例子发现5排在10,15后面,因为数值 5 虽然小于 10,但在进行字符串比较时,"10"则位于"5"的前面。这种排序不符合我们的认识观念。

因此sort()方法可以接收一个比较函数作为参数,以便我们指定哪个值位于哪个值的前面。

果第一个参数应该位于第二个之前则返回一个负数,如果两个参数相等 则返回 0,如果第一个参数应该位于第二个之后则返回一个正数。

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); //0,1,5,10,15

注意:reverse()和 sort()方法的返回值是经过排序之后的数组。

操作方法:concat()slice()splice()

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

注意:该方法不改变原数组

slice()方法可以接受一或两个参数,即要返回项的起始和结束位置。在只有一个参数的情况下,slice()方法返回从该 参数指定位置开始到当前数组末尾的所有项。如果有两个参数,该方法返回起始和结束位置之间的项— —但不包括结束位置的项

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

注意:该方法不改变原数组

splice()方法可以接受一或两个参数或三个参数

  • 删除:可以删除任意数量的项,只需指定 2 个参数:要删除的第一项的位置和要删除的项数。 例如,splice(0,2)会删除数组中的前两项。
  • 插入:可以向指定位置插入任意数量的项,只需提供 3 个参数:起始位置、0(要删除的项数) 和要插入的项。如果要插入多个项,可以再传入第四、第五,以至任意多个项。例如,splice(2,0,"red","green")会从当前数组的位置 2 开始插入字符串"red"和"green"。
  • 替换:可以向指定位置插入任意数量的项,且同时删除任意数量的项,只需指定 3 个参数:起 始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。例如,splice (2,1,"red","green")会删除当前数组位置 2 的项,然后再从位置 2 开始插入字符串"red"和"green"。

注意:splice()方法始终都会返回一个数组,该数组中包含从原始数组中删除的项(如果没有删除任何 项,则返回一个空数组)

var colors = ["red", "green", "blue"];
var removed = colors.splice(0,1); // 删除第一项
alert(colors); // green,blue 
alert(removed); // red,返回的数组中只包含一项
removed = colors.splice(1, 0, "yellow", "orange"); // 从位置 1 开始插入两项
alert(colors); // green,yellow,orange,blue 
alert(removed); // 返回的是一个空数组
removed = colors.splice(1, 1, "red", "purple"); // 插入两项,删除一项
alert(colors); // green,red,purple,orange,blue 
alert(removed); // yellow,返回的数组中只包含一项

位置方法:indexOf()lastIndexOf()

这两个方法都接收 两个参数:要查找的项和(可选的)表示查找起点位置的索引。

indexOf()方法从数组的开头(位 置 0)开始向后查找

astIndexOf()方法则从数组的末尾开始向前查找

这两个方法都返回要查找的项在数组中的位置,或者在没找到的情况下返回-1

迭代方法:every()filter()forEach()map()some()

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

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

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

var someResult = numbers.some(function(item, index, array){
    return (item > 2);
});
alert(someResult); //true

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

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

numbers.forEach(function(item, index, array){
    //执行某些操作
});

归并方法: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

Date类型

RegExp类型

匹配标志:

  • g:表示全局(global)模式,即模式将被应用于所有字符串,而非在发现第一个匹配项时立即停止
  • i:表示不区分大小写(case-insensitive)模式,即在确定匹配项时忽略模式与字符串的大小写
  • m:表示多行(multiline)模式,即在到达一行文本末尾时还会继续查找下一行中是否存在与模式匹配的项
/*
 * 匹配字符串中所有"at"的实例 
 */
var pattern1 = /at/g;
/*
 * 匹配第一个"bat"或"cat",不区分大小写 
 */
var pattern2 = /[bc]at/i;
/*
 * 匹配所有以"at"结尾的 3 个字符的组合,不区分大小写
 */
var pattern3 = /.at/gi;

与其他语言中的正则表达式类似,模式中使用的所有元字符都必须转义。正则表达式中的元字符包括: 11( [ { \ ^ $ | ) ? * + .]}

实例方法:exec()、test()

exec()接受一个参数,即 要应用模式的字符串,然后返回包含第一个匹配项信息的数组;或者在没有匹配项的情况下返回 null。 返回的数组虽然是 Array 的实例,但包含两个额外的属性:index 和 input。其中,index 表示匹配 项在字符串中的位置,而 input 表示应用正则表达式的字符串。在数组中,第一项是与整个模式匹配 的字符串,其他项是与模式中的捕获组匹配的字符串(如果模式中没有捕获组,则该数组只包含一项)。

test()它接受一个字符串参数。在模式与该参数匹配的情况下返回true;否则,返回 false

var text = "000-00-0000";
var pattern = /\d{3}-\d{2}-\d{4}/;
if (pattern.test(text)){
    alert("The pattern was matched.");
}

Function类型

函数实际上是对象。每个函数都是 Function 类型的实例,而且都与其他引用类型一样具有属性和方法。由于函 数是对象,因此函数名实际上也是一个指向函数对象的指针,不会与某个函数绑定

由于函数名仅仅是指向函数的指针,因此函数名与包含对象指针的其他变量没有什么不同。换句话 说,一个函数可能会有多个名字。

function sum(num1, num2){
    return num1 + num2;
}
alert(sum(10,10));        //20
var anotherSum = sum;
alert(anotherSum(10,10)); //20
sum = null;
alert(anotherSum(10,10)); //20

函数的属性和方法:apply()call()

这两个方法的用途都是在特定的作用域中调用函数,实际上等于设置函数体内 this 对象的值。

apply()方法接收两个参数:一个 是在其中运行函数的作用域,另一个是参数数组。其中,第二个参数可以是 Array 的实例,也可以是arguments 对象。例如:

function sum(num1, num2){
    return num1 + num2;
}
function callSum1(num1, num2){
    return sum.apply(this, arguments);// 传入 arguments 对象
}
function callSum2(num1, num2){
    return sum.apply(this, [num1, num2]);// 传入数组
}
alert(callSum1(10,10));   //20
alert(callSum2(10,10));   //20

call()方法,第一个参数是 this 值没有变化,变化的是其余参数都直接传递给函数。换句话说,在使用call()方法时,传递给函数的参数必须逐个列举出来

function sum(num1, num2){
    return num1 + num2;
}
function callSum(num1, num2){
    return sum.call(this, num1, num2);
}
alert(callSum(10,10));   //20

事实上,传递参数并非 apply()和 call()真正的用武之地;它们真正强大的地方是能够扩充函数赖以运行的作用域。

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

bind()方法,会创建一个函数的实例,其 this 值会被绑 定到传给 bind()函数的值

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

基本包装类型

Number类型:toFixed()toExponential()toPrecision()

toFixed()方法会按照指定的小数位返回数值的字符串表示

var num = 10;
alert(num.toFixed(2));     //"10.00"

toExponential(),该方法返回以指数表示法(也称 e 表示法)

var num = 10;
alert(num.toExponential(1)); //"1.0e+1"

toPrecision()方法可能会返回固定大小(fixed)格式,也可能返回指数 (exponential)格式;具体规则是看哪种格式最合适

var num = 99;
alert(num.toPrecision(1)); //"1e+2" 
alert(num.toPrecision(2)); //"99" 
alert(num.toPrecision(3)); //"99.0"

String类型:charAt()charCodeAt()

charAt()和 charCodeAt()。这两个方法都接收一个 参数,即基于 0 的字符位置。

charAt()方法以单字符字符串的形式返回给定位置的那个字符

charCodeAt()返回字符编码

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

ECMAScript 还提供了三个基于子字符串创建新字符串的方法:slice()substr()和 substring()

这三个方法都会返回被操作字符串的一个子字符串,而且也都接受一或两个参数。第一个参数指定子字 符串的开始位置,第二个参数(在指定的情况下)表示子字符串到哪里结束

slice()的第二个参数指定的是子字符串最后一个字符后面的位置。当是负值时将传 入的负值与字符串的长度相加

substring()的第二个参数指定的是子字符串最后一个字符后面的位置。当是负值时将会把所有负值参数都转换为 0

substr()的第二个参数指定的则是返回的字符个数。当是负值时负的第一个参数加上字符串的长度,而将负的第二个 参数转换为 0

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"

//传入是负值时
alert(stringValue.slice(-3));//"rld" 
alert(stringValue.substring(-3));//"hello world" 
alert(stringValue.substr(-3));//"rld"
alert(stringValue.slice(3, -4));//"lo w"
alert(stringValue.substring(3, -4)); //"hel"
alert(stringValue.substr(3, -4));//""(空字符串)

 

trim()方法

ECMAScript 5 为所有字符串定义了 trim()方法。这个方法会创建一个字符串的副本,删除前置及 后缀的所有空格,然后返回结果

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

字符串大小写转换方法:

ECMAScript 中涉及字符串大小写转换的方 法有 4 个:toLowerCase()toLocaleLowerCase()toUpperCase()和 toLocaleUpperCase()

toLocaleLowerCase() toLocaleUpperCase()方法则是针对特定地区的实现

var stringValue = "hello world";
alert(stringValue.toLocaleUpperCase());  //"HELLO WORLD"
alert(stringValue.toUpperCase());        //"HELLO WORLD"
alert(stringValue.toLocaleLowerCase());  //"hello world"
alert(stringValue.toLowerCase());        //"hello world"

字符串的模式匹配方法:match()search()replace()

match()方法本质上与调用regExp的exec()方法相同。只接受一个参数,要么是一 个正则表达式,要么是一个 RegExp 对象

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

search()方法只接受一个参数,要么是一 个正则表达式,要么是一个 RegExp 对象返回字符串中第一个匹配项的索引;如果没 有找到匹配项,则返回-1

var text = "cat, bat, sat, fat";
var pos = text.search(/at/);
alert(pos);   //1

replace()这个方法接受两个参数:第 一个参数可以是一个 RegExp 对象或者一个字符串(这个字符串不会被转换成正则表达式),第二个参 数可以是一个字符串或者一个函数。如果第一个参数是字符串,那么只会替换第一个子字符串。要想替 换所有子字符串,唯一的办法就是提供一个正则表达式,而且要指定全局(g)标志

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"

localeCompare()方法:

  • 如果字符串在字母表中应该排在字符串参数之前,则返回一个负数(大多数情况下是-1,具体 的值要视实现而定)
  • 如果字符串等于字符串参数,则返回 0
  •  如果字符串在字母表中应该排在字符串参数之后,则返回一个正数(大多数情况下是 1,具体的值同样要视实现而定)。
var stringValue = "yellow"; 
alert(stringValue.localeCompare("brick")); //1 
alert(stringValue.localeCompare("yellow")); //0 
alert(stringValue.localeCompare("zoo")); //-1

fromCharCode()方法:

fromCharCode()。这个方法的任务是接收一或 多个字符编码,然后将它们转换成一个字符串。从本质上来看,这个方法与实例方法 charCodeAt()执行的是相反的操作

alert(String.fromCharCode(104, 101, 108, 108, 111)); //"hello"

单体内置对象

URI编码:encodeURI()encodeURIComponent()decodeURI()decodeURIComponent()

encodeURI()方法编码后的结果是除了空格之外的其他字符都原封不动,只有空格被替换成了%20

encodeURIComponent()方法则会使用对应的编码替换所有非字母数字字符

Math对象:https://www.cnblogs.com/neuscx/p/5067241.html

 

 

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值