<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>javascript深入簡出</title>
</head>
<body>
</body>
<script>
// 第一章 1.1函數表達式 四種方法
// function variable 函數表達式
var add = function(a,b){
// dosth
};
// IEF(Immediately Executed Function)立刻執行函數，匿名函數直接調用也叫作立即執行函數表達式
(function(){
// dosth
})();
// first-class function 函數也是對象，可以將它作為函數返回值來調用
return function(){
// dosth
};
// NTF(Named Function Expression)命名函數表達式 ****-
var add = function foo (a,b){
// dosth
};
---------變量和函數聲明在開始前會前置------------------
// NTF(Named Function Expression)命名函數表達式 ****-
// 著名的BUG
var func = function nef(){};
alert(func===nfe);
// 遞歸調用
var func = fuction nfe(){/* dosth */ nfe()};
//以上在ie6-8現實可以調用，
// 第一章 1.2 大寫的F Function 構造器 使用程度 **---
var func = new Function('a'+'b','console.log(a + b)');
func(1,2);//3
var func = Function('a'+'b'+'console.log(a + b)');
func(1,2);//3
// Function 構造器不實用的原因
// CASE 1
Function('var localVal = "local";console.log(localVal);')();
console.log(typeof localVal);
// result:local,undefined
//CASE 2
var globalVal = 'goabl';
(function(){
var localVal = 'local';
Function('console.log(typeof localVal + typeof gobalVal;')();
})();
-----------------------------------------------------------------
| 函數聲明 | 函數表達式 | 函數構造器
前置 | 是 | 是 | 否
允許匿名 | 否 | 對 | 對
加上括弧立刻調用 | 否 | 對 | 對
在定義該函數的作用
域通過函數名訪問 | 對 | 否 | 否
沒有函數名 | 否 | 否 | 對
/ 第二章 this關鍵字
// 全局的this(瀏覽器)
// eg.
console.log(this.document === document);//true
console.log(this === window);//true
this.a = 38;
console.log(window.a);//38
/一般函數的this(瀏覽器)
//eg.
function f1() {
return this;
}
f1() === window;//true,global object
/但是在嚴格模式下回報錯
//function f2(){
'use strict'
return this;
}
f2() === undefined;//true
/作為對象方法的函數this
// eg.
var o = {
prop:37,
f:function(){
return this.prop;
}
};
console.log(o.f());//logs 37
/對象原型鏈上的this
//eg.
var o = {f:function(){ return this.a + this.b;}};
var p = Object.create(o);
p.a = 1;
p.b = 4;
console.log(p.f());
/get/set方法與this
function modulus(){
return Math.sqrt(this.re*this.re + this.im*this.im);
}
var o = {
re:1,
im:-1,
get phase(){
return Math.atan2(this.im,this.re);
}
};
Object.defineProperty(o,'modulus',{
get:modulus,enumerable:true,configurable:true
});
console.log(o.phase,o.modulus);//logs -0.78 1.4142
/構造器中的this
//eg.
function MyClass(){
this.a = 37;
}
var o =new MyClass();
console.log(o.a);//37
function C2(){
this.a = 37;
return {a:38};
}
o = new C2();
console.log(o.a);//38
/call/apply方法與this
//eg.
function add(c,d){
return this.a + this.b + C + d；
}
var o = {a:1,b:3};
add.call(o,5,7);//1+3+5+7 = 16;
add.apply(o,[10,20]);//1+3+10+20 = 34;
fucntion bar(){
console.log(Object.prototype.toString.call(this));
}
bar.call(7);//"[object Number]"
/bind 方法與this
//eg.
function f(){
return this.a;
}
var g = f.bind({a:"test"});
console.log(g());//test
var o = {a:37,f:f,g:g};
console.log(o.f(),o.g());//37,test
/對象的概述
//對象中包含一系列的屬性，這些屬性是無序的，每一個屬性多有一個字符串的key和對應的value
var obj = {a:2,b;1};
obj.a;//2
obj.b;//1
// 對象的結構
// writable可寫
// enumerable
// configurable
// value
// get/set
</script>
</html>
浙公網安備 33010602011771號