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

结果分析：

词法分析过程：

？？？？？？？？？第一步分析的参数是传进去的参数还是函数程序里面的参数

1、分析参数，有一个参数，形成一个 AO.age=undefine;

2、分析变量声明，有一个 var age, 发现 AO 上面已经有一个 AO.age，因此不做任何处理

3、分析函数声明，有一个 function age(){...} 声明， 则把原有的 age 覆盖成 AO.age=function(){...};

最终，AO上的属性只有一个age，并且值为一个函数声明

执行过程：

注意：执行过程中所有的值都是从AO对象上去寻找

1、执行第一个 console.log(age) 时，此时的 AO.age 是一个函数，所以第一个输出的一个函数

2、这句 var age=22; 是对 AO.age 的属性赋值， 此时AO.age=22 ，所以在第二个输出的是 22

3、同理第三个输出的还是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="";         // 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.49739482150694668:把数四舍五入为最接近的整数。

   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))   #

        print(round(-3.5))   #-4

        print(round(4.5))   #

        print(round(-4.5))   #-4

        02：小数部分不为0.5时，按标准的四舍五入

        print(round(3.6))   #

        print(round(4.6))   #

        print(round(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

巴特西

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

一：函数

01：普通函数

02：带参数的函数

03：带返回值的函数

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

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

06：#箭头函数

07：函数中的arguments参数

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

01：局部变量

02：全局变量

03：作用域

04：闭包

05:词法分析

三：内置对象和方法

01：自定义对象

02：遍历对象中的值

03：创建对象

04:Javascript面向对象之继承#

05：Date对象

06:json对象

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

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

最新文章

热门文章

巴特西

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

一：函数

01：普通函数

02：带参数的函数

03：带返回值的函数

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

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

06：#箭头函数

07：函数中的arguments参数

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

01：局部变量

02：全局变量

03：作用域

04：闭包

05:词法分析

三：内置对象和方法

01：自定义对象

02：遍历对象中的值

03：创建对象

04:Javascript面向对象之继承#

05：Date对象

06:json对象

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

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

最新文章

热门文章

　　01：普通函数

　　02：带参数的函数

　　03：带返回值的函数

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

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

　　06：#箭头函数

　　07：函数中的arguments参数

　　01：局部变量

　　02：全局变量

　　03：作用域

　　04：闭包

　　05:词法分析

　　01：自定义对象

　　02：遍历对象中的值

　　03：创建对象

　　04:Javascript面向对象之继承#

　　05：Date对象

　　06:json对象

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