JavaScript數據類型詳解

字符串

多行字符串

• 使用\n

• ES6標準使用:反引號

  `這是一個
  多行字符串`

模板字符串

• 使用+

  var name = '小明';
  var age = 20;
  var message = '你好, ' + name + ', 你今年' + age + '歲了!';

   

• ES6標準使用:

  var name = '小明';
  var age = 20;
  var message = `你好, ${name}, 你今年${age}歲了!`;

   

字符串操做

• 索引取值

  var s = 'Hello, world!';
  s[0]; // 'H'
  s[6]; // ' '

   

• 獲取長度

  var s = 'Hello, world!'; 
  s.length; // 13

   

• 大寫

  var s = 'Hello';
  s.toUpperCase(); // 返回'HELLO'

   

• 小寫

  var s = 'Hello';
  var lower = s.toLowerCase(); // 返回'hello'並賦值給變量lower

   

• 獲取位置索引

  var s = 'hello, world';
  s.indexOf('world'); // 返回7

   

• 切割子字符串

  var s = 'hello, world'
  s.substring(0, 5); // 從索引0開始到5(不包括5)，返回'hello' 
  s.substring(7); // 從索引7開始到結束，返回'world'

   

   

數組

JavaScript的Array能夠包含任意數據類型，並經過索引來訪問每一個元素。

數組操做

• 數組長度

  var arr = [1, 2, 3.14, 'Hello', null, true]; 
  arr.length; // 6

   

• 數組長度賦值

  // 請注意，直接給Array的length賦一個新的值會致使Array大小的變化:
  var arr = [1, 2, 3];
  arr.length; // 3
  arr.length = 6;
  arr; // arr變爲[1, 2, 3, undefined, undefined, undefined] 
  arr.length = 2;
  arr; // arr變爲[1, 2]

   

• 索引賦值

  var arr = [1, 2, 3];
  arr[5] = 'x';
  arr; // arr變爲[1, 2, 3, undefined, undefined, 'x']
  // 若是經過索引賦值時，索引超過了範圍，一樣會引發Array大小的變化

   

• 數組元素索引

  var arr = [10, 20, '30', 'xyz']; 
  arr.indexOf(20); // 元素20的索引爲1 
  arr.indexOf(30); // 元素30沒有找到，返回-1

   

• 數組切割

  var arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G'];
  arr.slice(0, 3); // 從索引0開始，到索引3結束，但不包括索引3: 
  ['A', 'B', 'C'] arr.slice(3); // 從索引3開始到結束: ['D', 'E', 'F', 'G']
  // 若是不給slice()傳遞任何參數，它就會從頭至尾截取全部元素。利用這一點，咱們能夠很容易地複製一個Array

   

• push和 和 pop

  push()向Array的末尾添加若干元素，pop()則把Array的最後一個元素刪除掉:
  var arr = [1, 2];
  arr.push('A', 'B'); // 返回Array新的長度: 4
  arr; // [1, 2, 'A', 'B']
  arr.pop(); // pop()返回'B'
  arr; // [1, 2, 'A']
  // 空數組繼續pop不會報錯，而是返回undefined

   

• unshift和 shift

  若是要往Array的頭部添加若干元素，使用unshift()方法，shift()方法則把Array的第一個元素刪掉:
  var arr = [1, 2];
  arr.unshift('A', 'B'); // 返回Array新的長度: 4
  arr; // ['A', 'B', 1, 2]
  arr.shift(); // 'A'
  // 空數組繼續shift不會報錯，而是返回undefined

   

• 排序

  sort()能夠對當前Array進行排序，它會直接修改當前Array的元素位置，直接調用時，按照默認順序排序:
  var arr = ['B', 'C', 'A']; arr.sort();
  arr; // ['A', 'B', 'C']
  
  reverse()把整個Array的元素給反轉:
  var arr = ['one', 'two', 'three']; arr.reverse();
  arr; // ['three', 'two', 'one']

   

• 數組修改

  splice()方法是修改Array的「萬能方法」，它能夠從指定的索引開始刪除若干元素，而後再從該位置添加若干元素:
  var arr = ['Microsoft', 'Apple', 'Yahoo', 'AOL', 'Excite', 'Oracle'];
  // 從索引2開始刪除3個元素,而後再添加兩個元素:
  arr.splice(2, 3, 'Google', 'Facebook'); // 返回刪除的元素 ['Yahoo', 'AOL', 'Excite'] 
  arr; // ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle']
  // 只刪除,不添加:
  arr.splice(2, 2); // ['Google', 'Facebook']
  arr; // ['Microsoft', 'Apple', 'Oracle']
  // 只添加,不刪除:
  arr.splice(2, 0, 'Google', 'Facebook'); // 返回[],由於沒有刪除任何元素 
  arr; // ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle']

   

• 數組合並

  concat()方法把當前的Array和另外一個Array鏈接起來，並返回一個新的Array:
  var arr = ['A', 'B', 'C'];
  var added = arr.concat([1, 2, 3]); 
  added; // ['A', 'B', 'C', 1, 2, 3] 
  arr; // ['A', 'B', 'C']
  請注意，concat()方法並無修改當前Array，而是返回了一個新的Array。

   

• join

  join()方法是一個很是實用的方法，它把當前Array的每一個元素都用指定的字符串鏈接起來，而後返回鏈接後的字符 串:
  var arr = ['A', 'B', 'C', 1, 2, 3]; 
  arr.join('-'); // 'A-B-C-1-2-3'
  若是Array的元素不是字符串，將自動轉換爲字符串後再鏈接。

   

   

對象

JavaScript的對象是一種無序的集合數據類型，它由若干鍵值對組成。

var person = { 
  name: '小明', 
  birth: 1990,
  'middle-school': 'No.1 Middle School', 
  height: 1.70,
  weight: 65,
  score: null
};

 

對象的屬性

訪問屬性是經過.操做符完成的，但這要求屬性名必須是一個有效的變量名。若是屬性名包含特殊字符，就必須用''括 起來:

 person.name; // '小明' 

 

屬性名middle-school不是一個有效的變量，就須要用''括起來。訪問這個屬性也沒法使用.操做符，必須 用['xxx']來訪問:

xiaohong['middle-school']; // 'No.1 Middle School' 

 

實際上JavaScript對象的全部屬性都是字符串，不過屬性對應的值能夠是任意數據類型。若是訪問一個不存在的屬性會返回什麼呢? JavaScript規定，訪問不存在的屬性不報錯，而是返回undefined

更改對象的屬性

因爲JavaScript的對象是動態類型，你能夠自由地給一個對象添加或刪除屬性:

person.age = 18; // 新增一個age屬性
delete person.age; // 刪除age屬性
delete person.school; // 刪除一個不存在的school屬性也不會報錯

 

判斷屬性存在

若是咱們要檢測person是否擁有某一屬性，能夠用in操做符:

'name' in person; // true 
'grade' in person; // false

 

不過要當心，若是in判斷一個屬性存在，這個屬性不必定是person的，它多是person繼承獲得的:

'toString' in preson; // true

 

由於toString定義在object對象中，而全部對象最終都會在原型鏈上指向object，因此person也擁有toString屬 性。 要判斷一個屬性是不是其自身擁有的，而不是繼承獲得的，能夠用hasOwnProperty()方法:

person.hasOwnProperty('name'); // true 
person.hasOwnProperty('toString'); // false