图片 15

在JavaScript函数式编程里使用Map和Reduce方法

本文由码农网 –
唐李川原创翻译,转载请看清文末的转载要求,欢迎参与我们的付费投稿计划!

JavaScript之数组(Array)详解

 ECMAScript的数组与其他语言中的数组有着相当大的区别。虽然ECMAScript中的数组也是有序列表,但是它数组你的每一项可以保存任何类型的数据。ECMAScript数组的大小是可以动态调整的。

创建数组的基本方式有两种。第一种是使用Array构造函数,如下所示:

复制代码 代码如下:

var colors = new Array();

如果知道数组要保存的项目数量,也可以给构造函数传递参数,而该参数会自动变成length属性的值,如下:

复制代码 代码如下:

var colors = new Array(20);

也可以向Array构造函数中传递数组中应包含的项,如下代码所示:

复制代码 代码如下:

var colors = new Array(“red”,”blue”);

另外,使用Array构造函数时也可以省略new操作符,如下所示:

复制代码 代码如下:

var colors = Array(20);

创建数组的第二种方式是使用数组字面量表示法。数组字面量由一对包含数组项的方括号表示,多个数组项之间用逗号隔开,如下所示:

复制代码 代码如下:

var color = [“red”,”blue”];
var names = [];
var values = [1,2,]//IE8及之前3项,其他2项,不建议使用

与对象一样,在使用数字字面量表示法时,也不会调用Array的构造函数。
在读取和设置数组的值时,要使用方括号并提供相应值的基于0的数字索引,如下所示:

复制代码 代码如下:

var colors = [“red”,”blue”]; //定义数组
alert(colors[0]); //red
colors[1] = “black” //修改第2项
colors[2] = “brown” //新增第3

数组的项数保存在其length属性中,这个属性始终会返回0或更大的数字,如下所示:

复制代码 代码如下:

var colors = [“red”,”blue”]; //定义数组
var names=[];
alert(colors.length); //3
alert(names.length) //0

值得注意的是,数组的length值不是只读的。因此,通过设置此值,可以从数组的末尾移出项或向数组添加项,如下:

复制代码 代码如下:

var colors = [“red”,”blue”];
colors.length = 1;
alert(colors[1]); //undefined

利用length属性也可以方便的向数组末尾添加数据:

复制代码 代码如下:

var colors = [“red”,”blue”];
colors[colors.length] = “black”; //在位置2新增
colors[colors.length] = “brown”; //在位置3新增

 

1、检测数组

对于一个网页或一个全局作用域而言,使用instanceof操作符可以做到:

复制代码 代码如下:

if(value instanceof Array){
// 执行操作
}

instanceof操作符局限性在于全局作用域,如果网页包含多个框架,就存在两个以上的全局执行环境。为了解决这个问题,ECMAScript5新增了Array.isArray()方法,使用如下:

复制代码 代码如下:

if(Array.isArray(value)){
// 执行操作
}

 

2、转化方法
调用数组的toString()方法会返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串。而调用valueOf()返回还是数组。如下所示:

复制代码 代码如下:

var colors = [‘red’, ‘blue’, ‘green’];
alert(colors.toString()); //red,blue,green
alert(colors.valueOf()); //red,blue,green
alert(colors) //red,blue,green

数组继承的toLocalString()、tiString()和valueOf()方法,在默认情况下都会以逗号分隔符的字符串形式返回数组项。而如果使用join()方法,则可以使用不同的分隔符来构建这个字符串。join()方法只接受一个参数,即用作分隔符的字符串,如下所示:

复制代码 代码如下:

var colors = [‘red’, ‘blue’, ‘green’];
alert(colors.join(‘,’)); //red,blue,green
alert(colors.join(‘|’)); //red|blue|green

如果数组中的某一项值为null或者undefied,那么该值在join()、toLocalString()、tiString()和valueOf()方法返回结果以空字符串表示。

 

3、栈方法

Javascript专门为数组提供了push()和pop()操作,以便实现类似栈的行为。

push()方法可以接收任意数量的参数,把他们逐个添加到数组末尾,并返回修改后数组的长度。pop()方法则从数组末尾溢出最后一项,减少数组的length值,然后返回移出的项。

 

复制代码 代码如下:

var colors = new Array(); //定义数组
var count = colors.push(“red”, “blue”); //压入两项
alert(count); //2
count = colors.push(“black”); //压入另一项
alert(count); //3
var item = colors.pop(); //弹出最后一项
alert(item); //”black”
alert(colors.length); //2

 

4、队列方法

栈数据结构的访问规则是LIFO(后进先出),而队列的访问规则是FIFO(先进先出)。队列在列表末端添加项,在前端移出项。

shift()方法能够移除数组中的第一项,并返回该项,数组的length-1。结合push()和shift()方法,可以像使用队列一样使用数组,如下所示:

复制代码 代码如下:

var colors = new Array();
var count = colors.push(“red”, “blue”);
count = colors.push(“black”);
alert(count);
var item = colors.shift(); //取得第一项
alert(item); //”red”
alert(color.length); //2

 

ECMAScript还为数组提供了unshift()方法。unshift()和shift()方法用途相反:它在数组前端添加任意个项并返回新数组的长度。因此,同时使用unshift()和shift()方法,可以从相反方向来模拟队列,即在数组前端添加新项,从数组末端移出项,如下所示:

复制代码 代码如下:

var colors = new Array();
var count = colors.push(“red”, “green”);
alert(count); //2
count = colors.unshift(“black”); //推入另一项
alert(count); //3
var item = colors.pop(); //取得最后一项
alert(item) //green
alert(colors.length) //2

 

5、重排序方法
数组中已经存在两个可以直接用来重排序的方法:reverse()和sort()。reverse()方法会按照反转数组项的排序。

复制代码 代码如下:

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

默认情况下,sort()方法按照升序排列数组项,调用每一项的toString()方法,比较字符串,以确定如何排序。即使数组中的每一项都是数值,sort()方法比较的都是字符串。

复制代码 代码如下:

var values = [12, 11, 3, 4, 5];
values.sort();
alert(values); //12,11,3,4,5

我们可以通过一个比较函数当作参数传递给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); //0,1,5,10,15

 

6、操作方法
ECMAScript为操作在数组中提供了很多方法。其中,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()方法,它能够基于当前数组的一个项或多个项创建新数组,它可以接收一个或两个参数,即要返回项的起始和结束位置。一个参数时,返回该参数指定位置开始到当前数组末尾的所有项。两个参数则返回起始到指定位置的所有项——不包括结束位置的项。注意,slipe()方法不影响原始数组。

复制代码 代码如下:

var colors=[“red”,”green”,”blue”,”black”,”brown”];
var colors2=colors.slice(1);
var colors3=colors.slice(1,4);
alert(colors2); //green,blue,black,brown
alert(colors3); //green,blue,black

slice()方法删除:可以删除任意数量的项,只需指定2个参数:要删除的第一项的位置和要删除的项数。
slice()方法插入:可以向指定位置插入任意数量的项,只需提供3个参数:起始位置、0(要删除的项数)和要插入的项。
slipe()方法替换:可以项指定位置插入任意数量的项,且同时删除任意数量的项,只需指定3个参数:起始位置、要删除的项数和要插入的任意数量的项。

复制代码 代码如下:

var colors = [“red”, “green”, “blue”];
//删除
var removed = colors.slice(0, 1); //删除第1项
var colors3 = colors.slice(1, 4);
alert(colors); //green,blue
alert(removed); //red
//插入
removed = colors.slice(1, 0,”yellow”,”orange”); //从位置1开始插入
alert(colors); //green,yellow,orange,blue
alert(removed); //空数组
//替换
removed = colors.slice(1, 1,”red”,”purple”); //从位置1开始插入
alert(colors); //green,”red”,”purple”,orange,blue
alert(removed); //”yellow”

 

7、位置方法
ECMAScript5为数组提供了两个位置方法:indexOf()和lastIndexOf()。这两个方法都接收两个参数:要查找的项和表示查找起点位置的索引(可选)。其中indexOf()方法从数组的开头开始先后查找,lastIndexOf()方法则从数组的末尾开始向前查找。
这两个方法都返回要查找的项在数组中的位置,在没有找到的情况下返回-1。

复制代码 代码如下:

var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
alert(numbers.indexOf(4)) //3
alert(numbers.lastIndexOf(4)) //5
alert(numbers.indexOf(4, 4)) //5
alert(numbers.lastIndexOf(4, 4)) //3

8、迭代方法

 

ECMAScript5为数组定义了5个迭代方法。每个方法都接受两个参数,第一个是进行迭代的函数,第二个是该函数的作用域对象【可选】。

进行迭代的函数接受三个参数,第一个是数组中要进行迭代的元素的值,第二个是数组候总要进行迭代的元素的位置,第三个是迭代数组本身。

  1. every()
    对数组中的每一项运行给定的函数,如果该函数对每一项都返回true,则返回true
  2. filter()
    对数组中的每一项运行给定的函数,返回该函数返回true的项组成的数组。
  3. forEach() 对数组中的每一项运行给定的函数,这个方法没有返回值 4. map()
    对数组中的每一项运行给定的函数,返回每次函数调用的结果组成的数组
  4. some()
    对数组中的每一项运行给定的函数,如果该函数对任意一项返回true,则返回true
    这些迭代方法支持的浏览器有,IE9+,Firefox2+,Safari3+,Opera
    9.5+,chrome
    在这些方法中,最相似的是every()和some(),它们都是用于查询数组中的项是否满足某个条件。对every()来说,传入的函数必须对每一项都返回true,这个方法才返回true;否则,他就返回false。而some()方法则是只要传入的函数对数组中某一项返回true,就返回true。

 

复制代码 代码如下:

var num = [1,2,3,4,5,6,7,8,9];
var everyResult = num.every(function(item, index, array) {
if(item > 2) {
return true;
}
});
alert(everyResult); //false
var someResult = num.some(function(item) {
if(item > 2) {
return true;
}
});
alert(someResult); //true

 

filter()是利用指定的函数确定是否在返回的数组中包含某一项。

 

复制代码 代码如下:

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

 

map()也返回一个数组,而这个数组的每一项都是在原始数组中的对应项上运行传入函数的结果。

复制代码 代码如下:

var num = [1,2,3,4,5,4,3,2,1];
var mapResult = num.map(function(item) {
if(item > 2) {
return true;
}
}); //[2,3,6,8,10,8,6,4,2]

 

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

复制代码 代码如下:

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

 

9、归并方法

ECMAScript5中新增了两个方法:reduceRight() 和
reduce()。这两个方法都接受两个参数:第一个是用来迭代的数组的函数,这个函数有四个参数分别是,前一个值,当前值,项的索引,数组对象。然而这个函数的任何值都会作为第一个参数自动传给下一项。第二个是作为第一个函数中第一个参数的初始值

复制代码 代码如下:

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

ECMAScript的数组与其他语言中的数组有着相当大的区别。虽然ECMAScript中的数组也是有序列表,但是它数组你的每…

  引用类型的值(对象)是引用类型的一个实例。在ECMAScript中引用类型是一种数据结构,用于组织数据和功能。与Java、C++等面向对象语言区别:JavaScript没有面向对象的类和接口的基本结构。JavaScript通过引用类型弥补类的缺陷。引用类型通过new来创建实例对象。ECMAScript
6 已经引入class。以下内容基于ECMAScript5。

所有人都谈论道workflows支持ECMAScript6里出现的令人吃惊的新特性,因此我们很容易忘掉ECMAScript5带给我们一些很棒的工具方法来支持在JavaScript里进行函数编程,这些工具方法我们现在可以使用了。在这些函数方法里主要的是基于JavaScript
数组对象的map()方法和reduce()方法。

相关文章

相关搜索:

今天看啥

搜索技术库

返回首页

  • iPhone激活是什么
  • 金立E8跑分多少?
  • vivo 小i怎么样
  • 非微信拍摄视频怎么发布到朋友圈?
  • 爱奇艺App怎么开通会员?
  • 新三板是什么意思

相关频道:
HTML/CSS  HTML5  Javascript  jQuery  AJax教程  前端代码  正则表达式  Flex教程  WEB前端教程  

一、Object类型

如果你如今还没有使用map()和reduce()方法,那么现在是时候开始使用了。如今绝大部分的JavaScript开发平台都与生俱来的支持ECMAScript5。使用Map方法和reduce方法可以使你的代码更加简洁和更容易阅读和更容易维护,而且把你带到朝向更简洁的功能开发的路上。

帮客评论

  Object是所有引用类型的基类,都直接或者间接继承Object内置的行为。

性能:一个警告

当然,当现实状况需要保持提高性能时,你的代码的易读性和易维护性不得不在两者之间保持平衡。如今的浏览器使用更笨重的传统技术例如for循环来执行的更有效率。

我写代码的方式通常是把可读性和可维护性放在编写代码的第一位,然后如果我发现在现实情况里代码运行出现了问题,再去为了提高性能而去优化代码。过早的优化代码是很困难的,而且这种优化会导致后面编写代码很困难。

值得考虑的是在JavaScript引擎里使用诸如map()和reduce()这样的方法可以更好地改善代码的性能,而不是指望将来浏览器能为了改善性能而做出优化。除非我在一个性能问题上碰壁,要不然我更喜欢开心地写代码,然而以防我需要它们我却随时准备着为保持代码的性能而做出调整,尽管这样做使我的代码减少了吸引力。

创建Object实例有两种方式:

使用Map方法

映射是一个基本的函数式编程技术,它对一个数组中的所有元素和创建的具有相同长度并有着转换内容的其他数组起作用。

为了使刚才的说法更加具体一点,我想出了一个简单使用示例。例如,想象一下你有一个数组,数组里有字符数据,而且你需要把它们转换进另一个数组,这个数组里包含每一个字符数据的长度。(我知道,那没有复杂到火箭科学那种程度,这是你编写复杂的应用经常不得不去做的事情,但是理解它在一个简单示例例如这个里的工作原理将有助于你使用它,在这种情况下,你可以在你的代码里给它添加真实的数据值)。

你也许知道刚才我描述的在一个数组上使用for循环如何做。它可能看起来像这样:

var animals = ["cat","dog","fish"];
var lengths = [];
var item;
var count;
var loops = animals.length;
for (count = 0; count < loops; count++){
  item = animals[count];
  lengths.push(item.length);
}
console.log(lengths); //[3, 3, 4]

所有我们需要做的事情是定义少量的变量:一个命名为animals的数组包含了我们需要的字符数据,一个命名为lengths的空数组将来用来包含我们操作数组数据输出的长度,和一个叫做item的变量,这个变量用来临时存储每一次循环遍历该数组时我们需要操作的数组项。我们定义了一个for循环,这个for循环有个内部变量和一个循环变量来初始化我们的for循环。然后我们循环迭代每一个项,直到迭代的数组长度等于animals数组的长度。每一次循环我们都计算迭代项的字符长度,然后把它保存到lengths数组里。

注意:需要讨论的是我们可以把上面的代码写得更简洁些,不需要那个item变量,而直接把animals[count]的长度放到lengths数组里,这样就不需要中间的转换过程了。这样做可以帮我们省一点点代码空间,但是它也使得我们的代码有点不易阅读,即使是这个很简单的例子也一样。相同地,为了使代码更有效率而少些直白,我们可能会使用已知的animals数组长度来通过new
Array(animals.length)的方式来初始化我们的lengths数组,然后通过索引而不是使用push方法来插入选项数据长度。这取决于你在现实中准备如何去使用这些代码。

这种实现方式没有任何的技术错误。它在任何标准的JavaScript引擎里都可以用,并且它能很好的完成工作。一旦你知道怎么使用map()方法了,通过这种方法来实现就显得有些笨拙了。

让我展示给你看使用map()方法是如何实现上面的代码的:

var animals = ["cat","dog","fish"];
var lengths = animals.map(function(animal) {
  return animal.length;
});
console.log(lengths); //[3, 3, 4]

在这个小例子里,我们首先再次为我们的animal类型的数组创建一个animals变量。然而,其他我们需要声明的变量就是lengths变量了,然后我们直接分配它的值到映射一个匿名内联函数到animals数组的每一个元素上的结果中。

那个匿名函数执行在每一个animal
上的的操作,然后返回该animal的字符长度。这样做的结果是,lengths变成了具有与原始animals数组有相同长度的数组,并且该数组包含了每一个字符的长度。

这种方式需要注意的一些事情。首先,它比最初编写的代码更简洁。其次,我们仅需要申明更少的变量。更少的变量意味着在全局命名空间里杂音更少,并且如果相同代码的其他部分使用了相同的变量名就会减少碰撞的机会。最后,我们的变量不可能从头到脚都会改变它们的值。随着你深入函数式编程,你将会欣赏使用常量和不变的变量的优雅的能力,现在开始使用并不算早。

这种实现方式的另一个优点是,我们可以通过在整个代码编写过程中通过将代码放进一个个命名的函数里而简化代码而有机会提升自己编写代码的多功能性。匿名的内联函数看着有些乱,并且使得重复使用代码更困难。我们可以定义一个命名为getLength()的函数,并且像下面的方式来使用:

var animals = ["cat","dog","fish"];
function getLength(word) {
  return word.length;
}
console.log(animals.map(getLength)); //[3, 3, 4]

看看上面的代码看上去多简洁啊?只是把你处理数据的部分映射一下就使你的代码达到一个全新的功能水平。

1、通过构造函数创建对象
var obj=new Object();//通过new 构造函数创建对象
var obj = Object; //可以不使用new创建
2、通过字面量创建对象
var obj={
  name:"hello",
  say:function(){do...}
}

什么是函子?

有趣的一点是,通过在数组对象里添加映射,ECMAScript5把基本的数组类型变成了一个完整的函子,这使得函数式编程对我们来说更加的容易。

根据传统的函数编程定义,一个函子需要满足三个条件:

  • 1.它保存着一组值。
  • 2.它实现了一个map函数来操作每一个元素。
  • 3.它的map函数返回一个具有同样大小的函子。

这个将会在你下一次的JavaScript聚会上被翻来覆去的讨论。

如果你想了解更多关于函子的信息,你可以看看Mattias Petter
Johansson录制的关于这方面的视频。

  通过字面量创建对象,代码量少,封装数据,通常可以使用字面量创建。

使用Reduce方法

Reduce()方法在ECMAScript5里也是新增的,而且它和map()方法很类似,除了不产生其他的函子,reduce()方法产生的一个结果是它可能是任何类型。例如,设想一下,如果你想得到我们animals数组里的所有字符长度都分别作为一个数字然后相加的结果。你也许会像下面这样做:

var animals = ["cat","dog","fish"];
var total = 0;
var item;
for (var count = 0, loops = animals.length; count < loops; count++){
  item = animals[count];
  total += item.length;
}
console.log(total); //10

在我们定义我们的初始数组之后,我们为运行总计定义了一个total变量,并把它的初始值设为0。我们也定义一个变量item来保存每一次for循环迭代animals数组的迭代值,并且再定义一个count变量作为一个循环计数器,并且用这两个变量来初始化我们的迭代。然后我们运行for循环来迭代animals数组里的所有字符数据,每次迭代都会把迭代的结果保存到item变量。最终我们把每一次迭代到的item的长度加到我们的total变量里就可以了。

这种实现方式也没有任何的技术错误。我们从定义一个数组开始,然后得到一个结果值就结束了。但是如果我们使用了reduce()方法,我们可以使上面的代码更加简单明了:

var animals = ["cat","dog","fish"];
var total = animals.reduce(function(sum, word) {
  return sum + word.length;
}, 0);
console.log(total);

这里发生变化的是,我们定义了一个名为total的新变量,并且把执行animals数组对象的reduce方法的返回值分配给它,在reduce方法里有两个参数:一个匿名内联function方法,和初始化total的值为0。对于数组中的每一个项reduce()方法都会执行,它在数组的那一项上执行这个function函数,并且把它添加到运行总计,然后再进行下一次迭代。这里我们的内联function方法有两个参数:运行总计,和当前程序正在处理的从数组中获取的字符。这个function函数把当前total的值添加到当前word的长度上。

注意的是:我们设置reduce()方法的第二个参数值为0,这样做确定了total变量包含的是一个数值。如果没有第二个参数reduce方法仍然可以执行,但是执行的结果将不是你期望的那样。(你可以试试并且可以看看当运行总计结束后你是否能推测出JavaScript所使用的编程逻辑。)

那看上去似乎比它需要做的更有一点复杂,因为当调用reduce()方法时需要在一个内联function里综合的定义。我们再那么做一次,但是首先让我们定义一个命名的function函数,而不再使用匿名内联函数:

var animals = ["cat","dog","fish"];
var addLength = function(sum, word) {
  return sum + word.length;
};
var total = animals.reduce(addLength, 0);
console.log(total);

这个代码稍微有点长,但是代码有点长并不总是坏事。这样写你应该看到它使代码更加清晰些,只是在reduce()方法里发生了一点变化。

该程序里reduce()方法有两个参数:一个function函数,用来调用数组里的每一个元素,和一个为total变量设置的运行总计初始值。在这个代码示例中,我们放入了一个名为addLength的新function和为运行总计变量赋初始值为0。在上一行代码中,我们定义了一个名为addLength的function函数,这个函数也需要两个参数:一个当前和一个要处理的字符串。

访问对象属性有两种方式:

结论

经常使用map()方法和reduce()方法将会为你的代码更加简洁,更加多功能,更加可维护性提供了选择。同时它们为你使用更多的JavaScript功能函数技术铺平了道路。

map()方法和reduce()方法仅是被添加进ECMAScript5中新方法中的两个。从使用它们的今天你将会明白代码质量的提高和开发人员满意度的提升胜过任何在性能上的临时影响。在判断map()方法和reduce()方法是否适合你的应用之前,试着用功能函数技术来开发和度量一下它在你现实世界里的影响,然后再判断是否去用。

1、通过.号访问
console.log(obj.name);//访问
2、通过[]号访问
console.log(obj[name]);

  通过[]号访问对象属性,优点在于[name]的name可以是变量,动态获取属性。同时[]可以添加一些不符合变量规则的变量名称。

  Object构造函数,根据传入的参数类型,返回对应的类型。  

1 var obj = new Object("test");
2 console.log(obj instanceof String);
3 VM295:1 true
4 var obj = new Object(25);
5 console.log(obj instanceof Number);
6 VM348:1 true

 

二、Array类型

  ECMAScript的数组与其他语言的数组都是有序的列表,但是ECMASript的数组可以存储任何数据类型(弱类型)。同一数组可以存储不同类型的数据类型,数据的长度是动态增长,以容纳新的数据项。同时数组引用类型,因此它的实例对象可以添加属性。

  创建Array对象有两种方式:  

1、通过构造函数创建
var arr = new Array();
var arr1 =new Array(20);//创建长度为20的数组,请数据项为undefined
var arr2 = new Array("test");//长度为1,第一项的值为test

图片 1

2、通过字面量创建
var arr = [];//创建空数组
var arr1 = [1,2];//创建长度为2的数组
var arr2 = ["test1","test2"];//创建长度为2的数组
var arr3 = [1,2,];//不建议使用,不通浏览器解析的长度不一致

数组长度和访问数组元素:数组索引是基于0起始的正整数。

var  arr = ["test1","test2"];
console.log(arr.length);//长度为2
//数组通过基于0的索引访问
console.log(arr[0]);
arr[3]="test4";
console.log(arr[3]);//输出test4
arr.length=1;//将长度设置为1,此时arr的值为["test1"],通过控制长度可以删除数据项

 图片 2

与Java的数组不一样,JavaScript的数组不会出现越界异常,负数的下标也不会出错(如果对象不存在负数的属性),都返回undefined。
因为数组也是引用类型,可以为它的实例化对象添加属性。当使用arr[key]=value,如果key为正整数,则为数组的索引,如果key为其他则为数组的属性。

图片 3

图片 4 

var arr=new Array();
arr[-1]="test1";
console.log(arr[-1]);//输出test1

图片 5

通过arr[key]key不为正整数,则为arr对象添加属性,arr[“test”]=”test”等价于arr.test=”test”

var arr = new Array();
arr["test"]="test";
console.log(arr["test"]);//输出test

图片 6

数组Array.prototype属性:

图片 7

判读数组:

1、instanceof  在只有一个全局环境下能正确判断Array。

var arr =new Array();
if(arr instanceof Array){

}

2、ECMAScrit5定义了isArray()方法解决instanceof不足。

var arr = new Array();
if(Array.isArray(arr)){
}
Array.isArray(arr);//true

 数组转换:

1、toString方法,此方法返回字符串形式,并且每个数据项以,隔开

var arr = ["test1","test2"];
arr.toString();//输出"test1,test2"

2、valueOf方法,此方法返回数组

var arr = ["test1","test2",10];
arr.valueOf();//输出["test1","test2",10]

3、join方法,默认输出以,为分隔符的字符串

var arr= ["test1,test2,10"];
arr.join();//输出以,号隔开的字符串"test1,test2,10"
arr.join(undefined);//输出以,号隔开的字符串"test1,test2,10"
arr.join("|");//输出以|分割的字符串"test1|test2|10"

 4、数组的栈模式,后入先出。推入push和弹出pop 

var arr= ["test1,test2,10"];
arr.push("test3");//数组末尾追加元素,长度加1
var tmp  = arr.pop();//数组末尾删除元素,并且返回最后一个元素
console.log(tmp);//输出 test3
arr.push("test3",20,30);//追加多个元素

 5、数组的队列模式,先进先出。unshift头部插入和shift头部删除

var arr= ["test1,test2,10"];
arr.unshift("test",20);//数组头部插入两个元素
console.log(arr.toString());//输出"test,20,test1,test2,10"
var tmp = arr.shift();//删除数组头部一个元素,并且返回第一个元素
console.log(tmp);//test

 6、数组排序sort、reverse,默认字符串排序

var arr= [1,2,3,4];
arr.reverse();//[4, 3, 2, 1]输出反序数组
arr.push(11,20);
arr.sort();//[1, 11, 2, 20, 3, 4]并不符合数字输出
//用于排序的回调函数,策略模式
function compara(val1,val2){
    if(val1>val2){
        return -1;  
    }else if(val1<val2){
        return 1;  
    }else{
        return 0;
    }
}
arr.sort(compara);
console.log(arr);//输出[20, 11, 4, 3, 2, 1]反序
console.log(arr.reverse());[1, 2, 3, 4, 11, 20]

7、数组操作:concat与slice,这两个方法均不会对原数组进行改变。

  concat方法会基于当前的数组创建一个新的数组。执行步骤为:首先创建一个数组的副本,然后根据传入的参数,在数组末尾追加,最后返回数组副本。参数可以传递普通的字符串和数组。

var arr=[1,2,3,4];
arr.concat();//未传入参数,只是拷贝副本
[1, 2, 3, 4]
arr.concat(5,6);//追加两个元素
[1, 2, 3, 4, 5, 6]
arr.concat(7,[8,9]);//追加一个元素和数组
[1, 2, 3, 4, 7, 8, 9]
arr;//原数组的不变
[1, 2, 3, 4]

图片 8

  slice基于当前数组的一或多项元素创建新的数组。slice可以接受1或2个元素,如果只有一个参数的情况返回以参数为起始位置至数组末尾的新数组,如果2个参数,则返回以第一个参数为起始索引第二个参数为结束(end>arr.length?arr.length:end)的新数组。如果参数为负数,通过arr.length+(-val)来确定位置,此方法可以作为拷贝数组使用,slice()与slice(0)效果一样,拷贝当前数组。

var arr=[1,2,3,4];
arr.slice();
[1, 2, 3, 4]
var arr1 = arr.slice();
[1, 2, 3, 4]
arr1
[1, 2, 3, 4]
arr.slice(0);
[1, 2, 3, 4]
arr.slice(1);
[2, 3, 4]
arr.slice(1,3);
[2, 3]
arr.slice(1,5);//当结束位置超出索引范围,只返回实际的长度
[2, 3, 4]
arr.slice(-2,-1);//起始位置为4-2=2,结束位置为4-1=3
[3]
arr.slice(-2,-3);//如果结束位置大于起始位置则返回[]

 8、splice,数组中最为强大的方法,可以实现数组替换、删除、插入,并返回被截取的数组。关键取决于第二个参数的值。

  删除数组元素,通过传入两个参数即可删除数组指定位置和个数的元素,第一个参数为索引位置,第二个参数为长度(0大于)。 

var arr=[1,2,3,4];
arr
[1, 2, 3, 4]
var sub=arr.splice(0,2);//从第0个位置开始截取2个元素,并返回新的数组
sub
[1, 2]
arr
[3, 4]//原数组被截取两个元素

var arr=[1,2,3,4];

  var sub = arr.splice(-3,2);//如果第一个参数为负数,则length-3

  sub
  [2, 3]
  arr
  [1, 4]

   指定位置插入元素,通过传入三个以上参数即可在指定位置插入元素,第一个参数为索引位置,第二个参数为长度(0或undefined),第三及以上为新元素。

var arr=[1,2,3,4];
var insert= arr.splice(2,0,5,6);//在索引为2的位置插入新元素
insert;//返回[]
arr
[1, 2, 5, 6, 3, 4]

  指定位置替换元素,通过传入三个以上参数即可在指定位置插入元素,第一个参数为索引位置,第二个参数为长度(>0),第三及以上为新元素。

var arr=[1,2,3,4];
var change = arr.splice(2,2,7,8);//替换两个元素并且返回截取的数组
change;
[3, 4]
arr
[1, 2, 7, 8]

 9、查找元素位置:indexOf()和lastIndexOf()。两个方法接收两个参数,第一个为查找的项,第二个为起始位置。indexOf从头到尾查找,lastIndexOf相反。返回值返为匹配到位置,如果是-1表示未能查询到。

var arr= ["test1","test2",10];
arr;
["test1", "test2", 10]
arr.indexOf("test2");
1
arr.indexOf("10",1);
-1
arr.indexOf(10,1);
2
arr.lastIndexOf(10);
2
arr.lastIndexOf("test1");
0
arr.lastIndexOf("test1",1);
0
arr.lastIndexOf(10,1);
-1

10、数组迭代

  ECMAScript新增5个迭代方法:每个方法接收两个参数,第一个参数为当前项要运行的function,第二个参数为运行function的作用域影响this的值。function传入参数:数据项、数据项的索引位置、数组对象本身。function(item,index,arr){do…}

  every():给定数组每一项运行function,如果该函数对每一项都返回true,则返回值为true,否则相反。

  filter():给定数组每一项运行function,如果该函数会返回true,则返回为true项组成的数组。

  forEach():给定数组每一项运行function,没有返回值。与for迭代数组用法一致。

  map():给定数组每一项运行function,返回每次函数调用的结果组成的数组。

  some():给定运行数组每一项运行function,如果该函数对任一项返回true,则返回值为true,否则相反。与every相反。

every:

var arr=[1,2,3,4];
var result = arr.every(function(item,index,arr){return item>3});
result;//并非每一项都大于3,所以返回值为false
false
arr;//原数组未发生变化
[1, 2, 3, 4]

filter:

var arr=[1,2,3,4];
var filter = arr.filter(function(item,index,arr){return item>2});
filter;//返回符合大于2的数组
[3, 4]
arr;//原数组未发生变化
[1, 2, 3, 4]

map:

var arr=[1,2,3,4];
var map = arr.map(function(item,index,arr){return item+3;});
map;//每项执行结果组成的数组
[4, 5, 6, 7]
arr;//原数组未发生变化
[1, 2, 3, 4]

some:

var arr=[1,2,3,4];
var some = arr.some(function(item,index,arr){return item>2});
some;//执行结果只有任一项为true,则返回true
true
arr;//原数组未发生变化
[1, 2, 3, 4]

 11、缩小方法:reduce和reduceRight。两个行数都接收两个参数,第一个为每项执行的行数,第二个参数为缩小的初始值。function接收4个参数:前一个值、当前值、项的索引和数组。前一个值即前一次执行function结果。reduce从头往后执行,reduceRight相反。  

var arr=[1,2,3,4];
var reduce=arr.reduce(function(per,cur,item,arr){return per+cur});
reduce;//将前次计算结果和本次相加返回最终的结果
10
arr;//原数组未发生变化
[1, 2, 3, 4]
var reduce=arr.reduce(function(per,cur,item,arr){return per+cur},20);//20为基础值,结果为30=20+10

12、数组填充:fill方法可以作为初始化数组使用,方法接收3个参数,第一个为填充的属性,第二个为起始位置,第三个为结束位置。也可以作为数据替换使用。

var arr = Array(20);
arr;
[undefined × 20]
arr.fill(10,0,5);//填充10到0-5索引的元素
[10, 10, 10, 10, 10, undefined × 15]
arr;
[10, 10, 10, 10, 10, undefined × 15]
arr.fill(20,5,20);//填充5-20
[10, 10, 10, 10, 10, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20]
arr;
[10, 10, 10, 10, 10, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20]

13、数组包含元素:include判断数组是否包含某项,返回true或者false。相比indexOf方法,include可以在if(arr.include(key)),不需像indexOf要判断是否大于0等;可以支持对NaN的判断,[a,b,NaN].include(NaN)

arr;
[10, 10, 10, 10, 10, 30, 30, 30, 30, 30, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20]
arr.push("test");
21
arr.includes("test");
true
arr.includes("111");//数组元素不存在"111"
false

  数组总结:

  1、Array为列表数据结构,同时也是引用类型,可以通过arr[key]=”value”和arr.key=value添加属性,key为符号变量的命名,且不为正整数。

      2、jion、toString、toLocalString输出字符串。

  3、执行方法会改变原数组:push、pop、shift、unshift、splice、fill、sort、reverse

  4、通过改变数组长度,可以改变数组内容

  5、fill、include属于ECMAScript6的内容

  6、关于ECMAScript
6的数组扩展可以参考: 

三、Date类型

  创建Date实例可以通过new
Date();,没有传入参数,对象自动获取当前日期和时间。如果想要创建指定的date实例,可以通过传入Date.prase(“2016-01-1”)实例化,如果参数不能表示时间则返回NaN。Date.UTC(),同样也能实现,但必须指定前面两个参数例如:Date.UTC(2000,0);在UTC中月份从0开始0~11,天1~31,小时0~23。

var date =new Date();//可以传入毫秒数
date
Fri Mar 03 2017 22:43:12 GMT+0800 (中国标准时间)
var date =new Date(Date.parse("2016-01-01"));
date
Fri Jan 01 2016 08:00:00 GMT+0800 (中国标准时间)
var date =new Date(Date.parse(2016,1));
date;
Fri Jan 01 2016 08:00:00 GMT+0800 (中国标准时间)

  ECMAScript5添加了Date.now()方法用于获取当前的毫秒数。

var date = Date.now();//获取当前的毫秒数
date;
1488552453848
date.valueOf();//返回date的毫秒数
1488552453848

  Date.prototype方法

getDate()//返回月份中的天数 1~3
getDay()//返回星期几  0表示周末,1-6表示周一到周六
getFullYear()//返回年
getHours()//返回小时,0~23
getMilliseconds()//返回毫秒数 29
getMinutes()//返回分钟0~59
getMonth()//返回月份,0~11
getSeconds()//0~59
getTime()//返回日期的毫秒数 1488552890029
getTimezoneOffset()//返回本地与UTC相差的分钟数
getUTCDate()
getUTCDay
getUTCDay()
getUTCFullYear()
getUTCHours()
getUTCMilliseconds()
getUTCMinutes()
getUTCMonth()
getUTCSeconds()
getYear()//117  2017-1900
toDateString()//"Fri Mar 03 2017"
toJSON()//"2017-03-03T14:54:50.029Z"
toLocaleDateString()
toLocaleString()
toLocaleTimeString()//"下午10:54:50"
toString()
toTimeString()//"22:54:50 GMT+0800 (中国标准时间)"
valueOf()//返回毫秒数

四、RegExp类型

  正则表达式支持三种匹配模式:

  • g:代表全局匹配,字符串会从头匹配到尾。
  • i:忽略匹配大小写。
  • m:代表匹配多行文本。

   
 正在表达式元符号:(、)、[、]、{、}、|、*、?、.、+。元符号在表达式中有特殊的含义,因此当字符串要匹配包含以上符合时候需要使用转义字符进行转换。例如:[bc]

  创建RegExp对象有两种方式:

  1、通过构造函数创建

  var reg=new
RegExp(parrtern,flag);接收两个参数(都是字符串),第一个参数要匹配的模式,第二个为匹配标志。  

var reg = new RegExp("[bc]at","g");//匹配全局  b或者c  at
var str = "cat,bat,dat";
reg.exec(str);
["cat"]
reg.exec(str);
["bat"]
reg.exec(str);
null

  2、通过字面量创建

  var reg = /[bc]at/gi;格式为/parttern/flags  

var reg = /[bc]at/gi;//创建一个匹配全局的不区分大小写
var str="cat,Bat,dat";
reg.exec(str);
["cat"]
reg.exec(str);
["Bat"]
reg.exec(str);
null

  RegExp的实例属性:

  • global:布尔值,表示是否设置g。
  • ignoreCase:布尔值,表示是否设置i。
  • multiline:布尔值,表示是否这是了m。
  • lastIndex:整数,表示开始搜索下一个匹配项的字符位置,从0开始。
  • source:按照字面量传入模式的字符串。  

    var reg = /[bc]at/gi;
    reg.global;
    true
    reg.ignoreCase;
    true
    reg.multiline;
    false
    reg.lastIndex;
    0
    reg.source;
    “[bc]at”

  RegExp的实例方法:

  • exec:接收一个参数(应用模式的字符串),返回包含第一个匹配项信息的数组实例,如果没有匹配返回null。同时数组还有两个属性:input和index,index表示匹配项在字符串中的位置,input表示应用的正则表达式的字符串。如果匹配模式这是为g,每次返回一个匹配项,执行多次返回最新一次匹配项;如果没有设置g,多次执行方法,返回的都是第一个匹配项。
  • var reg = /[bc]at/i;

    var str="cat,Bat,dat";
    reg.exec(str);
    Array[1]
    0: "cat"index: 0input: "cat,Bat,dat"length: 1__proto__: Array[0]
    reg.exec(str);//没有设置匹配模式g,多次调用exec都返回第一次匹配的项
    Array[1]
    0: "cat"index: 0input: "cat,Bat,dat"length: 1__proto__: Array[0]
    

     

  • test:接收一个参数(应用模式的字符串),返回boolean。如果正确匹配返回true,如果未能匹配返回false。

  • var reg = /[bc]at/i;
    undefined
    var str="cat,Bat,dat";
    undefined
    reg.test(str);
    true
    

  

  RegExp构造函数属性:

  • input($_):最近一次要匹配的字符串。
  • lastMatch($&):最近一次匹配的字符项。
  • lastParen($+):最后一次匹配组。
  • leftContext($+):匹配项的左边字符串。
  • rightContext($`):匹配项的右边字符串
  • mulitline($*):boolean值,表示是否所有表达式都使用多行模式。
  • $1~$9:用于存储多个捕获组
  • var text=”this has been a short summer”;

    var parrtern =/(.)hort/g;
    if(parrtern.test(text)){
        console.log(RegExp.input);
        console.log(RegExp.leftContext);
        console.log(RegExp.rightContext);
        console.log(RegExp.multiline);//chrome中没有
        console.log(RegExp.lastMatch);
        console.log(RegExp.lastParen);
    }
    VM699:4 this has been a  short summer //原始字符串
    VM699:5 this has been a  //左边的字符串
    VM699:6  summer  //右边的字符串
    VM699:7 undefined   
    VM699:8 short  //最后匹配的项
    VM699:9 s  //最后匹配的组
    
    var text="this has been a  short summer";
    var parrtern =/(.)hort/g;
    if(parrtern.test(text)){
        console.log(RegExp.$_);
        console.log(RegExp["$&"]);
        console.log(RegExp["$+"]);
        console.log(RegExp["$'"]);
    }
    VM766:4 this has been a  short summer
    VM766:5 short
    VM766:6 s
    VM766:7  summer  
    

  JavaScript正则表达式不能实现:

  • 匹配字符串开始和结尾的A和Z锚,但支持以插入符号(^)和($)来匹配字符串的开始和结尾。
  • 向后查找
  • 并集和交集类
  • 原子组
  • s(单行)和x(无间隔)的匹配模式
  • 条件匹配
  • 正则表达式注释

 

五、Function类型

  在ECMAScript中函数是一个神秘的东西,它是的本质是一个对象,是Function的实例对象。因此它和其他引用类型一样拥有属性和方法。由于函数是对象,函数名实际上是指向函数对象的指针,即也为变量。

  函数声明的语法:  

//第一种通过function关键+函数名称+参数
function sum(a,b){
    return a+b;  
}
//第二种通过定义变量和匿名方式定义函数
var sum=function(a,b){
  return a+b;
}
//第三种通过构造函数定义函数,构造函数的参数最后一个标识函数体,其他表示参数
var sum = new Function("a","b","return a+b;");

  1、从第二种方式定义,察函数名可以看成一个变量。从第三种方式定义,容易观察函数为Function的实例对象,即普通对象。

  2、函数名仅为指向函数对象的指针,并非绑定函数  

function sum(a,b){
    return a+b;
}
var sum_1=sum;//sum_1指向sum函数对象
sum=null;//将sum执行为null
sum_1(1,2);//依然能正确的执行
3
sum
null

  3、第三种方式定义:会执行两次两次解析,第一次为ECMAScript的代码解析,第二次传入构造函数的字符串解析,因此性能低下。

  4、第一种和第二种定义方式基本上没有区别,唯一的区别在于调用函数的时候,函数申明方式会被解析器优先读取并添加到执行的环境中(函数申明提升过程 function declaration
hoisting),而函数表达式只有解析器执行到它所在的代码行才会解析。第二种方式,只有执行到那一行的时候变量才会指向函数对象,因此在变量初始化之前调用就会出现错误。 

//第一种方式定义,函数会被优先解析,确保在任何代码执行之前函数可用
sum(1,2);
function sum(a,b){return a+b;}
3
//函数表达式,必须等到解析器执行到它所在的代码行,才会被真正的解析
sum(1,2);
var sum=function(a,b){return a+b;};
VM138:1 Uncaught TypeError: sum is not a function    //错误
at <anonymous>:1:1

  函数没有重载:因为函数名为变量,指向函数对象的指针。下面例子可以看出,第一个sum的变量被第二个重新赋值,即指向第二个函数对象。 

var sum=function(a){
    return a;
}
sum =function(a){
    return a+10;  
}
sum(10);//结果为20
20

  高阶函数(Higher-order
function):高阶函数的意思是它接收另一个函数作为参数。在 javascript
中,允许函数作为参数或者返回值传递,因为函数名可以认为是变量。Array引用类型包含多个高阶函数:例如map,filter,reduce等

//定义一个sum的函数
function sum(a,b){
    return a+b;
}
//定义一个callFunc的函数传入一个函数
function callFunc(func,a,b){
    return func(a,b);
}
callFunc(sum,1,2);
3

  函数的内部属性:arguments和this。arguments保存函数实际接收的参数,类似数组,在ECMAScript
6中引入rest(用于获取显示参数之外的参数)。this引用的是函数据以执行的环境对象。arguments保存函数调用时候,实际传入的参数,如果函数没有显示定义参数,可以通过arguments接收参数。

function sum(a,b){
    var tmp1=arguments[0];//获取传入的第一个参数
    var tmp2=arguments[1];//获取传入的第二个参数
        console.log(arguments[2]);//获取传入的第三个参数
    return tmp1+tmp2;
}
undefined
sum.length;//函数定义参数个数
2
sum(1,2,4);
3
4

function sum(a,b){
    console.log("当前的this为:");
    console.log(this);
    var tmp1=arguments[0];//获取传入的第一个参数
    var tmp2=arguments[1];//获取传入的第二个参数
        console.log(arguments[2]);
    return tmp1+tmp2;
}
sum(1,2);//全局作用域调用,浏览器指向windows对象
var obj ={"test":"te"};
obj.sum=sum;
obj.sum(1,2);//指向obj对象

图片 9

  函数方法:call和apply。这两个方法不是从Object继承的。这两个方法的用于在特定的环境中调用函数,实际上等于设置函数this对象的值。apply和call接收两个参数,第一个为运行函数的作用域,第二个为参数,两者的区别在于第二个参数,apply接收一个数组的参数,call接收多个单独的参数。 这两个方法最大的优点是:用于扩充作用域,避免对象和函数的耦合。

function sum(a,b){
    console.log("当前的this为:");
    console.log(this);
    var tmp1=arguments[0];//获取传入的第一个参数
    var tmp2=arguments[1];//获取传入的第二个参数
        console.log(arguments[2]);
    return tmp1+tmp2;
}
var obj={};
sum.apply(obj,[1,2]);
VM802:2 当前的this为:
VM802:3 Object {}__proto__: Object
VM802:6 undefined
3
sum.call(obj,1,2);
VM802:2 当前的this为:
VM802:3 Object {}
VM802:6 undefined
3

  bind方法,创建一个函数的实例,函数的this会被绑定到传给bind的参数上。  

function sum(a,b){
    console.log("当前的this为:");
    console.log(this);
    var tmp1=arguments[0];//获取传入的第一个参数
    var tmp2=arguments[1];//获取传入的第二个参数
        console.log(arguments[2]);
    return tmp1+tmp2;
}
var obj={test:1};
undefined
var tt=sum.bind(obj);
tt();
VM858:2 当前的this为:
VM858:3 Object {test: 1}
VM858:6 undefined
NaN

 六、基本包装类型

  ECMAScript中的基本类型有字符串、数字、布尔。ECMAScript为三种类型分别提供字符串String、Number、Boolean包装类。因此基本类型也可以有对应类型的行为。当读取基本类型时候,后台会为其创建对应的包装类对象,从而能够提供一些方法来处理数据。  

1 var str = "test";//定义字符串变量
2 str;
3 "test"
4 str.substring(1,2);//调用substring方法
5 "e"

   上面代码中str为基本类型,但是可以调用substring方法,这是因为在读取str的基本类型时,后台为其创建一个String对象,然后在对象上调用substring方法,并且在执行完的时候,将对象赋值为null(销毁对象),这与普通的引用类型使用new创建的作用域不一样(new创建会常驻内存)。同样适用于Boolean和Number类型。

1 var str=new String("test");
2 str.substring(1,2);
3 str=null;

  基本类型的包装类型通过typeof返回都是object,所有的引用类型对象都会被转换为true,因此可以通过if(obj)来判断对象是否存在。 

1 var obj = new Object(25);
2 if(obj)
3 {console.log("true")}
4 VM425:2 true

  但是使用new 基本类型包装类和不用使用new返回的类型是不一样的。 

//两种形式返回的类型不一致
var a="25";
var aNum=Number(a);
typeof aNum;
"number"
var bNum= new Number(a);
typeof bNum;
"object"

  Number的方法:

1 //
2 Number.prototype
3 toExponential();//返回e指数标识,接收一个参数
4 toFixed();//返回多少位小数,接收一个参数
5 toLocaleString();//返回字符串
6 toPrecision();//返回一种合适的表示:可能为e指数或者toFixed,接收一个参数
7 toString();//返回字符串进制表示,接收一个参数
8 valueOf();//返回基本类型的数值

1 接收一个进制表示的参数,默认为10进制
2 var num=10;
3 num.toString();
4 "10"
5 num.toString(2);
6 "1010"
7 num.toString(16);
8 "a"

 1 var num = 99.220002;
 2 num.toFixed(3);//返回3为小数
 3 "99.220"
 4 num.toPrecision(2);
 5 "99"
 6 num.toPrecision(3);
 7 "99.2"
 8 num.toPrecision(4);
 9 "99.22"
10 num.toPrecision(10);
11 "99.22000200"
12 num.toPrecision(1);
13 "1e+2"
14 num.toString(2);//二进制表示
15 "1100011.001110000101001000001101000100110000110111111"
16 num.toString(16);//十六进制表示
17 "63.38520d130df8"
18 num.valueOf();
19 99.220002
20 num.toLocaleString();//输出字符串
21 "99.22"

  String方法:

图片 10

图片 11  

 1 //早期为HTML生成提供便利,但是最好不要使用这些方法
 2 //However, be aware that typically these methods aren’t used, //because they tend to create nonsemantic markup.无法表达语义的标签
 3 METHOD OUTPUT
 4 anchor(name)      <a name=“name”>string</a>
 5 big()                     <big>string</big>
 6 bold()                   <b>string</b>
 7 fixed()                  <tt>string</tt>
 8 fontcolor(color)     <font color=“color”>string</font>
 9 fontsize(size)        <font size=“size”>string</font>
10 italics()                 <i>string</i>
11 link(url)                <a href=“url”>string</a>
12 small()                  <small>string</small>
13 strike()                 <strike>string</strike>
14 sub()                    <sub>string</sub>
15 sup()                    <sup>string</sup>

  Boolean方法:

图片 12

 

七、单体内置对象

  Global和Math。

  Global所有定义为全局的变量或方法都是Global的属性。常见的方法:isNaN(),parseInt(),parseFloat(),encodeURI(),decodeURI(),alert()等。

  在浏览器模式下,window是Global对象。  

window.alert(11);
window.eval("alert(11)");//eval方法会执行字符串的内容
window.eval("console.log(11)");//eval方法会执行字符串的内容

图片 13

图片 14

Global内置属性:

图片 15

  Math对象:包含min(),max(),round(),random()等。

 

发表评论

电子邮件地址不会被公开。 必填项已用*标注