2011
Nov
19

网页好读版

JS 基本变数型态

  • Array : 阵列 [0,1,2,3,4]
  • Boolean : 布林值 true ,false
  • Date : 日期
  • Number : 数字
  • String : 字串

JS 基本变数型态宣告 Typeof 测试

Example
  1. var str="String";
  2. var bool=true;
  3. var date=new Date();
  4. var num=5;
  5. var ay=[0,1,2,3];
  6.  
  7. alert(typeof(str)); //string
  8. alert(typeof(bool)); //boolean
  9. alert(typeof(date)); //object
  10. alert(typeof(num)); // number
  11. alert(typeof(ay)); //object

测试的结果 Date与 Array 的type都是object,很奇怪吧,本来以为他会印出 Array 跟 Date,想知道为什么吗?那就一起往下看吧。

JS 基本变数宣告方式2 Typeof 测试

接著我们使用 New 的方式,去建立所有的变数,来测试一下会有什么结果。

Example
  1. var str=new String("String");
  2. var bool=new Boolen(true);
  3. var num=new Number(5);
  4. var ay=new Array(0,1,2,3);
  5. alert(typeof(str)); //object
  6. alert(typeof(bool)); //object
  7. alert(typeof(num)); // object
  8. alert(typeof(ay)); //object

哇哩例!!! 全部都是 object ,JS 也太夸张,这样根本没办法判定型态呀。

JS 基本变数型态 Instanceof 测试

看来只好出大绝招了,instanceof 的目的,在於找到变数的 object constructor,也就是找出变数是从那一个 class new出来的,先给你看个使用范例。

Example
  1. function MyObject(){
  2.  
  3. }
  4. var s= new MyObject();
  5. if(s instanceof MyObject){
  6. alert("object is MyObject");
  7. }
  8. else{
  9. alert('fail');
  10. }
  11. //output object is MyObject

太好了,那我们就来测试一下 String物件,使用 instanceof 会不会抓到 String class呢,

Example
  1. var str=new String("String");
  2. if(str instanceof String){
  3. alert("object is String");
  4. }
  5. //output object is String
  6. if(str instanceof Object){
  7. alert("object is Object");
  8. }
  9. //output object is Object

JS 又来了,[Object],[String]两个都成立,太神奇,那到底 new String是什么东西哩! 我直接去看String最原始的class好了,不要用New物件的方式 。

Example
  1. alert(String.constructor);
  2. alert(String.prototype.constructor);
  3.  
  4. //这行Firefox才能跑
  5. alert(String.prototype.__proto__.constructor);
  6.  
  7. /*output
  8. Function
  9. String
  10. Object
  11. */

喔! 懂了吧,原来 String本身是一个function,不过继承了String,又继承了 Object !,看到 JS所有的变数物件最后都会继承 Object, 难怪查询 Typeof 都会印出 object。

实作 getInstanceofType

接著我写一个自动去判定 instaceof 抓型别的 function ,这边要注意把 判定 Function与 Object放在最后面,还有内建型别的第一个字母要大写喔。

Example
  1. var getInstanceofType=function(obj){
  2. if(obj instanceof String){
  3. return "instanceof = String";
  4. }
  5. if(obj instanceof Boolean){
  6. return "instanceof = Boolean";
  7. }
  8. if(obj instanceof Number){
  9. return "instanceof = Number";
  10. }
  11. if(obj instanceof RegExp){
  12. return "instanceof = RegExp";
  13. }
  14. if(obj instanceof Date){
  15. return "instanceof = Date";
  16. }
  17. if(obj instanceof Function){
  18. return "instanceof = Function";
  19. }
  20. if(obj instanceof Object){
  21. return "instanceof = Object";
  22. }
  23. return "instanceof no found";
  24. }

上一个function写得又臭又长,太不专业了,身为一个专业的宅男工程师,要改善一下,增加型别比对要更容易些。

Example
  1. var getInstanceofType=function(obj){
  2. var type=["String","Boolean","Number","RegExp","Date","Function","Object"];
  3. var i=0,n=type.length,pro;
  4. for(i ; i<n;i++){
  5. pro=type[i];
  6. eval("var t=obj instanceof "+pro+";");
  7. if(t){
  8. return "instanceof = "+pro;
  9. }
  10. }
  11. return "instanceof no found";
  12. }

测试一些数据,看看合不合味口

Example
  1. alert(getInstanceofType(String)); //Fucntion
  2. alert(getInstanceofType(func)); //Function
  3. alert(getInstanceofType(reg)); //RegExp
  4. alert(getInstanceofType([0,1,2])); //Object
  5. alert(getInstanceofType(5)); // not found

String => Function , Array => Object , 5=> not found ,好像还是怪怪的,似乎有点棘手。

使用 instanceof+typeof+constructor 判定型别

Example
  1. var getType=function(obj){
  2. var type=["String","Boolean","Number","Array","RegExp","Date","Function","Object"];
  3. var obj_constructor="",obj_typeof="";
  4. if(obj.prototype && obj.prototype.constructor ){
  5. var constructor = obj.prototype.constructor.toString();
  6. var m=constructor.match(/function ([a-z]+)/i);
  7. if(m && m[1])
  8. return "type = class ["+m[1]+"]";
  9. }
  10. else{
  11. obj_typeof = typeof(obj);
  12. obj_typeof = obj_typeof.substr(0,1).toUpperCase()+obj_typeof.substring(1,obj_typeof.length);
  13. }
  14. var i=0,n=type.length,pro;
  15. for(i ; i<n;i++){
  16. pro=type[i];
  17. if(obj_typeof && obj_typeof==pro){
  18. return "type = "+pro;
  19. }
  20. if(obj_constructor && obj_constructor==pro){
  21. return "type = "+pro;
  22. }
  23. eval("var t=obj instanceof "+pro+";");
  24. if(t){
  25. return "type = "+pro;
  26. }
  27. }
  28. return "type no found";
  29. }

测试一下,看起来不错喔!!

Example
  1. function parent(){
  2. }
  3. function func(){
  4. }
  5. var p=new parent();
  6. var f=new func();
  7.  
  8. alert(getType(String)); //type = class [String]
  9. alert(getType(Number)); //type = class [Number]
  10. alert(getType(Date)); //type = class [Date]
  11. alert(getType(Array)); //type = class [Array]
  12.  
  13.  
  14. alert(getType("string")); //type = String
  15. alert(getType(5)); //type = Number
  16. alert(getType(5.123)); //type = Number
  17. alert(getType(/[a-z]/)); //type = RegExp
  18. alert(getType([1,2,3])); //type = Array
  19. alert(getType({"t":[1,2]})); //type = Object
  20.  
  21. alert(getType(parent)); //type = class [parent]
  22. alert(getType(func)); //type = class [parent]
  23. alert(getType(p)); //type = Object
  24. alert(getType(f)); //type = Object

网路上看到的,另一种判断变数 type 方式。

Example
  1. function getType2(a) {
  2. var b = typeof a;
  3. if ("object" == b)
  4. if (a) {
  5. if (a instanceof Array) return "array";
  6. if (a instanceof Object) return b;
  7. var c = Object.prototype.toString.call(a);
  8. if ("[object Window]" == c) return "object";
  9. if ("[object Array]" == c || "number" == typeof a.length && "undefined" != typeof a.splice && "undefined" != typeof a.propertyIsEnumerable && !a.propertyIsEnumerable("splice")) return "array";
  10. if ("[object Function]" == c || "undefined" != typeof a.call && "undefined" != typeof a.propertyIsEnumerable && !a.propertyIsEnumerable("call")) return "function"
  11. } else return "null";
  12. else if ("function" == b && "undefined" == typeof a.call) return "object";
  13. return b
  14. }

网页好读版