javascrip學習之數據類型和變量

時間 2019-12-11

原文原文鏈接

JavaScript 是腳本語言、是一種輕量級的編程語言、是可插入 HTML 頁面的編程代碼，可由全部的現代瀏覽器執行。

JavaScript的語法和Java語言相似，每一個語句以;結束，語句塊用{......}。可是，JavaScript並不強制要求在每一個語句的結尾加;，瀏覽器中負責執行JavaScript代碼的引擎會自動在每一個語句的結尾補上;。javascript

數據類型：java

一、基本數據類型：
       字符串 String
      數字 Number
      布爾Boolean
二、複合數據類型：
       　數組 Array
          對象 Object
三、特殊數據類型：
          Null 空對象
       Undefined 未定義
web

說明：編程

一、字符串 String
1.1 JS經過字符串類型來表示文本，字符串是以單引號或雙引號括起來的任意文本數組

eg: 'abc'，"張三" 等。。瀏覽器

1.2 轉義字符 ruby

在JavaScript字符串中，反斜線（\）+一個字符不在表示其淺顯的字面含義，列舉幾個經常使用的轉義字符(以下，其餘本身興趣查找)dom

eg: \n 換行符　　\v 垂直製表符
　　 \f 換頁符　　 \r 回車符編程語言

　　 1.3 字符串的使用（自帶功能就是字符串連接 +）
函數

eg: var str = "Hello, "+" world"; //"Hello,world"

1.4 獲得字符串的長度 length

eg: var str = "Hello,world"; alert(str.length) //11

var str1= "Hello, world "； alert(str1.length) //13 空格也包括

注：除length屬性外，還提供了其餘的方法調用。。。經常使用的

              var str = "hello,world";
   　　　　str.charAt(0); //h   第一個字符（下標從0開始） str.charAt(6) //w
   　　　　 str.charAt(str.length-1); //d    獲得最後一個字符元素
   　　　　str.substring(1,4);      //ell 4-1=3獲取3個字符元素（star,end） end-star=num獲取num個字符元素從定義開始的star截取（下標是從0開始算 0,1,2.....） 0=>h, 1=>e
   　　　　str.slice(2,6) // llo, 理論同上，。substring
   　　　　str.slice(-3,-1) //rl 從最後一個往前數，（-star,-end） -end-(-star)=num 從最後一個往前數star(從1開始下標)，而後在從star截取num個數，若是end<star 顯示爲空 eg: (-3,-4) 彈窗爲空內容
   　　　　str.indexOf("l") //2 字符l首次出現的位置（下標從0開始算）
   　　　　str.lastIndexOf("l") //9 字符l最後一次出現的位置（下標從0開始算，空格和符合也算一個字符算）
   　　　　str.split(",") // 把一個字符串分割成字符串數組 ()   //stringObj.split(必填-指定地方分割，可選填--返回截取最大長度)
   　　　　str.replace("l","L") //替換，把l替換成L
   　　　　 str.toUpperCase(); //轉換成大寫
   　　　　str.toLowerCase();   //轉換成小寫

二、數字Number

2.1 整數直接量（用一個數字序列表示一個十進制整數）
eg: 123; // 整數123

注：除十進制的整型直接量，JS一樣能識別十六進制值。十六進制用0x或0X前綴和0-9，(A)a-(F)f之間的字母構成，a~f的字母對應的表示數字10~15。

eg: 0xff //15*16+15 =255, 0xa5b4c3d2

2.2 浮點型直接量(由整數部分、小數點和小數部分組成)

　　　　eg: 123; // 整數123
　　　　　　　　0.456; // 浮點數0.456
　　　　　　　　1.2345e3; // 科學計數法表示1.2345x1000，等同於1234.5
　　　　　　　　-99; // 負數
　　　　　　　　NaN; // NaN表示Not a Number，當沒法計算結果時用NaN表示
　　　　　　　　Infinity; // Infinity表示無限大，當數值超過了JavaScript的Number所能表示的最大值時，就表示爲Infinity

2.3 算術運算(JavaScript使用語言自己提供的算術運算符來進行數字運算)

　　 包括：加法運算符（+）、減法運算符(-)、乘法運算符（*）、除法運算符(/)和求餘運算符（% 除整後的餘數）

　　eg: 1 + 2; 　　// 3
　　　　　　　　(1 + 2) * 5 / 2; 　　// 7.5
　　　　　　　　2 / 0;　　 // Infinity
　　　　　　　　0 / 0; 　　// NaN
　　　　　　　　10 % 3; 　　// 1
　　　　　　　　10.5 % 3; 　　// 1.5

　　注：除基本的運算符外，JavaScript還支持一些複雜的算術運算，他們經過做爲Math對象的屬性定義的函數和常量來實現(舉例經常使用的，還有好多，就不一一列舉)

      　　　　eg:Math.round(.8)   //1 四捨五入
　　　　　　　Math.ceil(.8)   //1 向上求整
　　　　　　　Math.floor(.8) //0 向下求整
         　　　　 Math.abs(-5) //5 求絕對值
          　　　　Math.max(10,15,12) //15 返回最大值
          　　　　Math.min(10,15,12) //10 返回最小值
         　　　　 Math.random() //生成一個0~1之間的隨機數

三、布爾值（true和false）

　　 3.1 &&運算(and)，只有全部都爲true，&&運算結果纔是true,同時知足，只要有一個不知足的就是false,

3.2 ||(或or)運算，只要其中有一個爲true，||運算結果就是true

3.3 !運算是非運算，它是一個單目運算符，把true變成false，false變成true eg: !(2 > 5); // 結果爲true !true; // 結果爲false

3.4 比較運算符，（對Number作比較時，能夠經過比較運算符獲得一個布爾值）

　　2 > 5; // false　　5 >= 2; // true
　　　 false == 0; // true　　 false === 0; // false

　　注意：三種比較運算符：
       　　 3.4.1是==比較，它會自動轉換數據類型再比較，（判斷值是否相等）；
        　　 3.4.2是===比較，它不會自動轉換數據類型，若是數據類型不一致，返回false，若是一致，再比較（判斷值和類型是否一致）
       　　 3.4.3是NaN這個特殊的Number與全部其餘值都不相等
            　　    NaN == NaN //false 　　Not a Number
           　　     能經過isNaN()函數判斷NaN 　　eg: isNaN(NaN); // true

　四、null和undefined

　　　null是JavaScript的關鍵字 null表示一個"空"的值，它和0以及空字符串''不一樣，0是一個數值，''表示長度爲0的字符串，而null表示"空"
　undefined 表示未定義的"空"值，它是變量的一種取值，代表變量沒有初始化；若要查詢的對象屬性或數組元素的值返回undefined時代表這個屬性或元素不存在；若用typof運算符獲得undefined的類型，返回「undefined」

五、數組 Array和對象 Object （簡單講解-會單獨進行詳細說明）

　　　　5.1 數組Array

　　　　　數組是一組按順序排列的集合，集合的每一個值稱爲元素。JavaScript的數組能夠包括任意數據類型。
       　　　　　　 eg: [1, 3.14, 'Hello', null, true]; 該數組包含5個元素。數組用[]表示，元素之間用逗號(,)分隔。
       　　　建立數組的方法:
           　　　　一、經過Array()函數實現： eg: var arr = new Array(1, 2, 3);    // 建立了數組[1, 2, 3]
          　　　　二、使用[] （出於代碼的可讀性考慮，建議使用）數組的元素索引的起始值爲0，從0開始
               　　　　eg: var arr = [1, 2, 3.14, 'Hello', null, true];
               　　　　　　 arr[0]; // 返回索引爲0的元素，即1
               　　　　　　　arr[5]; // 返回索引爲5的元素，即true
              　　　　　　　 arr[6]; // 索引超出了範圍，返回undefined

5.2 對象 Object

　　　　　　JavaScript的對象是一組由鍵-值組成的無序集合，
　　　　　　　　eg: var person = {
   　　　　　　　　　　　　 name: '張三',
    　　　　　　　　　　　　age: 25,
    　　　　　　　　　　　　tags: ['js', 'web', 'mobile'],
    　　　　　　　　　　　　city: 'ShangHai',
　　　　　　　　　　};
　　　　　　JavaScript對象的鍵都是字符串類型，值能夠是任意數據類型。上述person對象一共定義了4個鍵值對，其中每一個鍵又稱爲對象的屬性，例：person的name屬性爲'張三'。
　　　　　　要獲取一個對象的屬性，咱們用對象變量.屬性名的方式：person.name; // '張三'

六、類型轉換

　　JavaScript根據須要可自行轉換類型，一些（真）值轉換爲true，其餘（假）值轉換爲false；若Js想使用一個字符串，給定的值將轉換爲字符串；如轉換的值無心義返回NaN

eg: 10+"obj" //10obj ->數字10轉換爲字符串
　　　　 "5" * "6" //30 ->字符串轉換成數字
　　　　 1-"x" //NaN ->字符串x沒法轉換成數字

　　　　 var a=1-"x";
a + "boj"; //NaNboj ->NaN轉換爲字符串"NaN"

6.1（內置函數）parseInt()和parseFloat() 前者把值轉換成整數，後者把值轉換成浮點數

　　　　parseInt()方法首先查看位置開頭字符，判斷它是不是個有效數字；若是不是，該方法將返回NaN，再也不繼續執行其餘操做。但若是該字符是有效數字，依次日後排查直到發現非有效數字的字符爲止，此時parseInt()將把該字符以前的字符串轉換成數字

　　　　　eg：   parseInt("12a34b");   // 12
　　　　　　　　parseInt("20.5");   // 20
　　　　　　　　parseInt("abc");   // NaN

　　　　parseFloat()方法與parseInt()方法的處理方式類似，首先查看位置開頭字符，直到找到第一個非有效的字符爲止，而後把該字符以前的字符串轉換成數字。對於這個方法來講，第一個出現的小數點是有效字符。若是有兩個或多個小數點，第二個及後面的小數點將被看做無效的

　　　　eg：parseFloat("12ab0") // 12
　　　　　　　parseFloat("20.5")   // 20.5
　　　　　　　 parseFloat("abc");   // NaN
   　　　　　　 parseFloat("12.56.34") //12.56
   　　　　　　 parseFloat("0101") // 101

6.2 強制類型轉換

　　　 Boolean(value)--把給定的值轉換成Boolean型；
　　　　Number(value)--把給定的值轉換成數字（能夠是整數或浮點數）；
　　　　String(value)--把給定的值轉換成字符串
　　　　//Object(value)--不經過new調用時會把類型轉換成函數
　　　Boolean()當要轉換的值是至少有一個字符的字符串、非0數字或對象時，Boolean()函數將返回true。若是該值是空字符串、數字0、undefined或null，它將返回false
    　　　　eg：Boolean("");   //false          Boolean("abc");   //true
　　　　　　   Boolean(20);   //true 　　 Boolean(null);   //false
   Boolean(0);   //false 　　　Boolean(new Object());   //true

       　　 引用：向布爾型轉換
    　　　　　　undefined值：轉換成"false。
   　　　　　　null值：轉換成false。
   　　　　　　字符串值：若是字符串爲空字符串，返回false；不然返回true。
    　　　　　　數字型值：若是數字爲0或NaN，返回false。；不然返回true。
    　　　　　　其餘對象：老是返回true

　 Number()的強制類型轉它轉換的是整個值，而不是部分值

　　　　 eg： Number(false)   //0　　　　　　　Number(true)   //1
　　　　　　 Number(undefined)   //NaN　　 Number(null)   //0
　　　　　　 Number( "5.5 ")   //5.5　　　　 Number( "56 ")   //56
　　　　　　 Number( "5.6.7 ") // NaN   　　   Number(new Object())   //NaN

　　　　 引用：向數字型轉換

　　　　　　　　undefined值：轉換成NaN。
　　　　　　　　null值：轉換成0.
　　　　　　　　布爾值：值爲true，轉換成1；值爲false，轉換成0.
　　　　　　　　字符串值：若是字符串是數字形式，轉換成數字，不然轉換成NaN。
　　　　　　　　其餘對象：轉換成NaN

　　 String() 可把任何值轉換成字符串。要執行這種強制類型轉換，只須要調用做爲參數傳遞進來的值的 toString()方法，即把1轉換成 "1 "，把true轉換成 "true "，把false轉換成 "false "。

　　　　引用：向字符串轉換
　　　　　　undefined值：轉換成"undefined"。
　　　　　　　null值：轉換成"null".
　　　　　　　布爾值：值爲true，轉換成"true"；值爲false，轉換成"false".
　　　　　　　數字型值：NaN或數字型變量的完整字符串。
　　　　　　其餘對象：若是該對象的toString()方法存在，則返回toString方法的返回值，不然返回undefined

七、變量

7.1 變量聲明 變量不只能夠是數字，還能夠是任意數據類型，使用關鍵字var聲明

　　　　　　 var a; // 聲明瞭變量a 未賦值，此時a的值爲undefined
　　　　　　　　var b = 1; // 聲明瞭變量b，同時給值，值爲1
　　　　　　　　var c = '007'; // c是一個字符串
　　　　　　　　var An = true; // An是一個布爾值true
　　　　　　　　var ta = null; // ta的值是null

　　　　　　　　var i,sum; //聲明多個變量 var i=0, j=0, k=1; //初始化賦值能夠和在一塊兒寫，用逗號（，）隔開

　　　　　　7.2 變量做用域
          　　　　全局變量：全局變量擁有全局做用域，在JS的任何地方都有定義能夠運用
           　　　　局部變量：在函數內聲明的變量只在函數體內有定義，既是局部變量，只在函數體內有定義運用
          　　　　　　注：在函數體內，局部變量優先級高於同名的全局變量（帶有的變量和全局變量重名，全局被局部變量覆蓋）
           　　　　　　 eg:　 var score = "global"; //聲明一個全局變量
                　　　　　　　　function checkscope(){
                   　　　　　　　　　　var score = "local"; //聲明一個同名的局部變量
                   　　　　　　　　　　alert (score);    //返回局部變量的值
               　　　　　　　　 }
               　　　　　　　　checkscope()   //local

　　　　　　　　　　　　function test(){
       　　　　　　　　　　　　 var i = 0;   //i在整個函數體內均有定義
       　　　　　　　　　　　　for(var k=0; k<6; k++){
           　　　　　　　　　　　　　　var j = 1; //在函數體內有定義
           　　　　　　　　　　　　　　 console.log(k);   //輸出 0~5
       　　　　　　　　　　　　 }
       　　　　　　　　　　　　 console.log(k);    //輸出 6
       　　　　　　　　　　　　 console.log(j)   //輸出1
   　　　　　　　　　　 }
   　　　　　　　　　　 test()

一些小題：

    　　　一、var a =101;
   　　　　function test(){
      　　　　　　alert(a);　　// undefined 若是下面不定義var=100 彈出101
       　　　　　　var a =100;
       　　　　　　alert(this.a);　　//101 this全局window ，若是函數體外沒定義 var =101, 結果爲undefined
       　　　　　　var a;
       　　　　　　alert(a);　　//100   函數體內a初始化賦值
   　　　　 }
   　　　　 test();

              二、 var a =101;
   　　　　 function test(){
      　　　　　　alert(a);　　// 101
       　　　　　　 a =100;
       　　　　　　alert(a) 　　//100   函數體內a初始化賦值
   　　　　}
   　　　　alert(a); 　　//100 全局變量
   　　　　 test();

              三、 var arr=[11<12<13,13<12<11];
   　　　　 console.info(arr);   //[true, true]

   　　　　var arr1="1 2 3";
   　　　　 var arr11="0.8,1.2,3";
   　　　　console.info(parseInt(arr1)); 　　//1
   　　　　 console.info(parseInt(arr11));　　 //0

   　　　　 var arr2=[]==[];
   　　　　 console.info(arr2); 　　//false;   []==![] 　　//true

   　　　　 var a=[1,2,3];
   　　　　 var b=[1,2,3];
   　　　　c=[1,2,4];
   　　　　console.info(a==b); 　　//false 單獨的2個數組不能比較   a===b //false
   　　　　console.info(a>c); 　　 //false    a<c //true

   　　　　var one=0.1;
   　　　　 var two=0.2;
   　　　　var six=0.6;
   　　　　var eight=0.8;
   　　　　 console.info(two-one==one); 　　//true
   　　　　console.info(eight-six==two); 　　 //false    //0.20000000000000007

   function show(value){
       switch(value){
           case "A":
                console.log("Case A");
               break;
           case "B":
                console.log("Case B");
               break;
           default:
                console.log("Nothing");
       }
   }
   //console.info(show("A"));   //Case A   undefined
   //console.info(show(new String("A")));   //Nothing     undefined

    var x=1;
    var y=1;
    method(8);
    console.info(x+y); //   5
    function method(y){
       x+=3;   //x=x+3   = 4
       y+=3;   //y=y+3   =11
       console.info(x+y);   // 15 先執行
   } // 15    5

未完待續。。。簡單學習一塊兒討論，共同進步，學習只是無止境。。有補充，失誤隨時聯繫！進步的小白

借鑑學習：http://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000