JavaScript 基础二

函数

函数：函数就是封装了一段能够重复执行的代码块。

function fn(){
             console.log('我是函数')
         }
         fn();
    
    
         function getSum(a,b){
          return a +b;
        }
       console.log(getSum(1, 2));

• 函数不调用本身不执行
• 调用函数的时候，千万别忘了加小括号
• 一次声明函数，能够调用屡次
• 封装，就相似打包

返回值

1. 代码执行到return 关键字后，会跳出当前函数，后续与代码再也不执行
2. 函数的返回值是什么。调用这个函数就至关于调用了什么
3. 没有返回值的函数至关于返回了undedined

function fn2(){
                alert('fn2内部的代码')
        }
        console.log(fn2())      //先弹出'fn2内部的代码',而后控制台打印undefined

小细节 : break ,continue ,return 的区别

  break   	结束当前的循环体 （for   while ）      
  continue	跳出本次循环，继续执行下次循环（for   while ）
  return  	返回return 中的值 同时结束当前的函数体内的代码

arguments的使用

JavaScript中，arguments对象是比较特别的一个对象，其实是当前函数的一个内置属性。也就是说全部函数都内置了一个arguments对象，arguments对象中存储了传递的全部的实参。arguments是一个伪数组，所以及能够进行遍历

伪数组定义：

a.具备length属性；
b.按索引方式储存数据；
c.不具备数组的push,pop等方法；

当咱们不肯定有多少个参数传递的时候，能够用arguments 来获取

定义函数有两种方式

• 函数关键字自定义函数方式

// 命名函数   有函数名 为  fn 
    function fn() { ....}
    // 调用  那个地方调用均可以
    fn()

• 函数表达式方式

语法格式：

// 这是 函数表达式 写法   匿名函数后面跟分号结束
    var  fn =  function () { ....  }；
    // 调用的方式  可是这个方式，函数调用必须写到函数体下面
    fn();

1. 函数没有名字，咱们称为匿名函数
2. 这个fn 里面存储的是一个函数
3. 这个执行的原理 跟咱们 学的 变量使用一致的。
4. 调用的方式 可是这个方式，函数调用必须写到函数体下面

自执行函数(了解)

• 匿名函数能够做为启动函数，定义后当即自执行

(function () {
      alert('我是匿名函数，被自执行啦~~！');
    })();

匿名函数自动执行写法的，最大的好处，就是 防止命名冲突， 这种函数永远不会冲突。

值类型和引用类型

• 基本类型

var num1 = 10;
        var num2 = num1;
        num1 =20;
        console.log(num1);      //20
        console.log(num2);      //10

栈速度比堆快。

• 引用类型

fnuction Person(name,age){
            this.name = name;
            this.age = age;
        }
        var p1 = new Person('zs',18);
        var p2 = p1;    //复制引用
        p2.name = 'ls';
        console.log(p1.name);       //ls
        console.log(p2.name);       //ls

做用域

全局变量和局部变量

• 全局做用域
  供全部代码执行的环境(整个script标签内部) 或者一个独立的js文件中
• 局部做用域（函数做用域）
  会造成一个执行函数内代码的新环境。
• 全局变量
  • 在全局做用域下声明的变量叫作全局变量（在函数外部定义的变量）
  • 全局变量在代码的任何位置均可以使用
  • 特殊状况， 再函数内 不var 声明 的 变量 也是全局变量 （不建议使用）
• 局部变量
  • 在局部做用域下声明的变量叫作局部变量（在函数内部定义的变量）
  • 局部变量只能在该函数内部使用

注意

• 在函数内部不声明直接赋值使用的变量也算是全局变量

• 函数的形参实际上就是局部变量

• 局部变量当其所在的代码块被执行时，会被初始化，当代码块运行结束后，就被销毁了，节省内存空间。

• 全局变量由于任何一个地方均可以使用，只有再浏览器关闭才会销毁，比较占内存。

• 只要是代码，就至少有一个做用域

• 写在函数外部的是全局做用域

• 写在函数内部的局部做用域

• 若是函数中还有函数，那么在这个做用域中就又能够诞生一个做用域。

• 根据在内部函数能够访问外部函数变量的这种机制，用链式查找决定哪些数据能被内部函数访问。 就称做做用域链。

• 局部变量，写在函数内部，当咱们函数执行完毕后，里面的局部就会自动销毁，释放内存，比较节省资源。

• 全局变量 只有浏览器关闭的时候才会销毁，比较浪费资源。

• 做用域链：咱们按照链式方式去查找，最终决定咱们变量执行那个值的过程（就近原则）

预解析

JavaScript代码是由浏览器中的JavaScript解析器来执行的。JavaScript解析器在运行JavaScript代码的时候，分为两步：预解析和代码执行

学习预解析可以让咱们知道 为何在变量声明以前访问变量 值是undefined 为何在函数声明以前就能够调用函数

• 预解析过程

  • JavaScript解析器会在全局环境下查找 var、function关键字，变量只声明不赋值，函数声明不调用。
  • 预解析只发生在当前做用域下

• 预解析也叫作变量、函数提高

  • 变量提高
    定义变量的时候，变量的声明会被提高到当前做用域的最上面，变量的赋值不会提高。
  • 函数提高
    JavaScript解析器首先会把当前做用域的函数声明提早到整个做用域的最前面
  • 变量名和函数名相同，优先执行 函数

• 执行过程

  • 变量赋值、函数调用、表达式运算等等。

1. 首先把全部的var function 进行代码提高。提高到当前做用域的最前面
2. 变量提高的是声明并不赋值，函数只提高声明，并不调用。

console.log(num2);
      var num2 = 20;
    
      //至关于执行了下面的代码
      var num2;
      console.log(num2);    //undefined;
      num2 = 20;

什么是对象？

• 现实生活中：万物皆对象，对象是一个具体的事物。 看得见摸得着实物。一本书、一辆汽车、一我的均可以是“对象”，一个数据库、一张网页、一个与远程服务器的链接也能够是“对象”。

对象调用：

• 对象里面的属性调用 : 对象.属性名 这个小点 就理解为 的
• 对象里面的属性另外调用方式 : 对象['属性名'] 注意 方括号里面的属性 必须加 引号 咱们后面会用
• 对象里面的方法调用： 对象.方法名() 注意这个方法名字后面必定加括号

console.log(star.name)  // 调用 名字属性
      console.log(star.age)  // 调用 年龄属性
      star.sayHi();  // 调用 sayHi 方法   注意，必定不要忘记带后面的括号

函数和方法的区别：

• 函数是单独存在的， 调用的时候 函数名() 就能够了
• 方法是再对象里面， 调用的时候，对象.方法名()

new Object 建立对象

var stuObj = new Obect();
        stuObj.name = 'james';
        stuObj.age = 11;
        stuObj.sex = true;
        stuObj.sayHi = function(){
            alert('你们好啊~');
        }

• 跟咱们前面学的 new Array() 同样。
• Object() 是构造函数 第一个字母大写
• new Object() 是调用构造函数 由于构造函数须要new 来调用 同时再内存中建立一个对象
• 注意里面使用的时候用点 . 不是 冒号 :

自定义构造函数

咱们能够和之前封装函数同样， 想建立多个对象，不用一个个的创造对象了。

抽象能够将具备相同或类似功能的js代码独立出来封装成一个函数，这样能够提升代码的重复利用率，提升代码书写的效率，也能够有效的减小代码的冗余。
咱们这个函数里面封装的对象， 为了和之前区别显示不一样。 咱们称为构造函数。

1. 构造函数用于建立某一大类对象，首字母要大写。
2. 构造函数要和new一块儿使用才有意义。

function Person(name, age, sex) {
             this.name = name;
             this.age = age;
             this.sex = sex;
             this.sayHi = function() {
                  alert('个人名字叫：' + this.name + '，年龄：' + this.age + '，性别：' + this.sex);
            }
        }
        var bigbai = new Person('大白', 100, '男');
        var smallbai = new Person('小白', 21, '男');
        console.log(bigbai.name);
        console.log(smallbai.name);

new在执行时会作四件事情

• new会在内存中建立一个新的空对象
• new 会让this指向这个新的对象
• 执行构造函数里面的代码 目的：给这个新对象加属性和方法
• new会返回这个新对象 （因此构造函数里面不须要return）

this详解

JavaScript中的this指向问题，有时候会让人难以捉摸，随着学习的深刻，咱们能够逐渐了解
如今咱们须要掌握函数内部的this几个特色
1. 函数在定义的时候this是不肯定的，只有在调用的时候才能够肯定
2. 通常函数直接执行，内部this指向全局window
3. 函数做为一个对象的方法，被该对象所调用，那么this指向的是该对象（谁调用指向谁）
4. 构造函数中的this 对象的实例

// 1. 普通函数
    function fn() {
        console.log(this); // this 指向 window
     }
    fn();
     // 2 对象方法
    var obj = {
        name: 'zs',
        dance: function() {
             console.log(this);
             that = this;
    }
    }
    obj.dance(); //  this 指向 obj  
    console.log(that === obj); // true
    // 3 构造函数
    function Fn() {
        this.age = '18';
        console.log(this)
        self = this;
    }
    var demo = new Fn(); // this  指向 demo
    console.log(self === demo); // true

对象是封装了相关属性和方法的复杂数据类型

本质：对象就是一组无序的相关属性和方法的集合

注意： 函数用来按功能封装代码，对象用来按功能封装方法和属性，都起到复用代码和数据的做用。