JavaScript面向对象的笔记

主要内容

①函数的四种调用模式

②补充知识点

③面试题

①函数的四种调用模式

原型链---

作用域链--- javascript面向对象的三大模块。

函数-----

定义方式：声明式 表达式式 函数对象构造器构造模式(new function)。

四种调用模式：

① 函数模式

函数调用模式： 自调用(fn)() 函数调用fn()

function foo(){

console.log("我是一个函数")

}

foo();//函数调用模式 函数名(参数) 这种形式去调用。

//window调用

// 任何自调用函数 都是函数模式。

//this 指向window

window.foo();谁调用this就指向谁。

②方法模式

区分：this指向对象。

var obj={foo:function(){console.log(this)}}

函数本身也是对象，打印this会打印这个函数对象的函数本身。

对象.fn(参数);

宿主对象：方法储存的位置，即称为宿主对象。

对象调用方法的例子：

对象调用：

var obj={func:function(){}};

obj.func();

数组对象调用：

var arr=[function(){}];

arr[0]();

函数对象调用：

function fn(){};

function f1(){console.log(this)};

fn.f1=f1;

fn.f1();

面试题：

var length=10;

function fn(){

console.log(this.length)

}

var obj={

length:5，

method:

function(fn){

fn();

arguments[0]();

}

}

③构造模式

构造器调用模式：

区分：new关键字引导。

new的作用:用来申请创建对象，创建出来的对象传递给构造函数的this指向这个空对象。

var obj=new fn(); fn是一个构造函数。

构造函数的返回值：不写return值，默认返回this。

写return：①如果返回数据紧跟基本数据类型，则忽略返回数据。

② 返回数据跟引用类型，那么构造函数返回该引用类型数据，忽略this。

③无参数时，()可以省略。

④默认返回this。

面试题：

function foo(){

getname = function(){ alert(1); };

return this;

}

function getname(){

alert(5);

}

foo.getname = function(){ alert(2); };

foo.prototype.getname = function(){ alert(3); };

getname = function(){ alert(4); }; // 覆盖前面的 getname

foo.getname(); // = 2

getname(); // = 4

foo().getname();

getname(); // = 1

new foo.getname(); // = 2

new foo().getname(); // = 3

new new foo().getname();

关于构造函数的总结：

①如果构造函数没有参数，可以省略小括号

②如果希望创建对象并直接调用其方法

new person().sayhello();new person() 先结合先创建。

④上下文模式

概念：环境调用模式--> 在不同的环境下不同调用模式 统一一种格式，实现函数模式和方法模式

目的：实现借用方法。

优点：①提供统一的方法实现两种方式的调用，

②不会污染宿主对象，不必要宿主对象包含该方法。 实现方法借调。

③可以改变上下文this

语法：1，call形式 函数名.call(参数);

函数模式： foo.call(null,参数1，参数2,....)

方法模式：foo.call(obj,参数1，参数2，....)

-----------------------------------------------------------------

2,apply形式 函数名.apply(参数);

功能完全一样，唯一不同的是参数形式。

用法：

function foo(){ console.log(this)};

var o={name:"jim"};

foo();//函数模式调用;

o.func=foo;

o.func();//方法模式调用;

foo.apply()or foo.apply(null)//上下文模式函数调用。

foo.apply(o)//上下文模式的方法调用：

带有参数的函数模式

函数模式：foo.apply(null,[参数1,参数2]);

方法模式：foo.apply(o,[参数1，参数2]);

使用其他对象的语法时 array.protype.apply(arr,[数组或者伪数组]);

3，应用：借用构造方法实现继承

案例：function person(name,age,gender){

this.age=age;

this.name=name;

this.gender=gender;

}

function student(name,age,gender,course){

person.call(this,name,age,gender);

this.course=course;

}

var p1=new student("夏志勇"，24,"male","前端");

console.log(p1);

⑤补充函数调用模式

函数bind方法 bind绑定 邦迪

案例：

var t=document.getelementbytagname.bind(document),arr=[];

arr.push.apply(arr,t('p'));

arr.push.apply(arr,t('p'));

arr.foreach(e){

e.style.border="1px solid red"

}

绑定是使对象绑定方法。

语法：var 新方法=旧方法.bind(对象);

新方法();用对象调用方法。

⑥补充object.prototype成员介绍

1，construtor

2，hasownproperty 判断属性是不是自己提供的

用法:对象.hasownproperty("属性名") 返回值是布尔值

3,propertyisenumerable 判断是不是可枚举的

4，对象 isprototypeof(对象) 对象是不是对象的原型

5，tostring，tolocalestring，valueof

⑦ function.prototype

⑧包装类型

字符串：string 基本包装对象 sstring

数字： number 基本包装对象 number

布尔： boolean 基本包装对像 boolean

开发过程中在需要的时候会将数据转换为对象类型。当方法结束后这个对象就被立刻释放了。

转换过程

"abc"--> new string("abc")--->new string("abc").方法 --> "abc"

转换时间：调用方法

call 或者apply 第一个参数的时候。

⑨es5引入的部分数组方法

① foreach 遍历方法

实例：var arr=[1,2,3,4];

arr.foreach(function(v,i){

console.log(i);索引

console.log(v);值

}) //高版本使用

② map 映射

实例：

var arr=[1,2,3,4];

var a= arr.map(function(v,i){return i})

返回值构成的数组;

③filter 筛选数组

实例：

var arr[1,2,3,4,5,6];

var a=arr.filter(function(v){ return v%2===1}) 获取奇数

④some 判断数组中至少有一个符合要求 返回值是布尔值

实例：

var arr=["123",{}.function(){},123];

var isture=arr.some(function(v){

return typeof v==="number";

}) 有一个符合要求;

⑤every 判断数组必须都符合要求 返回值是布尔值

实例：

var arr=["123",{}.function(){},123];

var isture=arr.every(function(v){

return typeof v==="number";

}) 所有都符合要求;

⑥ indexof 查找数组中的位置 从左向右找

arr.indexof(查找开始的位置，查找的值)

lastindexof 从右往左找

面向对象：①实现继承的多种方式

②原型链结构图

③预解析，代码执行

④作用域链

⑤自调用函数(沙箱模式)

⑥上下文模式。