zoukankan      html  css  js  c++  java

  • JavaScript学习笔记（五）——类型、转换、相等、字符串

    第六章 类型 相等 转换等

     一、类型

    1 typeof();

    typeof是一个内置的JavaScript运算符，可用于探测其操作数的类型。

    例：

     1 <script language="JavaScript" type="text/JavaScript">
 2 
 3 var test1="abcdef";                                        //string
 4 
 5 var test2=123;                                                //number
 6 
 7 var test3=true;                                                //boolean
 8 
 9 var test4={};                                                //object
10 
11 var test5=[];                                                //object
12 
13 var test6;                                                //undefined
14 
15 var test7={"asdf":123};                                //object
16 
17 var test8=["asdf",123];                                //object
18 
19 function test9(){return "asdfg"};        //function
20 
21  
22 
23 console.log(typeof test1);//string
24 
25 console.log(typeof test2);//number
26 
27 console.log(typeof test3);//boolean
28 
29 console.log(typeof test4);//object
30 
31 console.log(typeof test5);//object
32 
33 console.log(typeof test6);//undefined
34 
35 console.log(typeof test7);//object
36 
37 console.log(typeof test8);//object
38 
39 console.log(typeof test9);//function
40 
41 </script>

    2 undefined

    说明：对于任何还没有值（即未初始化）的东西，都会将undefined赋给它；undefined的类型是undefined

    【未初始化的变量、访问不存在或已删除的属性、使用不存在的数组元素】

    优点：undefined让你能够判断是否给变量（属性、数组元素）赋值了

    应用：

     1 //变量
 2 
 3 var x;
 4 
 5 if(x==undefined)
 6 
 7 {
 8 
 9 处理程序;
10 
11 }
12 
13 //对象的属性
14 
15 var customer={
16 
17 name:"Jenny"
18 
19 };
20 
21 if(customer.phonenumber==nudefined)
22 
23 {
24 
25 处理程序
26 
27 }

    3 null

    说明：表示没有对象可以赋给变量；

    与undefined对比：undefined：在变量未初始化、对象没有指定属性、数组没有指定元素；

         null：在应该提供一个对象，但无法创建或找到时；

    再次说明：返回null未必意味着出现了问题，这可能只是意味着有什么东西不存在，需要创建它或可以忽略它。

    例：

    1 var weather=document.getElementById("weatherDiv");
2 
3 if(weather!=null)
4 
5 {
6 
7 //为div元素weather创建内容
8 
9 }

    4 NaN

    说明：不是数字的数字【它的类型为number】，表示 0/0 等不可以被表示的数字，

    *是一个数字，只是无法表示；

    *NaN！=NaN 【sqrt(-1)与sqrt(-2)】；

    *判断函数是isNaN();返回值为布尔类型；

    *向isNaN()传递一个不能转换为数字的字符串时返回true；

    *typeof null返回值为object【与说明相对应】

    *NaN与Infinity区别：Infinity是指任何超过浮点数上限1.7976931348623157E+1.038的值，

    （-Infinity是小-1.7976931348623157E+1.038）

    二、 相等

    1 理解相等

    如果两个值类型相同，就直接进行比较；

    如果两个值类型不同，就尝试将他们转换为相同的类型再进行比较；

    返回值：相等true不等false

    2 相等运算符转换操作数：

    *比较数字和字符串，将字符串转换为数字，(如将“99”转换为 99 )；如果不能转换为数字则转换为NaN

    *比较布尔类型和其他类型，将布尔中true=1，false=0；

    *undefined==null；

    *""空字符串转换为数字0；

    拓：严格相等：===【类型和值都相等】

    没有<==和>==但是有!===

    应用："true"==true;//返回false因为签前面为字符串后边布尔转换为数字

      "banana"<"melon";//返回true，因为按照字母排列顺序Unicode排序，开头b<m,拓M<m

    三、类型转换

    1 涉及转换的运算符

    ·        +  数字遇到字符串，将数字转换为字符串；如1+2+"pizzas"="3 pizzas";1+(2+"pizzas")="12 pizzas";true转换为字符串

    ·        *数字遇到字符串，将字符串转换为数字

    ·        /数字遇到字符串，将字符串转换为数字

    ·        - 数字遇到字符串，将字符串转换为数字

    四、 判断两个对象是否相等

    ·        运算符：==和===等价

    ·        意义：检查两个对象变量是否相等时，比较的是指向对象的引用，仅当两个引用指向的是同一个对象时，他们才相等；

    ·        例：

      1 <!doctype html>
  2 
  3 <html lang="en">
  4 
  5 <head>
  6 
  7 <title>look for car</title>
  8 
  9 <meta charset="utf-8">
 10 
 11 <style type="text/css">
 12 
 13  
 14 
 15 </style>
 16 
 17 <script language="JavaScript" type="text/JavaScript">
 18 
 19 function findCarInLot(car)
 20 
 21 {
 22 
 23 for(var i=0;i<lot.length;i++)
 24 
 25 {
 26 
 27 if(car===lot[i])//== 一样
 28 
 29 return i+1;
 30 
 31 }
 32 
 33 return -1;
 34 
 35 }
 36 
 37 var chevy={
 38 
 39 make:"Chevy",
 40 
 41 model:"Bel Air"
 42 
 43 };
 44 
 45 var taxi={
 46 
 47 make:"Webville Motors",
 48 
 49 model:"Taxi"
 50 
 51 };
 52 
 53 var fiat1={
 54 
 55 make:"Fiat",
 56 
 57 model:"500"
 58 
 59 };
 60 
 61 var fiat2={
 62 
 63 make:"Fiat",
 64 
 65 model:"500"
 66 
 67 };
 68 
 69  
 70 
 71 var lot=[chevy,taxi,fiat1,fiat2];
 72 
 73 var loc1=findCarInLot(taxi); //2
 74 
 75 var loc2=findCarInLot(fiat1);//3
 76 
 77 var loc3=findCarInLot(chevy);//1
 78 
 79 var loc4=findCarInLot(fiat2);//4
 80 
 81  
 82 
 83 console.log(loc1);//2
 84 
 85 console.log(loc2);//3
 86 
 87 console.log(loc3);//1
 88 
 89 console.log(loc4);//4
 90 
 91 </script>
 92 
 93 </head>
 94 
 95 <body>
 96 
 97 <h1>Look for cars in the parking lot</h1>
 98 
 99 </body>
100 
101 </html>

    五 、真值和假值

    ·        说明：在JavaScript中有些值并非true和false但是用于条件表达式中时被视为true和false。

    ·        记住五个假值，其余就是真值：undefined null 0 空字符串 NaN

    例如：if([]){//代码;}中[] 表示数组为真值

    六 、字符串

    ·        前奏：每种类型都归属两个阵营之一，基本类型和对象；

    ·        字符串/数字/布尔也可以是既有基本类型又是对象，但是后两者的属性和方法较前一者少很多；

    ·        string属性和方法介绍：

    ·        属性str.length:返回字符串的长度即字符个数；

    ·        方法str.charAt():参数范围是0-长度-1 的整数，返回为该索引的字符；

    ·        方法str.indexOf("cat");返回第一个cat中c的索引；

    str.indexOf("the",5);从索引为5开始搜索，返回the中t的索引；

    如果没有找到返回-1；

    ·        方法str.substring(5,10);返回索引5（包括）到10（不包括）之间的字符串；

    substring(5);返回从索引5到字符串结尾的字符串；

    ·        方法str.slice(5,7);删除字符串的一部分并返回结果；和substring返回结果相同

    ·        方法str.split("|");返回以|为界分隔的字符串数组；

    ·        方法str.toLowerCase();返回将字符串的所有大写转换成小写；

    ·        方法str.toUpperCase();返回将字符串中的所有小写转换成大写；

    ·        方法str.concat(str2);返回将str2拼接在str后的字符串；参数可以是多个即继续向后拼接；

    ·        方法str.replace("fgh","12");查找子串fgh并替换成另外一个字符串12；

    ·        方法str.lastIndexOf();与indexOf类似但是查找最后一个子串；

    str="asd,fgh,jkfg  ";str3=str.lastIndexOf("fg",4);//返回4

    str="asd,fgh,jkfg  ";str3=str.lastIndexOf("fg");//返回10

    ·        方法match：在字符串中查找与正则表达式匹配的子串

     1 <script type="text/javascript">
 2 
 3  
 4 
 5 var str="Hello world!"
 6 document.write(str.match("world") + "<br />")
 7 document.write(str.match("World") + "<br />")
 8 document.write(str.match("worlld") + "<br />")
 9 document.write(str.match("world!"))
10 
11 </script>

    输出：

    world
    null
    null
    world!

    ·        方法str.trim()：删除字符串开头和末尾的空白字符；

    七、举个栗子：

      1 <!doctype html>
  2 
  3 <html lang="en">
  4 
  5 <head>
  6 
  7 <title>Check phone number</title>
  8 
  9 <meta charset="utf-8">
 10 
 11 <style type="text/css">
 12 
 13  
 14 
 15 </style>
 16 
 17 <script language="JavaScript" type="text/JavaScript">
 18 
 19 //要求检验7位数字的电话号，中间第四位-可有可无
 20 
 21 //方法一：
 22 
 23 function validate1(phonenumber)
 24 
 25 {
 26 
 27 if(phonenumber.length>8||phonenumber.length<7)
 28 
 29 return false;
 30 
 31 for(var i=0;i<phonenumber.length;i++)
 32 
 33 {
 34 
 35 if(i==3)
 36 
 37 {
 38 
 39 if(phonenumber.length===8&&phonenumber.charAt(i)!=='-')
 40 
 41 return false;
 42 
 43 else if(phonenumber.length==7&&isNaN(phonenumber.charAt(i)))
 44 
 45 return false;
 46 
 47 }
 48 
 49 else if(isNaN(phonenumber.charAt(i)))
 50 
 51 return false;
 52 
 53 }
 54 
 55 return true;
 56 
 57 }
 58 
 59 //方法二：还有bug吗？
 60 
 61 function validate2(phonenumber)
 62 
 63 {
 64 
 65 if(phonenumber.length>8||phonenumber.length<7)
 66 
 67 return false;
 68 
 69 var first=phonenumber.substring(0,3);
 70 
 71 var second=phonenumber.substring(phonenumber.length-4);
 72 
 73 if(isNaN(first)||isNaN(second))
 74 
 75 return false;
 76 
 77 if(phonenumber.length===8)
 78 
 79 return (phonenumber.charAt(3)=='-');
 80 
 81 return true;
 82 
 83 }
 84 
 85 //方法三：正则表达式
 86 
 87 function validate3(phonenumber)
 88 
 89 {
 90 
 91 return phonenumber.match(/^d{3}-?d{4}$/);
 92 
 93 }
 94 
 95  
 96 
 97 var str1="6724025";
 98 
 99 var str2="672-4254";
100 
101 var str3="72554896"
102 
103 console.log(validate1(str1));
104 
105 console.log(validate2(str2));
106 
107 console.log(validate3(str3));
108 
109 </script>
110 
111 </head>
112 
113 <body>
114 
115 <h1>Verify that the phone number is correct</h1>
116 
117 </body>
118 
119 </html>

     
  • 相关阅读:
    前端开发——HTML学习笔记
    前端开发——HTML学习笔记
    前端开发——HTML学习笔记
    日记2018/1/4
    物联网概念
    安卓常见英文缩写的全拼
    快速排序和计数排序API
    Hash表API
    栈/队列API（push和pop）
    链表API实现(插入，删除，查找)
  • 原文地址：https://www.cnblogs.com/weimingai/p/10350312.html
Copyright © 2011-2022 走看看