day46----JavaScript的函数及对象小结

一：函数

　　01：普通函数

function f1(){
    console.log("Helleo world")
}

f1(); //调用函数
-->Helleo world  //获得的值

　　02：带参数的函数

function f2(a,b){
    console.log(arguments);
    console.log(arguments.length);
    console.log(a,b);
}

f2(1,2);     //调用函数并给函数传值
VM689:2 Arguments(2) [1, 2, callee: ƒ, Symbol(Symbol.iterator): ƒ]
-->2   //参数个数
-->1 2  //值

　　03：带返回值的函数

函数只能返回一个值，若是要返回多个值，只能将其放在数组或对象中返回。
function sum(a,b){
    return a+b;
}
sum(1,2);  //调用函数并给函数传参
--〉3  //获得的值

　　04：匿名函数方式，多和其余函数配合使用

var sum=function(a,b){
    return a+b;

}
sum(2,3); //调用函数并给函数传参
5       //获得值

　　05：当即执行函数，页面加载到这里了就直接执行，不须要被调用执行

(function(a,b){
    return a+b;
})(4,5);   ////python中写能够这么写：ret=(lambda x,y:x+y)(10,20) 而后print(ret)
9

　　06：#箭头函数

var f=v=>v;
f(4);
4
---〉等同于：
var f = function(v){
  return v;
}

若是箭头函数不须要参数或须要多个参数，就是用圆括号表明参数部分：
var f=()=>5;
undefined
f();
5

等同于：
ar f=function(){return 5};
f();
5

　　07：函数中的arguments参数

function add(a,b){
    console.log(a+b);
    console.log(arguments.length);
}
//传两个数：
add(2,4);
-->6
-->2


//传三个数
add(1,2,4);
-->3    //1+2=3  只计算了前面两个数字的和
-->3  //长度个数

//传一个数

add(3);
-->NaN   //没有结果，只返回一个not a number
-->1    // 长度个数

二：函数的全局变量和局部变量

　　01：局部变量

在JavaScript函数内部声明的变量（使用 var）是局部变量，因此只能在函数内部访问它（该变量的做用域是函数内部）。
只要函数运行完毕，本地变量就会被删除。

　　02：全局变量

 在函数外声明的变量是全局变量，网页上的全部脚本和函数都能访问它。

　　03：做用域

首先在函数内部查找变量，找不到则到外层函数查找，逐步找到最外层。

例子01：
var city="beijing";
function f(){
    var city="shanghai";
    function inner(){
        var city="shenzhen";
        console.log(city);
    }
inner();   //在函数内部调用内部的函数，首先在函数内部查找变量，找不到则到外层函数查找，逐步找到最外层

}
f();   //调用函数
-->shenzhen    //输出结果

例子02：
var city="beijign";
function Bar(){
console.log(city);  //首先在函数内部查找变量，找不到则到外层函数查找
}

function f(){
var city="shanghai";
return Bar;
}
var ret=f();
ret();
-->beijign          //获得的值

　　04：闭包

var city="beijing";
function f(){
    var city="shanghai";
    function inner(){
        console.log(city);
    }
    return inner;
}
var ret=f();
ret();
--> shanghai

　　05:词法分析

JavaScript中在调用函数的那一瞬间，会先进行词法分析。
词法分析的过程：
当函数调用的一瞬间，会先造成一个激活对象：Active Object（AO）,并会分析一下3个方面
01：函数参数，若是有，则会将此参数赋值给AO，且值为undefined。若是没有，则不作任何操做
02：函数局部变量，若是AO上有同名的值，则不作任何操做，若是没有，则将此变量赋值给AO，而且值为undefined
03：函数声明，若是AO上有，则会将AO上的对象覆盖，若是没有，则不作任何操做。

词法分析例子01：

var age=18;     //（第二部：发现没有函数参数，不作任何操做）
function foo(){

//（第三步，发现下面有局部变量age的声明，此时的AO的变量名字是age，且值为undefined（）
//即：age=undefined。因此这时的age的值是undefined  在这以前是还未执行到age=22的。）

    console.log(age);
    var age=22;         //若是没有这个变量声明，打印的值应该是18
    console.log(age);
}

foo();  //调用函数，（第一步：瞬间造成了一个AO对象）

//调用函数获得的值
--> undefined
-->22

词法分析例子02：

var age=18;
function foo(){
    console.log(age);
    var age=22;
    console.log(age);
    function age(){         //#发现age这个函数名也是变量，将OA上的变量给替换了，那么函数在执行的时候，
                            //去OA上找，发现OA是个函数，而后执行到age=22的时候，age才被从新赋值
        console.log("呵呵");
    }
    console.log(age);
}

foo();  //调用执行函数

结果：

--> ƒunction age(){
      console.log("呵呵");
    }
--> 22
--> 22

结果分析：
词法分析过程：
？？？？？？？？？第一步分析的参数是传进去的参数仍是函数程序里面的参数

一、分析参数，有一个参数，造成一个 AO.age=undefine;
2、分析变量声明，有一个 var age, 发现 AO 上面已经有一个 AO.age，所以不作任何处理
三、分析函数声明，有一个 function age(){...} 声明， 则把原有的 age 覆盖成 AO.age=function(){...};
最终，AO上的属性只有一个age，而且值为一个函数声明

执行过程：
注意：执行过程当中全部的值都是从AO对象上去寻找
1、执行第一个 console.log(age) 时，此时的 AO.age 是一个函数，因此第一个输出的一个函数
二、这句 var age=22; 是对 AO.age 的属性赋值， 此时AO.age=22 ，因此在第二个输出的是 22
三、同理第三个输出的仍是22, 由于中间再没有改变age值的语句了

三：内置对象和方法

JavaScript中的全部事物都是对象：字符串、数字、数组、日期，等等。在JavaScript中，对象是拥有属性和方法的数据。
咱们在学习基本数据类型的时候已经带你们了解了，JavaScript中的Number对象、String对象、Array对象等。
注意var s1 = "abc"和var s2 = new String("abc")的区别：typeof s1 --> string而 typeof s2 --> Object

　　01：自定义对象

 javascript的对象（object）本质上是键值对得集合（Hash结构），可是只能用字符串做为键

例子01：
            //自定义一个对象a，且对象a是一个数组
            var a={"name":"Tom","age":18};

            //从对象中取值
            console.log(a.name);
            -->Tom

            console.log(a.age);
            -->18

            console.log(a["name"]);
            -->Tom

            console.log(a["age"]);
            -->18

　　02：遍历对象中的值

var a={"name":"Tom","age":18};
for (var i in a){

    console.log(i,a[i]);   //遍历的只是键，须要经过键取 值
}
//结果：
--〉name Tom
--〉age 18

　　03：建立对象

var person=new Object();    // 建立一个person对象
person.name="Tom";      // person对象的name属性
-->"Tom"
person.age="18";         // person对象的age属性
-->"18

 面向对象，在ES5中没有类的概念，只有个构造函数，命名的首字母要大写，实例化的时候使用new关键字进行实例化

　　04:Javascript面向对象之继承#

// 父类构造函数
var Car = function (loc) {
  this.loc = loc;
};

// 父类方法
Car.prototype.move = function () {
  this.loc ++;
};

// 子类构造函数
var Van = function (loc) {
  Car.call(this, loc);
};

// 继承父类的方法
Van.prototype = Object.create(Car.prototype);
// 修复 constructor
Van.prototype.constructor = Van;
// 扩展方法
Van.prototype.grab = function () {
  /* ... */
};

　　05：Date对象

01：建立Date对象
    001:方法一：不指定参数
        var d1=new Date();

        console.log(d1.toLocaleDateString());
        --> 2018/12/19

    002：参数为日期字符串
      01:年/月/日 形式
        var d2=new Date("2018/3/12 11:12");

        console.log(d2.toLocaleString());
        ---> 2018/3/12 上午11:12:00
      02：月/日/年 形式
        var d3=new Date("04/03/20 11:12");

        console.log(d3.toLocaleString());
        VM3078:1 2020/4/3 上午11:12:00

    003：参数为毫秒数
        var d3=new Date(5000);

        console.log(d3.toLocaleString());   //取值
        --> 1970/1/1 上午8:00:05

        console.log(d3.toUTCString);
        --> ƒ toUTCString() { [native code] }


02：Date对象的方法：
    var d = new Date();
    //getDate()                 获取日
    //getDay ()                 获取星期
    //getMonth ()               获取月（0-11）
    //getFullYear ()            获取完全年份
    //getHours ()               获取小时
    //getMinutes ()             获取分钟
    //getSeconds ()             获取秒
    //getMilliseconds ()        获取毫秒
    //getTime ()                返回累计毫秒数(从1970/1/1午夜)

　　06:json对象

建立两个对象：
var str1='{"name":"TOM","age":18}';
var obj1={"name":"TOM","age":18};

//将json字符串转成对象
var obj=JSON.parse(str1);
obj;  //输出对象结果语句
{name: "TOM", age: 18}  //结果

//将对象转换成json字符串
var str=JSON.stringify(obj1);
str;        //输出对象结果语句
"{"name":"TOM","age":18}"   //结果

　　07：Math对象（相似于python的内置函数）( E 为天然底数 (近似值 2.7183)。)
　　exp() 方法可返回 e 的 x 次幂的值。

01:返回数的绝对值。
   Math.abs(-34.34);
   -->34.34

02:返回 e 的指数。
   Math.exp(2);
   -->7.38905609893065

03:返回数的天然对数（底为e）。
   Math.log(4);
   -->1.3862943611198906

04:返回 x 和 y 中的最高值。
   Math.max(4,23);
   -->23

05:返回 x 和 y 中的最低值。
   Math.min(23,12);
   -->12

06:返回 x 的 y 次幂。
  Math.pow(3,2);
  -->9

07:返回 0 ~ 1 之间的随机数。
   Math.random()
   -->0.4973948215069466

08:把数四舍五入为最接近的整数。
   Math.round(3.45);
   -->3

  Math.round(3.68);
  -->4

  Math.round(3.58);
  -->4

9:对数进行下舍入。
  Math.floor(23.9);
  -->23

10:返回数的正弦。
   Math.sin(12);
   -->-0.5365729180004349

   Math.sin(90);
   -->0.8939966636005579

11:返回数的平方根。
   Math.sqrt(2);
   1.4142135623730951

   Math.sqrt(4);
   -->2

12:返回角的正切。
   Math.tan(23);
   -->1.5881530833912738

   Math.tan(45);
   -->1.6197751905438615

ps:javascript 的round和python的round的比较

 python：
            print(round(3.45))  //3
            print(round(3.68))  //4
            print(round(3.58))  //4
            print(round(3.5))   //4
            print(round(4.5))   //4

        javascript：

            Math.round(3.45);
            -->3

            Math.round(3.5);
            ---4

            Math.round(3.68);
            -->4

            Math.round(3.58);
            -->4
ps：拓展知识点：Math.ceil(),Math.floor(),Math.round()的区别
    Math.ceil():小数后面的数字无论多少，直接进位，好比，12.1和12.5，12.6都直接返回13,ceil是向上舍入的（math.ceiling（天花板除法）。）
    Math.floor():无论小数点后的数字是多少，多大，都是直接舍去，不进位好比 12.1和12.5，12.9都是直接返回12，floor是向下舍入的。
    Math.round():正常的标准舍入，就像咱们学的数学课本上面的规则

ps：python的round()和javascript的round()的比较：
    javascript:Math.round():正常的标准舍入，就像咱们学的数学课本上面的规则

    python：python中的round（）会根据版本的不一样而出现不一样的结果。总体的是最靠近当前偶数的规则
    01：当小数部分只为0.5时，整数部分若是为奇数则进1，若是为偶数则舍去小数部分
        print(round(3.5))   #4
        print(round(-3.5))   #-4
        print(round(4.5))   #4
        print(round(-4.5))   #-4

        02：小数部分不为0.5时，按标准的四舍五入
        print(round(3.6))   #4
        print(round(4.6))   #5
        print(round(4.4))   #4
        print(round(-4.4))  #-4

        03:保留小数部分时候
        a:当小数部分须要保留数位的下一位是5时，保留数位置为偶数则进1，奇数舍去。
        print(round(2.345,2))  #2.35
        print(round(-2.345,2))  #-2.35
        print(round(-2.335,2))  #-2.33
        b:当小数部分须要保留数位的下一位不是5时，按标准四舍五入（逢5进1）
        print(round(2.344,2))   #2.34
        print(round(2.347,2))  #2.35
        print(round(-2.347,2))  #-2.35