js 基礎
- var val = (1,2,4)
val //4 - var obj = {}
Object.defineProperty(obj, 'x'{
configurable:false,
value:1
})
delete obj.x //false
obj.x //1
3.in
window.x = "1"
"x" in window //true
- try {
throw "test";
} catch (ex) {
console.log(ex); // test
} finally {
console.log('finally');
} - 'use strict'
嚴格模式是一種特殊的執(zhí)行模式,
它修復了部分語言上的不足,提供更強的錯誤檢查家乘,并增強安全性耕魄。
不允許用with所有變量必須聲明, 賦值給為聲明的變量報錯容握,而不是隱式創(chuàng)建全局變量芋膘。
eval中的代碼不能創(chuàng)建eval所在作用域下的變量旦袋、函數兜喻。而是為eval單獨創(chuàng)建一個作用域梦染,并在eval返回時丟棄。
函數中得特殊對象arguments是靜態(tài)副本朴皆,而不像非嚴格模式那樣,修改arguments或修改參數變量會相互影響泛粹。
刪除configurable=false的屬性時報錯遂铡,而不是忽略
禁止八進制字面量,如010 (八進制的8)
eval, arguments變?yōu)殛P鍵字晶姊,不可作為變量名扒接、函數名等
一般函數調用時(不是對象的方法調用,也不使用apply/call/bind等修改this)this指向null们衙,而不是全局對象钾怔。
若使用apply/call,當傳入null或undefined時蒙挑,this將指向null或undefined宗侦,而不是全局對象。
試圖修改不可寫屬性(writable=false)忆蚀,在不可擴展的對象上添加屬性時報TypeError矾利,而不是忽略。
arguments.caller, arguments.callee被禁用
prototype //直接聲明的函數 擁有prototype這個屬性馋袜,而new 構造出來的函數不存在prototype這個屬性象男旗。
function foo(){} function foo2(){}
undefined undefined
foo.x = 1 foo2.prototype.x = 1
1 1
foo.y=2 foo2.prototype.y = 1
2 VS 1
var test = new foo() var test2= new foo2()
undefined undefined
test2 test2
foo {} foo2 {x: 1, y: 1}
test.x test2.x
undefined 1
-
對象創(chuàng)建
var a ={} var b = Object.create({x:1})
undefined undefined
a.x =1 b.x
1 1
a.hasOwnProperty('x') b.hasOwnProperty('x')
true false -
對象屬性刪除
var a = {}
a.x = 1
delete a.x`var globalVal = 1;
delete globalVal; // false(function() {
var localVal = 1;
return delete localVal;
}()); // falseohNo = 1;
window.ohNo; // 1
delete ohNo; // true 對象屬性檢測
in hasOwnProperty propertyIsEnumerable-
枚舉類型
var o = {x : 1, y : 2, z : 3};
for (var key in o) {
console.log(key); // x, y, z
} getter setter
var man = {
name : 'Bosn',
weibo : '@Bosn',
get age() {
return new Date().getFullYear() - 1988;
},
set age(val) {
console.log('Age can't be set to ' + val);
}
}
console.log(man.age); // 27
man.age = 100; // Age can't be set to 100
console.log(man.age); // still 27
var man = {
weibo : '@Bosn',
$age : null,
get age() {
if (this.$age == undefined) {
return new Date().getFullYear() - 1988;
} else {
return this.$age;
}
},
set age(val) {
val = +val;
if (!isNaN(val) && val > 0 && val < 150) {
this.$age = +val;
} else {
throw new Error('Incorrect val = ' + val);
}
}
}
對象屬性及的權限設置
var person = {};
Object.defineProperty(person, 'name', {
configurable : false, //配置
writable : false, //寫
enumerable : true, //枚舉
value : "Bosn Ma" //值
});
person.name; // Bosn Ma
person.name = 1;
person.name; // still Bosn Ma
delete person.name; // false
Object.defineProperties(person, {
title : {value : 'fe', enumerable : true},
corp : {value : 'BABA', enumerable : true},
salary : {value : 50000, enumerable : true, writable : true}
});
Object.getOwnPropertyDescriptor(person, 'salary');
// Object {value: 50000, writable: true, enumerable: true, configurable: false}
Object.getOwnPropertyDescriptor(person, 'corp');
// Object {value: "BABA", writable: false, enumerable: true, configurable: false}`
-
call apply
1、方法定義
call方法:
語法:call([thisObj[,arg1[, arg2[,[,.argN]]]]])
定義:調用一個對象的一個方法欣鳖,以另一個對象替換當前對象察皇。
說明:call 方法可以用來代替另一個對象調用一個方法。call 方法可將一個函數的對象上下文從初始的上下文改變?yōu)橛?thisObj 指定的新對象泽台。
如果沒有提供 thisObj 參數什荣,那么 Global 對象被用作 thisObj矾缓。apply方法:
語法:apply([thisObj[,argArray]])
定義:應用某一對象的一個方法,用另一個對象替換當前對象溃睹。
說明:
如果 argArray 不是一個有效的數組或者不是 arguments 對象而账,那么將導致一個 TypeError。
如果沒有提供 argArray 和 thisObj 任何一個參數因篇,那么 Global 對象將被用作 thisObj泞辐, 并且無法被傳遞任何參數. function bind
this.x = 9
9
var module = {
x:81,
getX: function(){
return this.x
}
}
module.getX()
81
var getX = module.getX
getX()
9
var boundGetX = getX.bind(module)
boundGetX()
81
function add(a,b,c){
return a + b + c
}
var func =add.bind(undefined, 100)
func(1,2)
103
var func2 =func.bind(undefined, 200)
func2(100)
400
function getConfig(color, size, otherOptions){
console.log(color, size, otherOptions)
}
var defaultConfig = getConfig.bind(null, "#000", "1024 * 768")`
defaultConfig("123")
#000 1024 * 768 123
defaultConfig("456")
#000 1024 * 768 456閉包 //允許一個函數在立即詞法作用域外調用時,仍可以訪問本地變量
優(yōu)點: //靈活竞滓、 方便
缺點: //浪費空間咐吼、內存泄露、性能消耗-
arguments caller callee
arguments :
// 在函數調用時商佑, 會自動在該函數內部生成一個名為 arguments的隱藏對象锯茄。 該對象類似于數組,
//但又不是數組茶没〖∮模可以使用[]操作符獲取函數調用時傳遞的實參。caller :
//在一個函數調用另一個函數時抓半,被調用函數會自動生成一個caller屬性喂急,指向調用它的函數對象。
//如果該函數當前未被調用笛求,或并非被其他函數調用廊移,則caller為null。callee :
//當函數被調用時探入,它的arguments.callee對象就會指向自身狡孔,也就是一個對自己的引用。
//由于arguments在函數被調用時才有效蜂嗽,因此arguments.callee在函數未調用時是不存在的(即null.callee)苗膝,且解引用它會產生異常。
// -
this
在函數執(zhí)行時徒爹,this 總是指向調用該函數的對象荚醒。要判斷 this 的指向,其實就是判斷 this 所在的函數屬于誰隆嗅。
在《javaScript語言精粹》這本書中界阁,把 this 出現(xiàn)的場景分為四類,簡單的說就是:
有對象就指向調用對象
沒調用對象就指向全局對象
用new構造就指向新對象
通過 apply 或 call 或 bind 來改變 this 的所指胖喳。
1)函數有所屬對象時:指向所屬對象函數有所屬對象時泡躯,通常通過 . 表達式調用,這時 this 自然指向所屬對象。比如下面的例子:
var myObject = {value: 100};
myObject.getValue = function () {
console.log(this.value); // 輸出 100// 輸出 { value: 100, getValue: [Function] }较剃,
// 其實就是 myObject 對象本身
console.log(this);return this.value;
};console.log(myObject.getValue()); // => 100
getValue() 屬于對象 myObject咕别,并由 myOjbect 進行 . 調用,因此 this 指向對象 myObject写穴。- 函數沒有所屬對象:指向全局對象
var myObject = {value: 100};
myObject.getValue = function () {
var foo = function () {
console.log(this.value) // => undefined
console.log(this);// 輸出全局對象 global
};foo();
return this.value;
};console.log(myObject.getValue()); // => 100
在上述代碼塊中惰拱,foo 函數雖然定義在 getValue 的函數體內,但實際上它既不屬于 getValue 也不屬于 myObject啊送。foo 并沒有被綁定在任何對象上偿短,所以當調用時,它的 this 指針指向了全局對象 global馋没。據說這是個設計錯誤昔逗。
3)構造器中的 this:指向新對象
js 中,我們通過 new 關鍵詞來調用構造函數篷朵,此時 this 會綁定在該新對象上勾怒。
var SomeClass = function(){
this.value = 100;
}var myCreate = new SomeClass();
console.log(myCreate.value); // 輸出100
順便說一句,在 js 中声旺,構造函數笔链、普通函數、對象方法腮猖、閉包卡乾,這四者沒有明確界線。界線都在人的心中缚够。- apply 和 call 調用以及 bind 綁定:指向綁定的對象
apply() 方法接受兩個參數第一個是函數運行的作用域,另外一個是一個參數數組(arguments)鹦赎。
call() 方法第一個參數的意義與 apply() 方法相同谍椅,只是其他的參數需要一個個列舉出來。
簡單來說古话,call 的方式更接近我們平時調用函數雏吭,而 apply 需要我們傳遞 Array 形式的數組給它。它們是可以互相轉換的陪踩。
var myObject = {value: 100};
var foo = function(){
console.log(this);
};foo(); // 全局變量 global
foo.apply(myObject); // { value: 100 }
foo.call(myObject); // { value: 100 }var newFoo = foo.bind(myObject);
newFoo(); // { value: 100 } -
閉包的一個坑
閉包這個概念杖们,在函數式編程里很常見,簡單的說肩狂,就是使內部函數可以訪問定義在外部函數中的變量摘完。
for (var i = 0; i < 5; i++) {
setTimeout(function () {
console.log(i);
}, 5);
}
上面這個代碼塊會打印五個 5 出來,而我們預想的結果是打印 1 2 3 4 5傻谁。
之所以會這樣孝治,是因為 setTimeout 中的 i 是對外層 i 的引用。當 setTimeout 的代碼被解釋的時候,運行時只是記錄了 i 的引用谈飒,而不是值岂座。而當 setTimeout 被觸發(fā)時,五個 setTimeout 中的 i 同時被取值杭措,由于它們都指向了外層的同一個 i费什,而那個 i 的值在迭代完成時為 5,所以打印了五次 5手素。
為了得到我們預想的結果鸳址,我們可以把 i 賦值成一個局部的變量,從而擺脫外層迭代的影響刑桑。for (var i = 0; i < 5; i++) {
(function (idx) {
setTimeout(function () {
console.log(idx);
}, 5);
})(i);
}