日韩久久中文字幕,亚洲日韩美一区

基本類型和引用類型的值

動態(tài)的屬性

可以給引用類型動態(tài)添加屬性和方法

var person = new Object();
person.name = "Jhon";
alert(person.name); // Jhon

復制變量值

基本類型

var num1 = 5;
var num2 = num1;

將num2的值復制給num1，num1和num2完全獨立，此后可以參與任何操作而不會相互影響

引用類型

淺拷貝(復制的實際上是指針，指針指向存儲在堆內存中的一個對象，兩個變量實際上引用同一個對象)

var obj1 = new Object();
var obj2 = obj1;
obj1.name = "Jhon";
alert(obj2.name); // Jhon

// 改變obj1(obj2)會影響obj2(obj1)

深拷貝

var obj1 = new Object();
var obj2 = JSON.parse(JSON.stringify(obj1));
obj1.name = "Jhon";
alert(obj2.name); // undefined

// 改變obj1(obj2)不會影響obj2(obj1)

傳遞參數(可以想象為局部變量)

所有函數的參數都是按值傳遞的

function addTen(num){
    num+=10;
    return num;
}
var count = 20;
var result = addTen(count);
alert(count); // 20
alert(result); // 30

funtion setName(obj) {
    obj.name = "Jhon";
}
var person = new Object();
setName(person);
alert(person.name);  // Jhon

funtion setName(obj) {
    obj.name = "Jhon";
    obj = new Object();
    obj.name = "Tom";
}
var person = new Object();
setName(person);
alert(person.name);  // Jhon

檢測類型

type of
instance of

執(zhí)行環(huán)境及作用域(全局和局部)

var color = "blue";

function changeColor() {
    if(color === "blue") {
        color = "red";
    } else {
        color = "blue";
    }
}

changeColor();
alert(color); // blue

var color = "blue";

function changeColor() {
    var anotherColor = "red"
    function swapColors() {
        var tempColor = anotherColor;
        anotherColor = color;
        color = tempColor;
        // 這里可以訪問tempColor,anotherColor,color
    }
    // 這里可以訪問anotherColor,color
    swapColors();
}
// 這里可以訪問color
changeColor();
alert(color); // blue
alert(anotherColor); // 報錯
alert(tempColor); // 報錯

作用域鏈

window => color, changeColor() => anotherColor, swapColor() => tempColor

延長作用域鏈

try { } catch { }的catch塊
with語句

沒有塊級作用域

if (true) {
    var color = "blue";
}
alert(color); // blue

在JavaScript中，if語句會將變量添加到當前執(zhí)行環(huán)境(在這里是全局環(huán)境)

for (var i = 0; i < 10; i++){
    dosomething(i);
}

alert(i); // 10

聲明變量

初始化變量時沒有用var聲明，該變量會自動添加到全局環(huán)境

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

var result = add(10, 20); // 30
alert(sum); // 報錯

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

var result = add(10, 20); // 30
alert(sum); // 30

查詢標識符

var color = 'blue';

function getColor() {
    var color = 'red';
    return color;
}

alert(color); // red

垃圾收集(垃圾回收機制)

標記清除(最常用的垃圾收集方式)：變量進入環(huán)境和離開環(huán)境時進行標記，完成內存清除
引用計數：當包含這個值的變量又引用了另外一個值，引用次數減1，當引用次數為0，釋放這個值占用的內存(當代碼存在循環(huán)引用時，存在問題)
管理內存

解除引用：一旦數據不再使用，將其值設置為null來釋放其引用

summary

基本類型值在內存中占據固定大小的空間，因此被保存在棧內存中；復制基本類型的變量到另一個變量，會創(chuàng)建一個這個值的副本
引用類型的值是對象，存在堆內存中；從一個變量向另一個變量復制引用類型的值，復制的是指向該對象的指針，兩個變量指向同一個對象

引用類型

Object類型

創(chuàng)建Object實例的方式

構造函數

var person = new Onject();
person.name = "Jhon";
person.sex = "man";

字面量（函數傳遞參數經常使用）

var person = {
    name: 'Jhon',
    sex: 'man',
    5: true, // 數值屬性名會自動轉換成字符串
}

訪問對象屬性

// 點表示法
person.name

// 方括號法
person["name"]

方括號法的優(yōu)點

可以通過變量的方式來訪問屬性

var propertyName = 'name';
alert(person[propertyName]);

如果屬性名中含有非法字符或是關鍵字保留字

alert(person['first name']); // 含有空格

?? 除非必須用變量表示屬性名，否則最好使用點表示法

Array類型

創(chuàng)建數組的基本方式

構造函數

var colors = new Array();

var colors = new Array(20); // 創(chuàng)建length為20的array

var colors = new Array('red', 'blue', 'yellow');

字面量

var colors = ['red', 'blue', 'yellow'];

數組的length屬性并不是只讀屬性

var colors = ['red', 'blue', 'green'];
colors.length = 2;
alert(colors[2]); // undefined

var colors = ['red', 'blue', 'green'];
colors[99]= 'black';
alert(colors.length); // 100

利用length屬性在數組末尾添加新項

var colors = ['red', 'blue', 'green'];
colors[colors.length] = 'yellow';
colors[colors.length] = 'black';

檢測數組

if (value instanceof Array) {
    
}

ES5新增檢測方式

if (Array.isArray(value)) {
    
}

轉換方法

toLocaleString()
toString()
valueOf()
join()

var colors = ['red', 'blue', 'green'];
alert(colors.join(',')); // red, blue, green
alert(colors.toString()); // red, blue, grren

?? 如果數組中的某一項值為null或undefined，在使用以上轉換方法時返回空字符串

棧方法

push()，pop()：先進先出

var colors = new Array();
var count = colors.push('red', 'bule'); // 從尾插入
alert(count); // 2

count = colors.push('green');
alert(count); // 3

var item = colors.pop(); // 從尾取出
alert(item); // 'green'
alert(colors.length); // 2

隊列方法

shift()，unshift()：先進后出

var colors = new Array();
var count = colors.push('red', 'bule');
alert(count); // 2

count = colors.push('green');
alert(count); // 3

var item = colors.shift();  // 從頭取出
alert(item); // 'red'
alert(colors.length); // 2

var colors = new Array();
var count = colors.unshift('red', 'bule'); //從頭插入
alert(count); // 2

count = colors.unshift('green');
alert(count); // 3

var item = colors.pop();
alert(item); // 'blue'
alert(colors.length); // 2

兼容性：IE7及更早版本，unshift方法總是返回undefined

重排序方法

reverse()

var values = [1, 2, 3, 4, 5];
values.reverse();
alert(values); // [5, 4, 3, 2, 1]

sort()

var values = [1, 2, 5, 10, 15];
values.sort();
alert(values); // [1, 2, 15, 10, 5]

function compare(value1, value2) {
    if (value1 < value2) {
        retrun -1;
    }else if(value1 > value2) {
        return 1;
    }else {
        return 0;
    }
}

var values = [1, 2, 5, 10, 15];
values.sort(compare);
alert(values); // [1, 2, 5, 10, 15]

操作方法

concat()

var colors = ['red', 'blue', 'green'];
var colors2 = colors.concat('yellow', ['black', 'brown']);

alert(colors2); // ['red', 'blue', 'green', 'yellow', 'black', 'brown']

slice()：不會影響原始數組(開始位置，結束位置)

var colors = ['red', 'blue', 'green', 'yellow', 'purple'];
var colors2 = colors.slice(1); // blue, green, yellow, purple
var colors3 = colors.slice(1, 4);  // blue, green, yellow

splice()

var colors = ['red', 'blue', 'green'];
var colors2 = colors.splice(0, 1);
alert(colors); // ['blue', 'green']
alert(colors2); // ['red']

var colors3 = colors.splice(1, 0, 'black', 'white');
alert(colors3); //['blue', 'black', 'white', 'green']

var colors4 = colors.splice(1, 1, 'purple', 'yellow');
alert(colors4); // ['blue', 'purple', 'yellow', 'white', 'green']

位置方法

indexOf()：不存在返回-1

var numbers = [1,1,3,3,4,8,9,6,4,8];
alert(numbers.indexOf(4)); // 4
alert(numbers.lastIndexOf(4)); // 8

lastIndexOf()

迭代方法

every()：該函數對每一項都返回true，則返回true
filter()
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
})

alert(everyResult) // false

var someResult = numbers.some(function(item, index, array){
    return item > 2
})

alert(someResult) // true

var filterResult = numbers.filter(function(item, index, array){
    return item > 2
})

alert(filterResult) // [3,4,5,4,3]

var mapResult = numbers.filter(function(item, index, array){
    return item * 2
})

alert(mapResult) // [2,4,6,8,10,8,6,4,2]

縮小方法

reduce()：從左往右

var values = [1,2,3,4,5]

var sum = values.reduce(function(prev, curr, index, array){
    return prev + curr
})

alert(sum) // 15

reduceRight()：從右往左

var values = [1,2,3,4,5]

var sum = values.reduceRight(function(prev, curr, index, array){
    return prev + curr
})

alert(sum) // 15

Date類型

創(chuàng)建日期對象

var now = new Date()

ES5新增：

Date.now()
+new Date()

Date.parse()（ISO 8016擴展格式：YYYY-MM-DDTHH:mm:ssZ）

Date.UTC(年, 月, 日, 時, 分, 秒, 毫秒)

日期格式化方法

toDateString()
toTimeString()
toLocaleDateString()
toLocaleTimeString()
toUTCString()

RegExp類型（正則）

實例屬性

global：Boolean，是否設置了g標志

ignoreCase：Boolean，是否設置了i標志

lastIndex：Number，開始搜索下一個匹配項的字符位置

multiline：Boolean，是否設置了m標志

source：正則表達式的字符串表示

實例方法

exec()：返回包含第一個匹配項信息的數組

test()：返回true或false

valueOf()：返回正則表達式本身

構造函數屬性

長屬性名：input ????????????短屬性名：$_

長屬性名：lastMatch ????短屬性名：$&

長屬性名：lastParen ?????短屬性名：$+

長屬性名：leftContext ??短屬性名：$`

長屬性名：multiline ???????短屬性名：$*

長屬性名：rightContext 短屬性名：$'

var text = "this has been a short summer";

var pattern = /(.)hort/g;

if (pattern.test(text)) {
    alert(RegExp.input); // this has been a short summer
    alert(RegExp.leftContext); // this has been a
    alert(RegExp.rightContext); // summer
    alert(RegExp.lastMatch); // short
    alert(RegExp.lastParen); // s
    alert(RegExp.multiline); // false
}

模式的局限性

不支持向后查找

條件匹配

正則表達式注釋

...

Function類型

function sum(num1, num2) {
    return num1 + num2;
}
alert(sum(10, 10)); // 20

var anotherSum = sum;
alert(anotherSum(10, 10)); // 20

sum = null;
alert(anothorSum(10, 10)); // 20

沒有重載

function addNumber(num) {
    return num + 100
}

function addNumber(num) {
    return num + 200
}

addNumber(100); // 300

相當于

var addNumber = function(num) {
    return num + 100
}

addNumber = function(num) {
    return num + 200
}

addNumber(100); // 300

函數聲明提升

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

以下代碼會運行報錯，sum使用時并不是一個函數

alert(sum(10, 10));
// 函數表達式
var sum = function(num1, num2) {
    return num1 + num2;
}

作為值的函數

function callSomeFunction(someFunction, someArguments) {
    return someFunction(someArguments)
}

function add10(num) {
    return num + 10
}

callSomeFunction(add10, 10); // 20

函數的內部屬性

arguments

callee

function factorial(num) {
    if(num <= 1) {
        return 1
    }else {
        return num * factorial(num - 1)
    }
}

可以寫成

function factorial(num) {
    if(num <= 1) {
        return 1
    }else {
        return num * arguments.callee(num - 1)
    }
}

this（指向調用者）

window.color = "red";
var object = {color: "blue"};

function sayColor() {
    return this.color
}

sayColor(); // red

object.sayColor = sayColor();
alert(object.sayColor()); // blue

ES5新增 - caller：調用者

function outer() {
    inner()
}

function inner() {
    alert(inner.caller())
}

outer()

function outer() {
    inner()
}

function inner() {
    alert(arguments.callee.caller())
}

outer()

函數屬性

length：函數接收的命名參數的個數

function sayName(name) {
    return name
}

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

function sayHi() {
    return "Hi"
}

sayName.length // 1
sum.length // 2
sayHi.length // 0

prototype

函數方法

call()：改變this指向；延長函數作用域；立即執(zhí)行函數；傳參參數必須逐個例舉

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

function callSum(num1, num2){
    return sum.call(this, num1, num2)
}

callSum(10, 10); // 20

apply()：改變this指向；延長函數作用域；立即執(zhí)行函數；傳參(運行函數作用域，arguments對象或參數數組)

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

function callSum1(num1, num2){
    return sum.apply(this, arguments)
}

function callSum2(num1, num2){
    return sum.apply(this, [num1, num2])
}

callSum1(10, 10); // 20
callSum2(10, 10); // 20

延長作用域：

window.color = "red";
var object = {color: "blue"};

function sayColor() {
    return this.color
}

sayColor(); // red
sayColor.call(this); // red
sayColor.call(window); // red
sayColor.call(object); // blue

bind()：創(chuàng)建一個函數實例；不是立即執(zhí)行函數

window.color = "red";
var object = {color: "blue"};

function sayColor() {
    return this.color
}

var objectSayColor = sayColor.bind(object)
objectSayColor(); // blue

基本包裝類型

Boolean類型：與布爾值對應的引用類型

重寫valueOf()：返回true或false；重寫toString()：返回"true"或"false"

var falseObject = new Boolean(false);
var result = true && falseObject; // true

var falseValue = false;
var result = true && falseValue; // false

與基本類型Boolean的區(qū)別：

typeOf falseObject // object
typeOf falseValue // boolean
falseObject instanceOf Boolean // true
falseValue instanceOf Boolean // false

String類型

charAt和charCodeAt方法：

var stringValue = "hello world"
stringValue.charAt(1); //"e"
stringValue.charCodeAt(1); //小寫字母e的字符編碼："101"

concat()方法：不會改變原數組

substr()方法：不會改變原數組

substring()方法：不會改變原數組

slice()方法：不會改變原數組

var stringValue = "hello world"

stringValue.slice(3); // 'lo world'
stringValue.substring(3); // 'lo world'
stringValue.substr(3); // 'lo world'
stringValue.slice(3, 7); // 'lo w'
stringValue.substring(3, 7); // 'lo w'
stringValue.substr(3, 7); // 'lo worl'


stringValue.slice(-3); // 'rld'
stringValue.substring(-3); // 'hello world'
stringValue.substr(-3); // 'rld'
stringValue.slice(3, -4); // 'lo w'
stringValue.substring(3, -4); // 'hel'
stringValue.substr(3, -4); // ''

indexOf()和lastIndexOf()方法

trim()方法：去除首尾空格

toLowerCase()方法和toUpperCase()方法

toLocaleLowerCase()方法和toLocaleUpperCase()方法

match()方法：參數為正則表達式或RegExp對象

var text = 'cat, bat, sat, fat'
var pattern = /.at/

var matches = text.match(pattern)

matches.index // 0
matches[0] // "cat"
pattern.lastIndex // 0

search()方法：返回字符串第一個匹配項的索引

replace()方法

split()方法

localeCompare()方法

var stringValue = "yellow"

stringValue.localeCompare("yellow"); // 0
stringValue.localeCompare("zoo"); // -1
stringValue.localeCompare("brick"); // 1

fromCharCode()方法：從字符編碼轉換成字符串

HTML方法

Number類型：與其數字值對應的引用類型

toString()方法：參數表示返回幾進制數值的字符串

var num = 10;
num.toString(); // "10"
num.toString(2); // "1010"
num.toString(8); // "12"

toFixed()方法：精確到小數點后兩位

var num = 10;
num.toFixed(2); // "10.00"

num = 10.005;
num.toFixed(2); // "10.01"

toExponential()方法：指數表示法，參數表示小數位數

var num = 10;
num.toExponential(1); // "1.0e+1"

toPrecision()方法：參數表示所有數字的位數，會返回最合適的格式（格式不固定）

var num = 99;
num.toPrecision(1); // "1e+2"
num.toPrecision(2); // "99"
num.toPrecision(3); // "99.0"

單體內置對象

Global對象：windows

encodeURI()和encodeURIComponent()：用UTF-8編碼替換所有的無效字符，使瀏覽器可以理解和接受

?? encodeURIComponent()會把任何非標準字符進行編碼，包括本身屬于URI的特殊字符（如冒號，正斜杠，問號等），但encodeURI()不會

eval()方法

eval(alert("hi"))

// 等價于

alert("hi")

?? 在eval()中創(chuàng)建的任何變量和函數都不會被提升；它們只在eval()執(zhí)行的時候創(chuàng)建

Math對象

min()和max()方法：取最小值和最大值

舍入方法：ceil()向上舍入，floor()向下舍入，round()標準舍入

Math.ceil(25.9) //26
Math.ceil(25.5) //26
Math.ceil(25.1) //26

Math.floor(25.9) //25
Math.floor(25.5) //25
Math.floor(25.1) //25

Math.round(25.9) //26
Math.round(25.5) //26
Math.round(25.1) //25

random()：返回0到1之間的一個隨機數，不包含0和1

色偷偷精品伊人,欧洲久久精品,欧美综合婷婷骚逼,国产AV主播,国产最新探花在线,九色在线视频一区,伊人大交九欧美,1769亚洲,黄色成人av

JavaSctipt高級程序設計讀書筆記(二)

JavaSctipt高級程序設計讀書筆記(二)

基本類型和引用類型的值

檢測類型

執(zhí)行環(huán)境及作用域(全局和局部)

延長作用域鏈

沒有塊級作用域

垃圾收集(垃圾回收機制)

summary

引用類型

友情鏈接更多精彩內容

色偷偷精品伊人,欧洲久久精品,欧美综合婷婷骚逼,国产AV主播,国产最新探花在线,九色在线视频一区,伊人大交九 欧美,1769亚洲,黄色成人av

JavaSctipt高級程序設計讀書筆記(二)

基本類型和引用類型的值

檢測類型

執(zhí)行環(huán)境及作用域(全局和局部)

延長作用域鏈

沒有塊級作用域

垃圾收集(垃圾回收機制)

summary

引用類型

友情鏈接更多精彩內容

色偷偷精品伊人,欧洲久久精品,欧美综合婷婷骚逼,国产AV主播,国产最新探花在线,九色在线视频一区,伊人大交九欧美,1769亚洲,黄色成人av