javascript 值的變數、型別、函數


Posted by NYBOSLA on 2021-01-22

變數

javascript是弱型別的語言,因此變數在宣告時無需指定型別,型別的參考在於值或物件本身。

javascript的型別

分成兩類,第一類為原始型態又稱基本型別(primitive types)、第二類為物件型態(object types),基本型別有 number、string、boolean、null、undefined、symbol,而物件型別就是物件與其子型(subtype),例如:物件、陣列、函式、日期等,要判斷參數型別可以使用typeof<value>

這邊要注意的是,變數沒有型別,變數可在不同時間點持有不同型別的值,因此,只有「值」才有型別。

console.log('typeof true', typeof true)
//輸出 typeof true boolean
typeof 'Hello World!' // 'string'
typeof true // 'boolean'
typeof 1234567 // 'number'
typeof null // 'object'
typeof undefined // 'undefined'
typeof { name: 'Sharon' } // 'object'
typeof Symbol() // 'symbol'
typeof function() {} // 'function'
typeof [1, 2, 3] // 'object'
typeof NaN // 'number'

這邊值得注意的,根據MDN網站列出typeof的回傳值,null的回傳值為boolean,這邊的null可認為是『無物件』(mo object)的特殊物件值 - 根據犀牛書指出。

原始型態

  • 數字
    javascript是[IEEE 754]二進位浮點數算術標準,因此0.1+0.2 === 0.3 //false
    1.整數與小數點
    2.NaN(Not a number)
    使用typeof會顯示typeof(NaN)//Number,因此isNaN(value)
    isNaN(NaN) //true
    isNaN(123) //false
    isNaN("123") //false字串會轉型為數字 
    isNaN("NaN")  //true 字串無法轉型為數字
    
    3.Infinity(無限大)、-Infinity(負無限大)
    正數除以0是無限大,負數除以0是負無限大
  • 字串
    1.透過'' &" "連接,但要注意要連用的話,單引號內不可以在使用單引號,或是雙引號包著再使用雙引號則會出出錯
    2.可以使用跳脫字元(escape character)\
    3.多組字串可以使用 + 來做連接字串
    4.多行字串連接則可以使用\來當作最後連接符號,最後的反斜線後面不可以有任何字元
    var example = '我要加入很多\
    這是第二行 \
    這是第三行 ';
    
    5.ES6新加入了樣版字串連接
    var example = `我是第一行
    我是第二行
    我是第三行
    `
    
    可以使用 ${ }放入變數與運算式
    var str = '一'
    var number1 = 1
    var number2 = 1
    var example = `我是第 ${str}行 `
    我是第 ${number1+number2}行
    
  • 布林
    true & false,通常用於控制程式流程用途。
  • null
    指的是沒有值(no value)
    var a = null
  • undefined
    var b // undefined
    指的是值不存在,舉例:有給變數但沒有賦值。

值得注意的是,這null與undefined若透過boolean()轉型,都會是false,但意義上是有差別的。
undefined是指沒有賦值,因此沒有給值,所以不知道值是什麼。
null是指可能曾經有值或可能沒有值,但現在沒有值。
-symbol

物件型態

  • object
    1.物件寫法
var house = {
    name: "build-A",
    size: [80, 20, 10, 100],
    address: "Taipei",
    resident: {
        name: 'Lin family',
        phone: '06-2222092',
    }
}
var number={
"001":"Lin"
}

console.log(house.name) // "builde-A"
console.log(number.001)  //undefined
console.log(number["001"])  //"Lin"

2.物件存取

console.log(house.name) // "builde-A"
console.log(number.001)  //undefined
console.log(number["001"])  //"Lin"
使用括號語法,可以使用字串,用此方式的好處是,可接受自定義變數,

3.物件新增與刪除
新增

var obj = { };
obj.name ="Object"
obj.name; // "Object"

刪除

delete obj.name
obj.name //刪除之後會變成undefined

4.判斷屬性是否存在

var obj ={ }
console.log(obj.name)

查看是否為undefined,但若是本身屬性就是undefined,則可以使用

var obj ={name:'obj'}
console.log(obj.name)
hasOwnProperty();方法
obj.hasOwnProperty('name)//true

var obj ={name:'obj'}
console.log(obj.name)
in檢查屬性
console.log('name' in obj) //true
  • array
    陣列是資料的集合,通常變數只能放一個值,但陣列可以用變數放很多值,儲存於陣列每個值稱作元素,這些元素的資料型態可以不同,如string、number可以共存。

  • 陣列名稱[索引號]

  • 第一個值從0開始編號..
  • 變數型態為object
  • 方法:
    .pop() and .push() 對陣列的最後一個項目動手腳
    .shift() and .unshift() 對陣列的第一個項目動手腳
    .join() , .concat(), .slice()
    slice(要的第一個物件, 要的最後一個物件+1)
  • 字串也是陣列的一種,可以用陣列的方式處理字串,例如 join()
    map()
    1.陣列寫法
    a.用new來建立
    var a = new array();
    a[0]="apple"
    
    b.巢狀陣列
    let nestedArr = [0, 1, 2, [1, 2]];
    console.log(nestedArr[3]) //[1, 2]
    console.log(nestedArr[3][0]) // 1
    console.log(nestedArr[3][1]) // 2
    
    c.陣列實字
    var a = [];
    a[0] ='apple'
    a[1]='orange'
    a.length = 2
    
    var food = ["apple" , "rice" , "egg" ]
    console.log(food[4] // undefined)
    

函數(function)

function 是物件的子型別,但 typeof function() {} 是得到 function 而非 object,和陣列依舊得到 object 是不一樣的。然而,函式是一種「可呼叫的物件」(callable object),它擁有 [[Call]] 的內部特性,讓它成為能夠被調用的物件。

弔詭的地方

  1. NaN 表示是無效的數字,但依舊還是數字,因此在資料型別的檢測 typeof NaN 結果就是 number,不要被字面上的意思「不是數字」(not a number)給弄糊塗了。另外,NaN 與任何數字運算都會得到 NaN,並且 NaN 不大於、不小於也不等於任何數字,包含 NaN 它自己。









Related Posts

從使用者的角度來看,什麼是 API ?

從使用者的角度來看,什麼是 API ?

JavaScript 陣列操作總整理

JavaScript 陣列操作總整理

HTML - 基本標籤介紹&SEO

HTML - 基本標籤介紹&SEO


Comments