JavaScript基礎(chǔ)

vspiders 發(fā)布于2019-08-26 13:32 / 1890人閱讀

摘要：基礎(chǔ)標(biāo)識(shí)符所謂的標(biāo)識(shí)符就是指變量函數(shù)屬性的名字，或者函數(shù)的參數(shù)。原始數(shù)組不會(huì)被改變。刪除或替換現(xiàn)有元素來(lái)修改數(shù)組并以數(shù)組形式返回被修改的內(nèi)容。否則返回返回在數(shù)組中可以找到一個(gè)給定元素的第一個(gè)索引，如果不存在，則返回。

Javascript基礎(chǔ) 標(biāo)識(shí)符

所謂的標(biāo)識(shí)符,就是指變量、函數(shù)、屬性的名字，或者函數(shù)的參數(shù)。標(biāo)識(shí)符主要有以下規(guī)則：

首字符必須是字母、下劃線_或者美元符$

其他字符可以是字母、下劃線_、美元符$或者數(shù)字

標(biāo)識(shí)符的命名遵循駝峰命名，即myCar

用var操作符定義的變量將成為定義該變量的作用域中的局部變量.也就是說(shuō),如果在函數(shù)中使用var定義一個(gè)變量,那么這個(gè)變量在函數(shù)退出后就會(huì)被銷毀,如:

function test() {
  var message = "hi";
}
test();
console.log(message); //錯(cuò)誤

a = 5 // 省略var操作符,創(chuàng)建的是一個(gè)全局變量

javascript數(shù)據(jù)類型

基本數(shù)據(jù)類型: number, string, boolean, undefined, symbol, null

復(fù)雜數(shù)據(jù)類型: object (三種引用類型: function, arrary, object)

特殊值: NaN, undefined, null

NaN有以下兩個(gè)特點(diǎn):

1.任何涉及NaN的操作都會(huì)返回NaN,包括NaN/0 // NaN.

2.NaN與任何值都不相等,包括NaN本身,NaN==NaN // false.

鑒于上面兩點(diǎn),判斷一個(gè)變量是否是NaN需要使用javascript提供的isNaN()方法,例: NaN.isNaN() // true

undefined聲明但是沒有初始化的變量的值即為undefined,可以理解為此處應(yīng)該有一個(gè)值,但是實(shí)際上沒有,我們給它一個(gè)默認(rèn)值undefined

// 聲明的變量
var a; //相當(dāng)于var a=undefined;
console.log(typeof a); //undefiend

// 注意一下未聲明的變量會(huì)直接報(bào)錯(cuò)的
console.log(b); //!報(bào)錯(cuò) b is not defined

null是表示缺少的標(biāo)識(shí)，指示變量未指向任何對(duì)象，如果定義的變量準(zhǔn)備在將來(lái)用于保存對(duì)象時(shí)，那么最好將變量初始化為null

typeof操作符返回一個(gè)字符串，表示未經(jīng)計(jì)算的操作數(shù)的類型

let s = Symbol
typeof 5 ---------> number
typeof NaN -------> number
typeof "a" -------> string
typeof true ------> boolean
typeof undefined -> undefined
typeof s ---------> symbol

let fn = function() {}
typeof null ------> object
typeof [] --------> object
typeof {} --------> object
typeof fn --------> function

instanceof運(yùn)算符用于測(cè)試構(gòu)造函數(shù)的prototype屬性是否出現(xiàn)在對(duì)象的原型鏈中的任何位置

基本類型使用字面量賦值,使用instanceof并不能判斷其變量類型,因?yàn)樽置媪烤褪俏覀兯姷降淖址?沒有調(diào)用構(gòu)造函數(shù),也就不能在原型上找到

let a = 5
a instanceof Number // false

let b = false
b instanceof Boolean // false

let c = Symbol
c instanceof Symbol // false

但是復(fù)雜類型使用字面量賦值時(shí),往往能判斷其變量類型,這是因?yàn)樵?b>js中根本不存在真正的空對(duì)象，即使是最簡(jiǎn)單的{}對(duì)象也會(huì)包含從Object.prototype繼承而來(lái)的屬性和方法

let obj = {}
obj instanceof Object // true
[] instanceof Array // true

// 注意
null instanceof Object // false

javascript常用方法

所有的對(duì)象都有toLoacleString(),toString(),valueOf()

# 1.Number
    number.isNaN() // 判斷是否是NaN
    number.toFixed(2) // 保留小數(shù)點(diǎn)后兩位
    number.toString() // 將數(shù)字轉(zhuǎn)換成字符串
    
    Number可以配合Math對(duì)象來(lái)使用
    Math.random() // 隨機(jī)取0-1的數(shù)
    Math.abs(number) // 取絕對(duì)值
    Math.round(number) // 四舍五入
    Math.floor(number) // 向下取整
    Math.ceil(number) // 向上取整
    
# 2.String
    string.replace(searchValue, replaceValue) // 找到searchValue,只會(huì)在第一次的時(shí)候換成replaceValue,searchValue可以是正則表達(dá)式
    "abcda".replace("a", "b") // "bbcda"
    "abcda".replace(/a/g,"b") // "bbcdb"
    
    string.slice(start, end) // 從索引start到end的字符串,end可以為負(fù)數(shù),負(fù)數(shù)表示倒數(shù) 
    "abcd".slice(0,3) //"abc"
    "abcd".slice(0,-1) //"abc"
    
    string.split(".") // 以.分割字符串,結(jié)果為一個(gè)數(shù)組[] 
    "192.168.1.0".split(".") // ["192", "168", "1", "0"]
    
# 3.Array
    Array.isArray(arr) // 檢測(cè)數(shù)組 true/false
    
    arr.concat() 方法用于連接兩個(gè)或多個(gè)數(shù)組
    array.join(".") // 將數(shù)組的每一項(xiàng)轉(zhuǎn)換成字符串,并用.連接
    ["192", "168", "1", "0"].join(".") // "192.168.1.0"
    
    let arr = [1, 2, 3, 4] // 以下arr默認(rèn)都是 [1, 2, 3, 4] 后進(jìn)先出叫棧,先進(jìn)先出叫堆
    
    arr.slice(0,2) //[1,2] 返回一個(gè)新的數(shù)組對(duì)象，這一對(duì)象是一個(gè)由 begin和 end（不包括end）決定的原數(shù)組的淺拷貝。原始數(shù)組不會(huì)被改變。
    
    arr.splice(start, number, addItem) // 刪除或替換現(xiàn)有元素來(lái)修改數(shù)組,并以數(shù)組形式返回被修改的內(nèi)容。此方法會(huì)改變?cè)瓟?shù)組。
    arr.splice(0, 2, 3) // [3, 3, 4] // 從索引為0的位置刪除兩項(xiàng)(1,2),并插入一項(xiàng)(3)
    
    // 棧方法
    arr.unshift(0) // arr變成了[0, 1, 2, 3, 4],  修改數(shù)組長(zhǎng)度,將0放到了數(shù)組的第一項(xiàng)
    arr.pop() // 3 修改數(shù)組長(zhǎng)度,移除數(shù)組的最后一項(xiàng)并返回 arr變成了[1, 2, 3]
    
    // 堆方法
    arr.shift() // 1 修改數(shù)組長(zhǎng)度,數(shù)組的第一項(xiàng)并返回 arr變成了[2, 3, 4]
    arr.push(5) // arr變成了[1, 2, 3, 4, 5], 修改數(shù)組長(zhǎng)度,將5放到了數(shù)組的最后一項(xiàng)
    
    // 重排序
    arr.sort() // 首字符排列
    arr.sort((a,b) => a-b) // a-b從小到大, b-a從大到小
    
    arr.reverse() // 順序顛倒
    
    arr.filter(item => item >= 2) // [3, 4], 過(guò)濾數(shù)組元素生產(chǎn)新的數(shù)組,,不改變?cè)瓟?shù)組
    
    // react 常用
    arr.map(item => item+1 ) //[2, 3, 4, 5] 對(duì)數(shù)組中的每個(gè)元素進(jìn)行處理，得到新的數(shù)組,不改變?cè)瓟?shù)組
    arr.map((item,index) => {item}) //react中常用, jsx語(yǔ)法
    
    arr.findIndex(item => item > 2) //2 返回?cái)?shù)組中滿足提供的測(cè)試函數(shù)的第一個(gè)元素的索引。否則返回-1
    
    arr.indexOf(item => item === 1) //0 返回在數(shù)組中可以找到一個(gè)給定元素的第一個(gè)索引，如果不存在，則返回-1。

更多方法請(qǐng)參考: MDN

javascript語(yǔ)法

==/!=先轉(zhuǎn)換再比較(強(qiáng)制轉(zhuǎn)型) ===/!==僅比較不轉(zhuǎn)換

null == undefined; //true 它們是類似的值
null === undefined; //false 它們是不同類型的值

條件操作符又稱三元運(yùn)算符

let max = (num1>num2) ? num1 : num2

當(dāng)判斷一個(gè)范圍時(shí)請(qǐng)使用if語(yǔ)句

var scroe = 80
if(scroe >= 90) {
    console.log("成績(jī)?yōu)閮?yōu)");
}else if(scroe >= 80) {
    console.log("成績(jī)?yōu)榱?)
}else if(scroe >= 60) {
    console.log("成績(jī)?yōu)榧案?)
}else {
    console.log("成績(jī)?yōu)椴患案?);
}

在對(duì)比有限個(gè)值時(shí),值不能太多,一般在1-4之間,使用switch語(yǔ)句

switch(m) {
    case x:
        //語(yǔ)句
        break;
    case y: 
        //語(yǔ)句
        break;
    default:
        //語(yǔ)句
        break;
}

循環(huán)次數(shù)已知,選擇for循環(huán)

for(初始化條件表達(dá)式;條件表達(dá)式;條件改變表達(dá)式) {
    //循環(huán)體
}

循環(huán)次數(shù)未知,但是循環(huán)結(jié)束條件已知選擇while語(yǔ)句

while(條件表達(dá)式) {
    //循環(huán)體
}

循環(huán)體至少執(zhí)行一次時(shí),選擇do while語(yǔ)句例如:要先考試才能知道是否及格

do{
    //循環(huán)體
}while(條件表達(dá)式)

var score = 48;
do {
    console.log("沒及格,需要再來(lái)考試!");
    score += 15;
} while (score < 60);

break 直接跳出循環(huán)

var num = 0;
for (var i = 1; i < 10; i++) {
    if (i % 5 == 0) {
        break;
    }
    num++;
}
console.log(num); //4 當(dāng)i=4時(shí),num=4,再執(zhí)行循環(huán)i=5,跳出循環(huán),下面的num++并沒有執(zhí)行,此時(shí)num還是4;

continue 跳出本次循環(huán),繼續(xù)執(zhí)行下面的循環(huán)

var num = 0;
for (var i = 1; i < 10; i++) {
    if (i % 5 == 0) {
        continue;
    }
    num++;
}
console.log(num); //當(dāng)i=4和9時(shí),跳過(guò)了num++,循環(huán)完成時(shí)num=8;

// 函數(shù)執(zhí)行完之后會(huì)立即銷毀!!!
function sum(num1, num2) {
    return num1 + num2; //函數(shù)是否需要返回值是要看我們是否需要用到函數(shù)的返回值
}

function hello() {//函數(shù)在執(zhí)行完return之后會(huì)立即退出
    return;
    console.log("你好,世界!"); //這段語(yǔ)句不會(huì)執(zhí)行
}

函數(shù)聲明:函數(shù)聲明整體提升,函數(shù)表達(dá)式/變量聲明:函數(shù)表達(dá)式命名提升

function test(a,b) {
   console.log(a)  
   console.log(b) 
   var b = 234
   console.log(b)  
   a = 123
   console.log(a) 
   function a() {}
   var a
   b = 234
   var b = function () {}
   console.log(a)
   function b () {}
   console.log(b)
}
test(1) // 打印結(jié)果為 fn a, fn b, 234, 123, 234, fn