我的JS 中级学习篇

浏览数：20 / 时间：2015年06月09日

在codefordream上进入中级学习后，感觉立马从js的基础学习往前跳了好远，上面的东西好像都是第一次看到一样．这时候才发现，说来也曾接触过js，但是这时候才发现对js的认识就停在知道两点：js中用var定义变量，用function定义函数！这时候有点羞愧了，说来真是对不起老师们的教导！之前接触js是用于编写网页，当时在dreamwever上编写网页很多功能都没有自己动手用函数实现，而是直接拖动组件等方法创建的，导致好像真的除了看到过js代码，自己还真的居然没有写过！

中级部分主要有：代码运行规则，类和对象，this引用，原型继承，和回调函数等需要学习的知识．

Ａ．关于this引用:

1.函数调用模式的时候，this指向window.

2.方法调用模式的时候，this指向方法所在的对象

3.构造函数模式的时候，this指向新生成的实例

4.apply/call调用模式的时候，this指向apply/call方法中的第一个参数

对于一个函数,我们可以通过调用该函数(注意函数也是对象)的apply方法,来将该函数内部的this引用指向一个特定对象.eg:

 1 function Tool(name, usage){
 2     this.name = name;
 3     this.usage = usage;
 4     this.get_info = function() {console.log("This is " + this.name + ", the usage of it is " + this.usage + ".");};
 5 }
 6 var cycling = new Tool("cycling","transport");
 7 function display(date){
 8     console.log(this.name+","+this.usage+","+date);
 9 }
10 display.apply({name:"cycling",usage:"transport"},[1970]);
11 //cycling,transport,1970

Ｂ．关于类和对象：JS中有一种类似于‘类‘功能的函数,叫构造函数 ,构造函数是一种可以用来生成对象的函数.JS中的对象是一组属性的无序集合,每个属性可以是一种简单数据类型值或者一个对象或者一个函数.eg:

1 var Robot = { //构造函数 Object() 生成一个对象 Robot
2     birthday:‘1970年1月1日‘,
3     name:‘DeepSky‘,//定义 name 和 birthday 两个属性
4     say_hello:function(){console.log("我的名字叫"+this.name+",是一个出生在"+this.birthday+"的机器人.");}  //为该对象添加 say_hello 方法,使该方法能够在console输出一句包含 name 和 birthday 属性值的话,
5     };

C．关于回调函数

在Javascript中,函数实际上是对象：它们能被“存储”在变量中，能作为函数参数被传递，能在函数中被创建，能从函数中返回。

 1 //全局变量
 2 var info = [];
 3 
 4 //普通的show函数，将数据的内容打印到控制台
 5 function show(data){
 6     info.push(data);
 7     //如果是可以直接输出的字符串则直接输出
 8     if ( typeof data === "string")
 9     {
10         console.log(data);
11     }
12     else if ( typeof data === "object"){
13         //遍历data
14         for(var item in data){
15             console.log(item + ": " + data[item]);
16         }
17     }
18 }
19 
20 //定义一个接收两个参数的函数，参数中后面一个是回调函数, 在函数体中调用回调函数,并将第一个参数传入回调函数.
21 function get_inputs(data,callback){
22 callback(data);
23 
24 }
25 //当我们调用get_inputs函数时，我们将show函数作为一个参数传递给它     
26 //因此show将会在get_inputs函数内被回调（或者执行）     
27 get_inputs({name:"bower",speciality:"Robot"}, show);
28 //最后会输出以下的内容：
29 //name: bower
30 //speciality: Robot