从零开始学_JavaScript_系列（15）——js系列<4>（数值、字符串、对象、数组、函数、日期的基本方法）

注：$("#a").text( 内容 ) 是jquery的方法，可以理解为在

<div id="a"></div>

添加内容变为：

<div id="a">内容</div>



（6）数值

注意，Math的M需要大写

①绝对值：Math.abc(x) 获得x的绝对值（之后的意思都类似，非特殊不再说明）

②求四舍五入后结果：

Math.round(1.9) = 2;

Math.round(1.1)=1;

③向上取整：

Math.ceil(1.1)=2;

Math.ceil(-1.1)=-1;

④向下取整：

Math.floor(1.9)=1;

Math.floor(-1.9)=-2;

⑤求最大值：

Math.max(1,2,3,4) = 4;

⑥求最小值

Math.min(-1,-2,-3,-4) = -4;

⑦随机数：

0 <= Math.random() < 1

⑧



第二个是e的多少次方，第三个是log，第四个是对x进行开方，第五个是x是y次方。

e指的是自然对数（以常数e为底数的对数叫做自然对数记作ln N(N>0).）

第一个是指弧度，弧度=2*π/360*角度；

⑨对字符串进行处理变为数字：

变为整数：

parseInt(string, radix); //第二个参数表示输出几进制的数字可略

从第一个数字来开始识别，识别到不能识别为止。

例如：（注意，实际运用中，应该加引号，如 parseInt("1a11.1")这样）

1 1

1.1 1

1.1a 1

1a11.1 1

a1.1 NaN

变为浮点数：

同理上面

parseFloat("1.2a11.1") 1.2

转为数值：

Number(" 字符串 ")

值：

1.1 1.1

1.1a NaN

保留指定位小数：

num.toFixed(digits); 输出的是 字符串

例如：

(100.111).toFixed(2); 输出是100.11

(100.1).toFixed(2) 输出的是100.10

(0).toFixed(2) 输出的是0.00

（7）字符串

假设字符串为str，例如str="aaa";

①str.length 返回字符串的长度（字符数）汉字是1个字符

②得到输入框（input）的长度：var str = input.value;

得到输入框：document.getElementById("#input"); ——这里假设输入框ID为input

③str.charAt(index) 得到字符串索引值（index）位置的字符

示例："abc".charAt(0) 的值 "a";

最后一个字符是str.charAt(str.length-1);

④str.indexOf(字符串,
从哪个index开始找) //第二个参数可以省略

用处返回字符串第一个字符所在的位置（如果没有，则为 -1 ——注意，-1不是false）；

可以用于判断字符串是否在str里。

⑤str.search(regexp) 参数是正则表达式

返回字符串里是否有符合要求的，如果有，返回位置，如果没有，返回-1

例如：str.search(/[0-9]/) 查找字符串里是否有0~9的数字

var str="abc1";

$("#a").text(str.search(/[0-9]/));

输出为3

var str="abc";

$("#a").text(str.search(/[0-9]/));

输出为-1

⑥str.match(regexp) 参数是正则表达式

返回匹配到的正则表达式的值，返回值是一个数组

例如：

varstr="abc1332d";

$("#a").text(str.match(/[0-9]/));

返回值是1

例如：（加/g返回全部的）

varstr="abc1332d";

$("#a").text(str.match(/[0-9]/g));

返回值是：1,3,3,2

如果找不到，返回值是null

⑦str.replace(正则表达式|字符串, 被替换的字符串|函数)

例如：

var str="abc21";

$("#a").text(str.replace(/[0-9]/g,'q'));

返回值是：abcqq（两个数字都被替换为了q）

若不加g，那么则返回的是abcq1（第二个数字没有被替换）

⑧str.substring(索引1,
索引2)
返回索引1~索引2之间的字符串

前包含后不包含，例如：

var str="abc21";

$("#a").text(str.substring(1,2));

输出的是b

假如索引2被省略，那么一直输出到字符串的结尾

例如：

var str="abc21";

$("#a").text(str.substring(1));

输出：bc21

⑨str.slice(开始索引,
结束索引) 和上面功能一样，额外功能是，结束索引可以是负数。

假如是负数，那么从后往前数第n个，同样不包含结尾的。例如：

var str="abc21";

$("#a").text(str.slice(1,-1));

输出bc2（从下标1输出到下标倒数第1个但不包含倒数第一个）

var str="abc21";

$("#a").text(str.slice(-1));

输出1（因为从最后一个开始，到结尾，因此只有一个）

⑩str.substr(开始索引,
长度) 从开始输出，输出指定长度的

var str="abc21";

$("#a").text(str.substr(1,2));

输出c（从第二个c开始取1个）

《11》str.split(
分隔符,
输出几个) 以分隔符为分割，输出数组

例如：

varstr="a1b1c1d";

$("#a").text(str.split("1"));

输出：数组a,b,c,d

分隔符也可以是正则表达式：

var str="a1b1c1d";

$("#a").text(str.split(/[0-9]/));

输出不变

《12》str.toLowerCase()
将字符串变为小写

var str="ABC";

$("#a").text(str.toLowerCase());

返回值是abc

《13》str.toUpperCase()
将字符串变大写

var str="aaaAs";

$("#a").text(str.toUpperCase());

返回值是：AAAAS

《14》String(被转对象)
转为字符串

例如：

var str = 111;

str = String(str);

$("#a").text(typeofstr);

返回值是：string

又例如：

var str = true;

str = String(str);

$("#a").text(str);

返回值是：

true

这里是true是字符串true，而不是bool类型

又例如：

var str =function(){alert("1")};

str = String(str);

$("#a").text(str);

输出：

function (){alert("1")}

《15》转义字符

例如：

var str ="a\"a";

$("#a").text(str);

输出：a"a

转义后 转义前

\" "

\\ \

\t tab按键

其他略

（8）对象

①创建对象：

var obj = newOjbect{};

或者是

var obj = {};

②增加对象的方法：

ojb.name ="John";

就是给加一个name属性，其值为John，同理可以加函数。

③删除对象方法：

deleteobj.name;

就是删除obj的name属性

④查看某个对象的类型：

obj.constructor;

例如：

var str ={};

str.name="John";

str.age=10;

if(str.constructor ==Object)

$("#a").text("111");

是能输出111的

⑤obj.toString()
将对象字符串（但并不是所有对象都可以）

例如：

var str ={};

str.name="John";

str.age=10;

var p = new Number(123);

$("#a").text(p);

如果是p就可以输出123；如果是str就会输出Object

⑥obj.valueOf()
获取某个对象的原始值

function abc(){this.a=1};

给其加一个属性abc.prototype.b=2;

此时输入abc.valueOf();

显示：function abc(){this.a=1};

⑦obj.hasOwnProperty(参数 ) 返回参数是否存在于对象的属性中。

可以用于验证属性是否从继承而来。如果是继承，返回依然是false。

例如：

var str ={};

str.name="John";

str.age=10;

$("#a").text(str.hasOwnProperty("name"));

输出true

（9）数组

①创建数组：

var array = new Array();

或者是：

var array =[];

例：var array = [1, 3, 5];

数组里可以是数字、字符串、对象、数组、bool值

以下假设数组为arr

②arr.length
数组的长度（空为0）

③arr[x]
数组下标为x的成员

④修改数组元素，可以通过③中的直接修改。

⑤arr.indexOf(元素,
从哪里索引开始)

第二个参数一般不用。返回值是索引值（和之前的indexOf用法一样）；

⑥arr.forEach(回调函数, 参数2)
遍历数组，回调函数遍历到每个成员都会执行。参数2可省略（貌似是什么this替代的什么的，不懂）

回调函数的参数有三个：第一个是遍历到的元素，第二个是该元素的索引，第三个是这个数组本身。

例如：

$(document).ready(function(){

var arr = [1, 3, 5 ,7];

var result = new String();

arr.forEach(function(item,index, array){

item += 1;

item =item.toString();

result += item+"的索引是" + index + "　";

})

$("#a").text(result);

});

输出是：

2的索引是0　4的索引是1　6的索引是2　8的索引是3　

⑦arr.reverse()
将数组的元素顺序颠倒一次

上代码即可：

$(document).ready(function(){

var arr = [1, 3, 5 ,7];

var result = new String();

arr.reverse();

arr.forEach(function(item,index, array){

item =item.toString();

result += item+"的索引是" + index + "　";

})

$("#a").text(result);

});

输出：

7的索引是0　5的索引是1　3的索引是2　1的索引是3　

⑧arr.sort(回调函数 )
排序

不传回调函数的话，默认升序。

对字符串，按照Unicode码从第一个字符开始逐字符比较，然后排列。

例子：

$(document).ready(function(){

var arr = [1, 3, 5, 7, 2,4, 6, 8];

arr.sort(function(a,b){

return b - a; //b-a为降序，a-b为升序

});

$("#a").text(arr);

});

输出8,7,6,5,4,3,2,1

⑨arr.push(元素1,
元素2, .....)
给已有数组加元素，加到最后位置。

arr.unshift( 元素1,
元素2, ...) 给已有数组添加，加到最前面

⑩arr.shift() 获取数组第一个元素，并且从数组第一个元素中移除他。

如代码：

$(document).ready(function(){

var arr = [1, 3, 5, 7, 2,4, 6, 8];

alert(arr.shift()); //输出1

$("#a").text(arr); //从3开始输出

});

arr.pop() 类似上面，但从最后一个拿

《11》arr.splice(
从哪个索引开始, 删除多少,
插入的新元素);
可以用于添加、删除、替换等

var arr = [1, 3, 5, 7];

arr.splice(1,0,4); //位置1开始删除0个再添加4

$("#a").text(arr);

输出：1,4,3,5,7

var arr = [1, 3, 5, 7];

arr.splice(1,1); //位置1删除1个于是剩下1,5,7

《12》arr.slice(开始索引,
结束索引)
返回值是数组的拷贝，开始位置包含结束不包含，注意这里没有p

var arr = [1, 3, 5, 7];

var b = arr.slice(1,2); //从3开始5结束（不包含5）

$("#a").text(b);

输出3

第二个参数没有就表示到结束。

arr.slice(0); 效果是拷贝所有

《13》arr.concat(
值1,
值2, .....)
可以把几个数组连在一起，arr数组是第一个，值1是第二个。（注意，参数不一定是数组，也可以是其他类型）

例如：

var arr = [1, 3, 5, 7];

var arr1 = [2,4,6];

var str = "aa";

var b = arr.concat(arr1,str);

$("#a").text(b);

输出：1,3,5,7,2,4,6,aa

《14》arr.join(
分隔符 );

将数组以分隔符链接起来，输出字符串（前面有将字符串拆成数组）；

如：

var arr = [1, 3, 5, 7];

arr = arr.join(" +"); //注意，这步的返回值才是我们想要的

$("#a").text(arr);

输出：

1 + 3 + 5 + 7

如果没有参数，则默认是逗号，如果参数是""，那么无分隔符

《15》arr.map(
回调函数 )
遍历，并返回一个数组作为返回值

例如：

var arr = [1, 3, 5, 7];

var arr1 =arr.map(function(item, index, array){

return item+1;

});

$("#a").text(arr1);

输出：2,4,6,8

《16》arr.reduce(
回调函数,
传入的初始值begin )
具体要看回调函数

function( 上一次函数的返回值last, item, index, array){

retunr last + item;

}

last是上一次调用回调函数时的返回值，而第一次调用回调函数时，其值是begin。

例如：

var arr = [1, 3, 5, 7];

var arr1 =arr.reduce(function(last, item, index, array){

console.log(last);

return last + item;

}, 100);

$("#a").text(arr1);

输出值是116。原理是100 + 1 + 3 + 5 +7

console结果是100, 101， 104，109

注意：潜在的问题，没有执行第一次回调函数时的情况

假如没有给第二个参数begin，那么console.log只有三个结果（即1，4，9），说明第一次对于1，并没有执行回调函数。

如代码：

var arr = [1, 3, 5, 7];

var arr1 =arr.reduce(function(last, item, index, array){

item += 1;

return last + item;

});

$("#a").text(arr1);

预想输出是20（2+4+6+8），但实际输出是19（1+4+6+8）；

另外需要注意，以上这次函数时，并没有对arr本身造成影响。

（10）函数

①函数的形参少于／多于实参：

var fun = function(a,b){return a+b}

fun(1)返回NaN——形参多

fun(2,3,4)返回5（因为2+3）——实参多

②所有的参数，被放置在arguments这个变量里，以数组形式保存。

例如：

var arr = function(){

var total=0;

for(var i=0; i <arguments.length; i++)

{

total += arguments[i];

}

return total;

};

console.log(arr(1,2,3));

输出结果是6

③函数的参数，

原始类型——按值传递（函数内不影响函数外）；

对象Object——按引用传递（函数内被修改，函数外也会被改）；

如代码：

dog = {age:1}; //对象

var arr = function(obj){ //函数

obj.age++;

return obj;

};

cat = arr(dog); //dog传递给函数，返回值给cat

console.log(dog.age); //dog被修改

cat.age++; //cat是dog对象的引用，修改属性

console.log(dog.age); //dog再次被修改

说明：对象作为实参，是按引用传递，返回值若是对象，也是引用。可以理解为C++的引用变量，只要是引用变量，修改的便是同一个初始的变量（cat，dog还有函数里的obj，指向同一个对象dog）；

④构造函数：

function 函数名(
形参 )

{

this.形参1 =
某个值;

this.函数内自定义变量名 =
某个值;

this.函数名 = function(
参数 )

{

函数内容

}

//这里可以理解为，隐含了一个return this

}

这就是一个构造函数。

例如代码：

function fun( num ){ this.value = num;}

var obj1 = new fun(1);

console.log(obj1.value);

输出结果是1

⑤构造函数的原型：

是加了prototype在对象名和属性名之间，例如：

obj.prototype.add= function(){ this.value ++;}

示例代码：

function fun( num ){

this.value = num;

}

fun.prototype.num=10;

fun.prototype.plus =function(){

this.value +=this.num;

}

var obj1 = new fun(1);

var obj2 = new fun(2);

console.log(obj2.num); //输出10（说明和obj1互不干扰）

obj1.plus();

console.log(obj1.value); //输出11

console.log(obj1.num); //输出10

obj1.num++; //10-》11

obj1.plus(); //11+11=22

console.log(obj1.value); //输出22

console.log(obj1.num); //输出11

（11）Date日期

①当前时间：new Date();

②指定年月日：new Date(年, 月-1,日, 时, 分, 秒); ——参数是数字，

注意：月是从0开始的（0是1月）

如代码：

console.log(new Date(2016,4,4,1,2,3))

输出Wed May 04 2016 01:02:03 GMT+0800 (中国标准时间)

③获取某个具体的：（注意，date是在之前获取到的时间）

获取年 date.getFullYear();

获取月 date.getMonth();

获取日 date.getDate();

获取时 date.getHours();

获取分 date.getMinutes();

获取秒 date.getSeconds();

④时间格式化：

如代码：

function dateFormat(date){

return date.getFullYear() + "-" +padding(date.getMonth() + 1) + "-" + padding(date.getDate()) + "" + padding(date.getHours()) + ":" + padding(date.getMinutes())+ ":" + padding(date.getSeconds());

}

function padding(num){

return num<10 ? "0" + num : num;

}

var date=new Date();

console.log(dateFormat(date));

输出：

2016-05-10 20:50:58

⑤设置date时间：

date.setFullYear(2010) 设置年份为2010

其他同理

date.setDate(40) 会在当前月份基础上，查看第40天是哪天（下个月的哪天），即会自动递增。