Javascript基本語法速查

時間 2019-12-04

標籤 javascript 基本語法速查欄目 JavaScript 简体版

原文原文鏈接

你們好，我是言淦，我今天帶來的文章是《Javascript基本語法速查》，但願能給大家帶來幫助！javascript

目錄：html

1.變量

ES6規範以前， Js定義變量的方式只有一種，即var；在ES6規範到來後，Js定義變量的方式有三種，var， let和const。java

var：使用var聲明變量有兩個」bug「，第一是沒有塊級做用域；第二是循環內變量過分共享。
let：解決上述var聲明的兩個bug，能夠說let是更完美的var。
const：定義常量數組

變量提高數據結構

函數及變量的聲明都將被提高到函數的最頂部
變量能夠在使用後聲明，也就是變量能夠先使用再聲明

參考： www.jianshu.com/p/4e9cd99ec…ide

2.數據類型

值類型(基本類型)：字符串（String）、數字(Number)、布爾(Boolean)、空值（Null）、未定義（Undefined）、Symbol
引用類型：對象(Object)、數組(Array)、函數(Function)函數

2.1.Symbol

Symbol 是 ES6 引入了一種新的原始數據類型，表示獨一無二的值。ui

2.2.值類型和引用類型區別

// 值類型（d的值不會跟着c變）
> c = 1
 1
> d = c
 1
> c = 2
 2
> d
 1

// 引用類型（l2的值會跟着l變）
> a = [1, 2, 3]
(3) [1, 2, 3]
> a2 = a
(3) [1, 2, 3]
> a[0] = 4
4
> a2
(3) [4, 2, 3]
複製代碼

2.3.類型判斷

typeof：返回的結果有number、boolean、symbol、string、object、undefined、function
instanceof：檢測的只是原型。或者說instanceof只能用來判斷兩個對象是否屬於實例關係，而不能判斷一個對象實例具體屬於哪一種類型。（不建議用）
constructor：用法和typeof差很少，可是不支持null和undefined，第二是注意prototype屬性重寫的問題
toString：用法和typeof差很少

參考： www.cnblogs.com/onepixel/p/…this

什麼是原型?
3.1.原型是JavaScript爲了繼承設計出的一個概念idea

3.2.Js沒有"子類"和"父類"的概念，也沒有"類"（class）和"實例"（instance）的區分，全靠一種很奇特的"原型鏈"（prototype chain）模式，來實現繼承。

3.3.」原型「能夠理解爲面對對象語言的」構造函數「

// Java寫法
public class Dog{
    String name;
    int age;
    // 構造方法
    Dog(String name, int age){
        this.name = name;
        this.age = age;
    }
}
// Java new一個對象
Dog damao = new Dog("大毛", 1);

// JavaScript寫法(是否是跟構造函數很像)
function Dog(name, age){
    this.name = name;
    this.age = age;
}
// JavaScript new一個對象
var damao = new Dog('大毛', 1);
複製代碼

3.4.Js new出來的實例沒法共享屬性（每個實例都有本身的屬性和方法的副本），沒法作到數據共享，形成資源的極大浪費，因此設計者決定爲構造函數設置prototype屬性。

3.5.因爲全部的實例對象(dogA, dogB)共享同一個prototype對象，那麼從外界看起來，prototype對象就好像是實例對象的原型(父類，爸爸)，而實例對象則好像"繼承"了prototype對象同樣（Java 子類默認繼承父類屬性，除非本身重寫）

參考： www.ruanyifeng.com/blog/2011/0…

2.4.判斷整數和浮點數

Math.floor(obj) === obj // 推薦
Number.isInteger(obj) // 推薦，可是隻在ES6中支持

2.5.判斷對象是否相等

JSON.stringify()：有侷限性，好比位置變化

2.6.判斷是不是字符串數字

isNaN(value): 若是value是Number類型爲False
!Number.isNaN(Number(value))：若是value是Number類型爲true
正則

var reg = /^[\d|\.]*$/;
undefined
reg.test('aa')
false
reg.test('111')
true
複製代碼

3.類型轉換

3.1 Number轉String： String方法

3.2 String轉Number

// Number方法： 視圖解析你給他的數字
b = Number("111")
111
b = Number("111.111")
111.111
b = Number("111.111aaa")
NaN
Number("023"); // returns 23
Number(023); // returns 19


// ParseInt, ParseFloat
parseInt("111.11aa")
111
parseInt("aa111")
NaN

parseFloat("aa111")
NaN
parseFloat("111.11aa")
111.11
複製代碼

3.3 Object轉String

String: 不行
JSON.stringify: 能夠

3.4 String轉Object

JSON.parse

3.5 Array轉String

JSON.stringify

3.6 String轉Array

JSON.parse

4.字符串操做

www.runoob.com/js/js-strin…

5.數據結構

Object：對象
Array：數組

判斷元素是否存在

in關鍵字，適用Object和Array
hasOwnProperty方法： arr.hasOwnProperty(key); 或 obj.hasOwnProperty(key)

Object的增刪查改

增長: object.property=value
刪除： delete object.property
查找： in關鍵字或者 hasOwnProperty方法

Array的增刪查改

增長： push（向數組末尾添加元素）， unshift（向數組開頭添加元素）
刪除： pop（刪除數組的最後一項）， shift(刪除數組的的第一項)
查找： slice， indexOf
增長+刪除（修改）： arr.splice(index, howmany, item1,.....,itemX)
排序： sort（只能排序在10之內的數字）， reverse(把數組倒過來排序)

參考： www.cnblogs.com/supershare/…

單詞計數

blog.csdn.net/u013778905/…

6.For循環的四種形式

juejin.im/entry/5a165…

7.深拷貝與淺拷貝

針對的對象：引用類型，如Object， Array。

Array

淺拷貝：直接賦值
深拷貝

// 1.slice
arr = [1, 2, 3]
arr2 = arr.slice(0)
arr[0] = 4
arr2 // 仍然爲[1, 2, 3]

// 2.concat
arr = [1, 2, 3]
arr3 = arr.concat()
arr[0] = 5
arr3 // 仍然爲[1, 2, 3]
複製代碼

Object
- 淺拷貝：直接賦值 - 深拷貝：

// 1.new 一個對象，把舊對象的值賦予新對象
var a={name:'yy',age:26};
var b=new Object();

b.name=a.name;
b.age=a.age;

a.name='xx';
console.log(b);//Object { name="yy", age=26}
console.log(a);//Object { name="xx", age=26}

// 2.JSON方法
var a = {age:1,name:'ccy',info:{address:'wuhan',interest:'playCards'}};
var b = JSON.parse(JSON.stringify(a));

a.info.address = 'shenzhen';
console.log(a.info,b.info);

複製代碼

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。