首页 > 代码库 > 随手记

随手记

2024-09-16 05:33:52   207人阅读

<!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>

 

随手记


联系
我们