1. 程式人生 > >JS基礎---->javascript的基礎(一)

JS基礎---->javascript的基礎(一)

concat 字符串表 位置 時間 操作符 exe 以及 構造 varname

  記錄一些javascript的基礎知識。只是一起走過一段路而已,何必把懷念弄的比經過還長。

javascript的基礎

一、在檢測一個引用類型值和 Object 構造函數時, instanceof 操作符始終會返回 true 。

var str1 = "huhx";
var str2 = new String("huhx");
console.log(str1 instanceof Object); // false
console.log(str2 instanceof Object); // true

二、js中沒有塊級作用域,定義在塊中的變量是全局變量。

if
(true) { var color = "blue"; } console.log(color); // blue

三、js中創建對象的方式:

  • 使用 new 操作符後跟 Object 構造函數:
var person = new Object();
person.name = "Nicholas";
person.age = 29;
  • 使用對象字面量表示法:
var person = {
    name : "Nicholas",
    age : 29
};

四、js中訪問對象的屬性:

var person = {
    name: 
"huhx", age: 56 } var varName = "name"; console.log(person.name); // huhx console.log(person[varName]); // huhx

五、

js中Arrays的學習

一、創建數組的幾種方式:

  • 使用 Array 構造函數:
var colors = new Array();
var colors = new Array(20);
var colors = new Array("red", "blue", "green");
  • 使用數組字面量表示法:
var
colors = ["red", "blue", "green"];

二、檢測數組:

var arrays = ["huhx", 45, true];
console.log(arrays instanceof Array); // true
console.log(Array.isArray(arrays));   // true

三、使用 join() 方法,則可以使用不同的分隔符來構建這個字符串。

console.log(arrays.toString()); // huhx,45,true
console.log(arrays.join("|")); // huhx|45|true

四、數組的棧方法:

var user = new Array("test");
var number = user.push("huhx", "linux");
console.log(number); // 3
console.log(user);  // ["test", "huhx", "linux"]
var item = user.pop();
console.log(item); // linux
console.log(user); // ["test", "huhx"]

push() 將兩個字符串推入數組的末尾,並將返回的結果保存在變量number中。在調用 pop() 時,它會返回數組的最後一項。

五、數組的隊列方法:

  • shift() 方法能夠移除數組中的第一個項並返回該項,同時將數組長度減 1:
var loves = ["chenhui", "huhx", 5];
var item = loves.shift();
console.log(item);  // chenhui
console.log(loves); // ["huhx", 5]
  • unshift()方法能在數組前端添加任意個項並返回新數組的長度。
var loves = ["chenhui", "huhx", 5];
var count = loves.unshift("linux", true);
console.log(count); // 5
console.log(loves); // ["linux", true, "chenhui", "huhx", 5]

六、數組的重排序方法:

  • reverse() 方法會反轉數組項的順序:
var values = [1, 2, 3, 4, 5];
values.reverse();
console.log(values); // [5, 4, 3, 2, 1]
  • sort() 方法按升序排列數組項:
var values = [0, 1, 5, 10, 15];
values.sort();
console.log(values); // [0, 1, 10, 15, 5]
  • 可以將一個比較函數傳遞級sort方法:
function compare(value1, value2){
    return value2 - value1;
}
var values = [0, 1, 5, 10, 15];
values.sort(compare);
console.log(values); // [15, 10, 5, 1, 0]

七、數組的一些操作方法:

  • 如果傳遞給 concat() 方法的是一或多個數組,則該方法會將這些數組中的每一項都添加到結果數組中。
var colors = ["red", "green", "blue"];
var colors2 = colors.concat("yellow", ["black", "brown"]);
console.log(colors);  // ["red", "green", "blue"]
console.log(colors2); // ["red", "green", "blue", "yellow", "black", "brown"]
  • slice() 方法可以接受一或兩個參數,即要返回項的起始和結束位置。
var colors = ["red", "green", "blue", "yellow", "purple"];
var colors2 = colors.slice(1);
var colors3 = colors.slice(1,4);
console.log(colors2); // ["green", "blue", "yellow", "purple"]
console.log(colors3); // ["green", "blue", "yellow"]

八、splice中第一個參數是刪除的位置,第二個參數是刪除的數量,後續的是插入的數據並且起點是第一個參數。

var colors = ["red", "green", "blue"];
var removed = colors.splice(0, 1); // 刪除第一項
console.log(colors); // green,blue
console.log(removed); // red,返回的數組中只包含一項
removed = colors.splice(1, 0, "yellow", "orange"); // 從位置 1 開始插入兩項
console.log(colors); // green,yellow,orange,blue
console.log(removed); // 返回的是一個空數組
removed = colors.splice(1, 1, "red", "purple"); // 插入兩項,刪除一項
console.log(colors); // green,red,purple,orange,blue
console.log(removed); // yellow,返回的數組中只包含一項

九、數組的位置方法:

  • indexOf() 和 lastIndexOf() 。這兩個方法都接收兩個參數:要查找的項和(可選的)表示查找起點位置的索引。
var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]; // 查找4的位置
console.log(numbers.indexOf(4)); // 3
console.log(numbers.lastIndexOf(4)); // 5

十、數組的叠代方法:

  • every() :對數組中的每一項運行給定函數,如果該函數對每一項都返回 true ,則返回 true 。
  • filter() :對數組中的每一項運行給定函數,返回該函數會返回 true 的項組成的數組。
  • forEach() :對數組中的每一項運行給定函數。這個方法沒有返回值。
  • map() :對數組中的每一項運行給定函數,返回每次函數調用的結果組成的數組。
  • some() :對數組中的每一項運行給定函數,如果該函數對任一項返回 true ,則返回 true 。
var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
var everyResult = numbers.every(function(item, index, array) {
    return (item > 2);
});
console.log(everyResult); // false
var someResult = numbers.some(function(item, index, array) {
    return (item > 2);
});
console.log(someResult); // true

filter函數的使用:

var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
var filterResult = numbers.filter(function(item, index, array) {
    return (item > 2);
});
console.log(filterResult); // [3,4,5,4,3

map() 也返回一個數組,而這個數組的每一項都是在原始數組中的對應項上運行傳入函數的結果。

var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
var mapResult = numbers.map(function(item, index, array) {
    return item * 2;
});
console.log(mapResult); // [2,4,6,8,10,8,6,4,2]

js中Date的一些使用

一、時間Date的創建:

var now = new Date(); // 本地的當前時間
var adate = new Date(2005, 4, 5, 17, 55, 55); // 本地時間 2005 年 5 月 5 日下午 5:55:55

二、時間的比較先後以及間隔:

var date1 = new Date(2007, 0, 1); 
var date2 = new Date(2007, 1, 1); 
console.log(date1 < date2); // true
console.log(date2 - date1); // 31天的毫秒表示:2678400000

三、時間的一些取值操作:

console.log(now.getDate()); // 15(15日)
console.log(now.getMonth()); // 10(11月份)
console.log(now.getDay()); // 2(星期二)
console.log(now.getFullYear()); // 2016(2016年)

js中RegExp的使用

一、RegExp 的每個實例都具有下列屬性:

global :布爾值,表示是否設置了 g 標誌。
ignoreCase :布爾值,表示是否設置了 i 標誌。
lastIndex :整數,表示開始搜索下一個匹配項的字符位置,從 0 算起。
multiline :布爾值,表示是否設置了 m 標誌。
source :正則表達式的字符串表示,按照字面量形式而非傳入構造函數中的字符串模式返回。

二、RegExp對象的創建:

var pattern1 = /[bc]at/i;
var pattern2 = new RegExp("[bc]at", "i");

三、RegExp對象的一些方法:

  • exec() 接受一個參數,即要應用模式的字符串,然後返回包含第一個匹配項信息的數組
var text = "mom and dad and baby";
var pattern = /mom( and dad( and baby)?)?/gi;
var matches = pattern.exec(text);
console.log(matches.index); // 0
console.log(matches.input); // "mom and dad and baby"
console.log(matches[0]); // "mom and dad and baby"
console.log(matches[1]); // " and dad and baby"
console.log(matches[2]); // " and baby
  • test() ,它接受一個字符串參數。在模式與該參數匹配的情況下返回true ;否則,返回 false 。
var text = "000-00-0000";
var pattern = /\d{3}-\d{2}-\d{4}/;
console.log(pattern.test(text)); // true

js中函數的使用

一、js中函數的創建:解析器會率先讀取函數聲明,並使其在執行任何代碼之前可用(可以訪問);至於函數表達式,則必須等到解析器執行到它所在的代碼行,才會真正被解釋執行。

  • 函數聲明語法定義:
function sum (num1, num2) {
    return num1 + num2;
}
  • 函數表達式定義函數:
var sum = function(num1, num2){
    return num1 + num2;
}

二、在函數內部,有兩個特殊的對象: arguments 和 this:

function sum(num1, num2) {
    return num1 + num2;
}

function applysum1(num1, num2) {
    return sum.apply(this, arguments); // 傳入 arguments 對象
}

function applysum2(num1, num2) {
    return sum.apply(this, [num1, num2]); // 傳入數組
}

function callsum(num1, num2) {
    return sum.call(this, num1, num2);
}
console.log(applysum1(10, 10)); //20
console.log(applysum2(10, 10)); //20
console.log(callsum(10, 20)); // 30

友情鏈接

JS基礎---->javascript的基礎(一)