JS中的数据

• 一、数据类型
  • 项目
    • 项目
• 二、获取数据类型
• 三、数据所对应的方法
  • 一、Array
  • 二、Number
  • 三、String
  • 四、Date
  • 五、Map
  • 六、Json
• 四、数据遍历

一、数据类型

基本数据类型：Undefined，Null，Boolean，Number，String
复杂数据类型：Object
数据的集合 ： Array

二、获取数据类型

1. typeof
   返回类型为字符串格式，可以判断function的类型，在判断除Object类型的对象时比较方便。

alert(typeof 123)         “number”
alert(typeof [“1”,”2”])   “object”
alert(typeof null)        “object” 
alert(typeof undefined)   “undefined”

2. instanceof
   后面一定要是对象类型，并且大小写不能错，该方法适合一些条件选择或分支。

alert(123 instanceof Number)  返回true

3. constructor
   在类继承时会出错

function A(){}; 
function B(){}; 
A.prototype = new B(); //A继承自B 
var aobj = new A(); 
alert(aobj.constructor === B) -----------> true;
 alert(aobj.constructor === A) -----------> false; 

而instanceof方法不会出现该问题，对象直接继承和间接继承的都会报true：

4. prototype

alert(Object.prototype.toString.call("string")==='[object String]');  -------> true
alert(Object.prototype.toString.call(123)==='[object Number]');  -------> true
alert(Object.prototype.toString.call([1,2,3])==='[object Array]');   -------> true

5. jQuery.type()
   如果对象是undefined或null，则返回相应的“undefined”或“null”。

jQuery.type( undefined ) === "undefined"
jQuery.type() === "undefined"
jQuery.type( window.notDefined ) === "undefined"
jQuery.type( null ) === "null"
jQuery.type( true ) === "boolean"
jQuery.type( 3 ) === "number"
jQuery.type( "test" ) === "string"
jQuery.type( function(){} ) === "function"
jQuery.type( [] ) === "array"
jQuery.type( new Date() ) === "date"
jQuery.type( new Error() ) === "error"
jQuery.type( /test/ ) === "regexp"

三、数据所对应的方法

一、Array

不会改变原有数组的方法：concat()，join()，slice()
会改变原有数组的方法：pop()，shift()，unshift()，push()，reverse()，sort()，splice()

• concat()
  concat() 方法用于连接两个或多个数组,常用于克隆

var a = [1,2,3];
a.concat([4,5])      [1,2,3,4,5]

• Join()
  把数组中的所有元素放入一个字符串。

var arr = ["George","John","Thomas"]
arr.join(",")      George,John,Thomas

• pop()，shift()，unshift()，push()

pop() 删除并返回数组的最后一个元素

var arr = ["George","John","Thomas"]
arr.pop()  Thomas
arr		["George","John"] 

shift() 删除并返回数组的第一个元素

var arr = ["George","John","Thomas"]
arr.shift()  George
arr		["John "," Thomas "]

unshift() 可向数组的开头添加一个或更多元素，并返回新的长度

var arr = ["George","John"]
arr. unshift ("Tom","Thomas")  4
arr		["Tom","Thomas","George","John"]

push() 向数组的末尾添加一个或多个元素，并返回新的长度

arr.push("Tom")    4
arr     ["George","John","Thomas","Tom"]

• reverse()
  颠倒数组中元素的顺序。

var arr = ["George","John","Thomas"]
arr.reverse() 
arr		["Thomas ","John","George"]

• slice(start,end)
  从已有的数组中返回选定的元素。start为-1则是从数组最后一个元素开始

var arr = ["George","John","Thomas"]
arr.slice(1)   ["John","Thomas"]

• sort()
  sort() 方法用于对数组的元素进行排序。
  不传参数则按照字母排序，且参数只能是function()

Array. sort(function(a,b){return a-b;})

• splice()
  向/从数组中添加/删除元素，然后返回被删除的元素
  Array.splice(index,howmany,item1,…,itemX)
  Index为元素的位置，howmany为删除元素的数量为0则不删除，,item1,…,itemX为要添加的元素

var arr = ["George","John","Thomas"]
arr.splice(1，0，“Tom”)   ["George","Tom","John","Thomas"]

二、Number

• toString（数字转字符串）
  array.toString() 、 boolean.toString() 、 date.toString() 、 Number.toString()、 String.toString()

var number = 16;
number.toString();("16")如果number不是数字抛出TypeError异常

• toFixed(Number四舍五入为指定小数位数的数字)

var number = 16.66;
number.toFixed(1);(16.6)

• toExponential(值转换成指数计数法)

var number = 16000;
number. toPrecision (3);(1.6e+4)

• toPrecision(值超出指定位数时将其转换为指数计数法)

var number = 16000;
number.toPrecision(3);(1.6e+4)

• valueOf(返回一个 Number 对象的基本数字值)

var Function = new function(){};
document.write(Function =2);        输出2

三、String

length获取字符串长度

var txt="Hello World!"

• lastIndexOf()
  从后检索，返回一个指定的字符串值最后出现的位置；若未检索到则返回-1，（对大小写敏感）

txt.lastIndexOf("Hello")   0
txt.lastIndexOf("World")   6
txt.lastIndexOf("world ")   -1

• match()和search()
  match()检索字符串或正则表达式, search()只能检索字符串，返回检索到的值，若未检索到返回null

txt .match("world")   world
txt .match("World")  null
var str="1 plus 2 equal 3"
str.match(/\d+/g)    1,2,3

• replace()
  在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串

txt.replace(/Hello/, "Hi")  “Hi World”
注意：若要替换字符串中的"\r\n"
var str = “123\r\n456”
str.replace(/\\r\\n/g, "<br\>")  “123<br\>456”  g为全局替换，不加则替换匹配的第一个

• slice(start,end)， substr(start,length)，substring(start,stop)
  slice() 的start没有0从字符串中提取字符,start为-1则是从最后一个字符开始
  substr() 在字符串中抽取从 start 下标开始的指定数目的字符, start为-1 指字符串中最后一个字符
  substring() 用于提取字符串中介于两个指定下标之间的字符。start和stop都为非负正整数

txt.slice(6,11)   World
txt.slice(-2)     ld
txt.substr(0,2)   He

• split(value,maxLength)
  把一个字符串分割成字符串数组。maxLength为返回的最大数组长度

"|a|b|c".split("|")	["", "a", "b", "c"]
"|a|b|c".split("|",2)	["", "a"]

四、Date

var myDate=new Date()

时间戳转日期

function timestampToTime(timestamp) {
	var date = new Date(timestamp * 1000);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
	var Y = date.getFullYear() + '-';
	var M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
	var D = date.getDate() + ' ';
	var h = date.getHours() + ':';
	var m = date.getMinutes() + ':';
	var s = date.getSeconds();
	return Y+M+D+h+m+s;
}
timestampToTime(1403058804);
console.log(timestampToTime(1403058804));//2014-06-18 10:33:24

日期转时间戳

var date = new Date('2014-04-23 18:55:49:123');
// 有三种方式获取
var time1 = date.getTime();
var time2 = date.valueOf();
var time3 = Date.parse(date);
console.log(time1);//1398250549123
console.log(time2);//1398250549123
console.log(time3);//1398250549000

五、Map

var myMap = new Map();
 
var keyObj = {},
    keyFunc = function () {},
    keyString = "a string";
 
// 添加键
myMap.set(keyString, "和键'a string'关联的值");
myMap.set(keyObj, "和键keyObj关联的值");
myMap.set(keyFunc, "和键keyFunc关联的值");
 
myMap.size; // 3
 
// 读取值
myMap.get(keyString);    // "和键'a string'关联的值"
myMap.get(keyObj);       // "和键keyObj关联的值"
myMap.get(keyFunc);      // "和键keyFunc关联的值"
 
myMap.get("a string");   // "和键'a string'关联的值"
                         // 因为keyString === 'a string'
myMap.get({});           // undefined, 因为keyObj !== {}
myMap.get(function() {}) // undefined, 因为keyFunc !== function () {}

for of 遍历

扫描二维码关注公众号，回复： 6513040 查看本文章

var myMap = new Map();
myMap.set(0, "zero");
myMap.set(1, "one");
for (var [key, value] of myMap) {
  console.log(key + " = " + value);
}
// 将会显示两个log。一个是"0 = zero"另一个是"1 = one"

for (var key of myMap.keys()) {
  console.log(key);
}
// 将会显示两个log。 一个是 "0" 另一个是 "1"

for (var value of myMap.values()) {
  console.log(value);
}
// 将会显示两个log。 一个是 "zero" 另一个是 "one"

for (var [key, value] of myMap.entries()) {
  console.log(key + " = " + value);
}
// 将会显示两个log。 一个是 "0 = zero" 另一个是 "1 = one"

foreach 遍历

myMap.forEach(function(value, key) {
  console.log(key + " = " + value);
}, myMap)
// 将会显示两个logs。 一个是 "0 = zero" 另一个是 "1 = one"

六、Json

• json.stringify()
  会忽略undefined和函数

var  aa1 ={
	name:"zj",
	age:25,
	tmp:undefined,
	say:function(){ console.log(1); } 
};
 var bb1 = JSON.stringify(aa1); 
 var bb2 = JSON.stringify(aa1,[ "name"]); 截取name数据
 console.log(bb1); //打印{"name":"zj","age":25}
 console.log(bb2); //打印{"age":25}

• json.parse()

var cc = JSON.parse(bb1);
    console.log(cc );//打印Object {name: "zj", age: 25}
}

四、数据遍历

• 普通for循环
  可以通过用break来中断循环(continue跳出本次循环)

for(j = 0; j < arr.length; j++) {} 

• 优化版for循环
  可以通过用break来中断循环(continue跳出本次循环)

for(j = 0,len=arr.length; j < len; j++) {}

• foreach循环
  性能比普通for循环弱（只能用return或return false跳出本次循环）

arr.forEach(function(value, index, array){});

$.each([], function(index, value, array) {});(只能用return或return false结束循环)

• for in循环
  效率最低，多用来遍历对象

for(j in arr) {}

• map遍历
  实际效率比不上foreach

arr.map(function(n){});

• for of遍历
  (需要ES6支持)性能要好于forin，但仍然比不上普通for循环，可以正确响应break、continue和return语句

for(let value of arr) {});