zoukankan      html  css  js  c++  java
  • 一些函数对象的知识

    一.Math对象

    特点:不能new!

    // Math:专门封装了数学计算所常用的量,并且提供了数学计算所用的API

    // 要做数学运算的时候使用

    console.log(Math.PI);

    // 取整的API

    var num = 123.9568;

    // 1.Math.ceil(num)向上取整 取num的下一个整数

    console.log(Math.ceil(num));//124

    // 2.Math.floor(num)向下取整,省略小数部分 将参数都转换为数字,取整

    console.log(Math.floor(num));//123

    // parseInt(str) 将一切都转换为字符串 ,再按位读取字符

    console.log(parseInt(num));

    // Math.floor("12.5px") ==>Math.floor(Number("12.5px")) ===>Math.floor(NaN) ==> NaN

    var p = Math.floor("12.5px");

    console.log(p)

    var x = parseInt("12.5px");

    console.log(x)

    console.log(Math.floor(true));//1

    // 3.Math.round(num) 四舍五入取整 缺点:只能取整! 优点:返回的是数字,可以直接加减

    console.log(Math.round(num));//124

    // toFixed(d) 按任意小数位四舍五入 缺点:返回值是字符串 ,必须先转换为数字,才能计算 优点:可以按照任意小数位四舍五入

    console.log(num.toFixed(1));

    // 随机数 返回的是0~1之间的任意一个数

    console.log(Math.random());

    // 随机一个整数的套路(0~n): Math.floor(Math.random()*(n+1))

    // 乘方和开平方

    // 乘方: Math.pow(底数,幂)

    console.log(Math.pow(2,2));

    // 开平方 Math.sqrt(n);

    console.log(Math.sqrt(9));

    // 最大值和最小值 参数不止数组

    console.log(Math.max(10,20,3,5,60));

    console.log(Math.min(10,20,3,5,60));

    Math对象练习题

    1. 如何自定义四舍五入的方法 要求是能根据任意小数位四舍五入

    <script type="text/javascript">

    var a = Number(prompt('请输入一个小数:'));

    var b = Number(prompt("请输入按几位小数四舍五入"));

    a = a.toFixed(b);

    alert(a);

    </script>

    2. 算术计算的游戏,随机出十道题,接受用户答题,答对一题得10分,错一题扣10

        如果输入的是exit,退出游戏最终给出得分

    <script type="text/javascript">

    //定义一个变量存放得到的分数

    var sum = 0;

    //定义一个空数组存放随机产生的数

    var num = [];

    //循环

    for(var i = 1;i<=10;i++){

    //数组中只接受两个数

    while(num.length<2){

    //在0~100之间随机产生数字

    var r = Math.floor(Math.random()*100);

    //把随机数放到数组中

    num.push(r);

    }

    //接受用户答题

    var result = prompt("请输入"+i+"题,"+num[0]+"+"+num[1]+"的答案:");

    //如果回答正确

    if(result == num[0]+num[1]){

    sum +=10;

    alert('回答正确,'+"得10分");

    //输入"exit"退出答题

    }else if(result == "exit"){

    break;

    //如果回答错误

    }else if(result != num[0]+num[1]){

    sum -= 10;

    alert('回答错误,'+'扣10分');

    }

    }

    alert("您最终得分为:"+sum);

    </script>

    二.时间对象

    // Date对象的原理:对象保存为一个巨大的毫秒,起始时间为: 1970年1月1日0点至今的毫秒数

    //封装了一个时间操作API

    //存储和获取时间的时候使用Date对象//创建方式:

    // 1、 自动获取客户端系统的时间 --服务器时间 -- 数据库时间

    var now new Date( );console.Log(now);

    // 2、创建自定义的时间var date = new Date("yy/MM/dd hh :mm:ss");

    var date = new Date("2019/07/31");console.Log(date);

    // 3、赋值一个日期对象

    var date1 = new Date("9102/08/01 16:40:30");

    var date2 = new Date (date1);console. Log (date1,date2);

    // 4、用毫秒数创建日期对象

    var date = new Date(ms)

    // console. log(now. getTime())

    var ms = now. getTime();

    var date3= new Date(ms);console. Log(date3);

    //两个日期对象相减:得到毫秒数console. Log (now-date) ;

    //单位:每个单位都有一对get / set方法// FullYear 年份

    // Moth 月份 0-11

    // Date 日期 1-31

    //Day 星期 0-6没有set方法

    // hours 小时 0- 24

    // Minutes 分钟 0-59

    // Seconds 秒 0-59

    // Milliseconds 毫秒

    时间对象练习题

    3.计算两个时间之间相差的小时数

    <script type="text/javascript">

    var startTime = new Date('2019-8-1 00:00:00'); // 开始时间

    var endTime = new Date(); // 结束时间

    console.log(Math.floor((endTime - startTime) / 1000 / 60 / 60)); // 小时

    </script>

    4.当前时间格式化为:  xxx年xx月xx日 星期x  am/pm hh:mm:ss

    <script type="text/javascript">

    var myDate = new Date();

    var year = myDate.getFullYear(); //获取完整的年份

    var month = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)

    var date = myDate.getDate(); //获取当前日(1-31)

    var day = myDate.getDay(); //获取当前星期X(0-6,0代表星期天)

    var hours = myDate.getHours(); //获取当前小时数(0-23)

    var min = myDate.getMinutes(); //获取当前分钟数(0-59)

    var ses = myDate.getSeconds(); //获取当前秒数(0-59)

    if(hours<12){

    var h = 'am';

    }else{

    var h = 'pm';

    }

    var arr = [year,month,date,day,hours,min,ses,h];

    console.log(arr[0]+"年"+arr[1]+"月"+arr[2]+"日,星期"+arr[3]+" "+arr[7]+arr[4]+":"+arr[5]+":"+arr[6]);

    </script>

    三.Function函数

    11个内置对象有哪些?

    String Number Boolean Array RegExp Error Date Math Function  Object global(window)

    Function 一切函数都是对象

    // 封装了可重复使用的代码块对象,函数名只不过是一个引用函数对象的变量

    var a = 10;

    // 1.创建01

    // 什么时候要将代码封装起来?独立的且可以反复执行的内容

    // 什么是需要使用参数?只要函数执行就必须使用的某些数据,否则无法正常执行 这些数据就定义为参数

    // 什么时候需要使用返回值?如果函数的调用者需要函数执行的结果,函数就必须有返回值

    // 声明:function 函数名(参数列表){函数体;return 返回值;}

    // 2、创建02 直接量!不希望函数体被提前声明时

    // var 函数名 = function(参数列表){函数体;return 返回值;}

    // var fun;

    // console.log(fun());//报错 变量的提前声明

    console.log(fun);//undefined 证明了函数名就是一个变量

    var fun = function(){

    console.log(1);

    }

    fun();

    // 声明提前:在程序开始执行前,都会将var声明的变量和function声明的函数都提到当前作用域中,赋值保留在原地

    // 3、创建03 用new

    var fun2 = new Function("a","b","return a+b;");

    // 强调:所有形参必须放在" "中

    console.log(fun2(2,3));

    var fun3 =Function("a","b","return a-b;");

    console.log(fun3(9,3));

    // 请问一下创建函数正确的是:

    function cmp(a,b){return a-b;}

    var cmp = function(a,b){return a-b};

    var cmp = new Function(a,b,"return a-b"); 错误

    var cmp = new Function("a","b","return a-b");

    四.重载

    什么是重载?

    相同函数名,不同参数列表的多个函数 在调用时,可以根据传入的参数的不同,自动选择对应的函数调用!

    一个函数名,执行过个操作

    when 一个任务,根据不同的参数,执行不同的操作流程

    function pay( ){

    // arguments[ ]

    console.log(typeof(arguments));

    // 如果参数个数为0

    if(arguments.length == 0)

    console.log('扫码支付')

    // 如果参数个数为1

    else if(arguments.length == 1)

    console.log("现金支付" + arguments[0]);

    // 否则参数个数为2

    else if(arguments.length == 2)

    console.log('刷卡支付,卡号:'+arguments[0]);

    }

    pay();//扫码支付

    pay(100);//现金支付

    pay("1111268686","123456");//刷卡支付

    问题:js语法不支持重载效果,不允许多个重名函数存在(存在也会被最后的覆盖)

    // 解决:arguments 对象 所有函数对象内,都自动创建了一个arguments对象

    // arguments对象:专门保存传入函数的所有参数值得类数组对象

    // 类数组对象(object like array)

    // 和数组的相同之处: 下标 length属性 for遍历

    // 不同: 类数组对象是Object,不是Array,无法使用Array的API

    // 数组是Array类型,可以使用自己的API

    //计算参数的总和

    function sum(){

    var sum=0;

    // 判断arguments是否有参数

    if(arguments.length>0){

    // 将参数累加

    for(var i =0;i<arguments.length;i++){

    sum += arguments[i];

    }

    }

    return sum;

    }

    五.作用域

    作用域(scope):一个变量的可用范围

     1、全局作用域window:全局变量

    随处可见,反复使用 ==>全局污染

     2、函数作用域:局部变量

    局部变量(AO:Action Object):仅在函数内可用,不可以反复使用

    函数生命周期:

     1)开始执行前(生命提前阶段)

     创建执行环境栈(数组):临时保存正在执行的函数的执行环境

    向执行环境中添加第一个默认程序main(),该方法创建出一个全局作用域的对象window

     2)定义函数时

     创建函数对象,封装函数的定义

     声明函数变量,引用了函数对象,函数对象的scope属性引用回,创建函数时的作用域

     3)调用函数时

    在ECS中加入一个新的元素(执行环境)记录新函数的调用

    创建一个活动对象,保存本次调用用到的局部变量(函数的参数,在函数体内使用var关键字声明的数据)

     ESC中的新执行环境元素 ,引用活动对象

     活动对象中的parent属性引用函数的scope指向的父级作用域对象

    作用:在执行过程中优先使用活动对象中的局部变量,局部中没有,才延着parent向父级作用域找

    4)调用函数后

     执行环境栈中本次函数的执行环境出栈

     导致活动对象被释放,导致局变量一同释放

     作用域链

    右多级作用域连续引用形成的链式结果

    掌握一切变量的使用顺序 :先在局部照,没有则延作用域链向父级作用域中找

    六.匿名函数

    不指定函数名的函数

     节约内存 一个函数只用一次,用完了就自动释放

     比如:

     1.回调 callback 将函数作为参数传递给另一个函数去调用

     arr.sort(function(a,b){return a-b})

     str.replace(/reg/g,function(kw...){return...})

     2.自调:创建函数以后立刻自动调用自己

    一个函数只执行一次,不会再重新使用。

     意义:建立临时作用域!避免全局污染!!!!

     调用:2种

     1.(function(参数列表){函数体 return返回值})()

     2.+function(参数列表){函数体 return 返回值}()

    七.闭包

    // 全局变量:可以反复使用,随处可用 -- 全局污染

    // 局部变量:不可以重用 ,只在函数中使用

    // 闭包:即重用变量,又保护变量不被污染的一种机制

    // 取号

    // 1、用外层函数包裹受保护的变量和操作变量的内层函数

    function outer(){

    var i = 1;//活动对象,函数作用域

    i = i + 2;//3

    // 2、外层函数将内层函数返回

    return function getNum(){

    console.log(i++);

    }

    }

    // 3、使用者调用外层函数,获得内存函数的对象

    var getNum = outer();

    //getNum:function getNum(){console.log(i++)}

    // 问题:outer()结束后,outer的活的对象释放?

    getNum();//1

    getNum();//2

    getNum();//3

    //......

    i = 1;//window对象下的变量

    getNum();//4

    getNum();//5

     缺点:比一般函数占用更多内存

     简易的闭包流程图

     1、先找到受保护的变量,判断外层函数执行后变量的结果

     2、再找操作变量的内层函数

     1)被外层函数return到外部

     2)也可通过直接给全局变量赋值

  • 相关阅读:
    img标签为什么可以设置宽高
    高度和宽度的操作
    自增自减运算符
    读取标签内容:innerHTML和innerText的区别 text()和html()的区别
    js中的常用方法
    js中style,currentStyle和getComputedStyle的区别以及获取css操作方法(考虑兼容性和局限性)
    IE盒模型与W3C盒模型区别
    css四种定位方式及其区别
    css隐藏元素的方法何区别
    Hibernate之HQL
  • 原文地址:https://www.cnblogs.com/hyh888/p/11302625.html
Copyright © 2011-2022 走看看