zoukankan      html  css  js  c++  java
  • 第五十二天js的·进阶

    1.上一节内容的补充:

      1.1逻辑操作符:&&(与)||(或)!(非)

    var n1=0;
    var n2=1;
    var n3=n1&&n2;
    var n4=n1||n2;
    var n5=!n1;
    console.log(n3);  //当逻辑与操作是数字的时候,若是前面是非零数字则返回后面的数字
    console.log(n4);  //当逻辑或操作是数字的时候,若是前面是非零数字则返回前面的数字
    console.log(n5);  //
    
    结果为
    0
    01上街内容补充.js:10 1
    01上街内容补充.js:11 true
    View Code

      1.2switch 操作:

    var n=5;
    switch(n){
        case 1:console.log('这个值是一');
        case 2:console.log('这个值是2');
        case 3:console.log('这个值是3');
        case 5:console.log('这个值是5');
        default:console.log('这个值和预想的不一样'); //当上面所有条件都不符合时,执行这一个
    }
    结果为
    这个值是5
    01上街内容补充.js:18 这个值和预想的不一样
    View Code

    2.js中函数:

      2.1函数的定义:python中使用def ,js中使用function来进行定义,定义规则为:function  函数名(参数)

    function foo(a,b){
        console.log('a+b=',a+b);
    }                               //定义一个函数
    foo(11,13)    //函数的调用
      
    结果为
    a+b= 24
    View Code

      2.2带有返回值的函数:

    function foo(a,b){
        console.log('a',a);
        console.log('b',b);
        return a+b;
    }                               //定义一个函数
     var ret=foo(11,13)    //函数的调用
    console.log('a+b=',ret);
    View Code

      2.3在python中使用lambda作为匿名函数,经常和map、filter、min、max进行连用,但是js试着这定义匿名函数的:(在js中不建议使用)

     var func=function foo(a,b){
        console.log('a',a);
        console.log('b',b);
        return a+b;
    }      //定义匿名函数
    var ret=func(11,55);
    console.log('a+b=',ret);
    
    结果为
    a 11
    01上街内容补充.js:33 b 55
    01上街内容补充.js:37 a+b= 66
    View Code

      2.4js中立即执行的函数:(不需要进行调用)

    (function(a,b){
        console.log('a',a);
        console.log('b',b);
    })(11,'alex');  //立即执行函数
    View Code

    3.作用域:

      3.1和pyton一样,外部无法访问到函数内部定义的变量,(用立即执行函数来防止变量污染全局变量)(即函数里的变量在函数执行结束就是放空间)

      3.2在python进行函数的参数传递时,数据的数量不能多也不能少,否则会报错,但是js会有什么情况那:

    function foo(a,b){
        console.log('a',a);
        console.log('b',b);
    };
    var ret=foo(111,33,44); //当传入多个数据量时
    结果为
    a 111
    01上街内容补充.js:40 b 33
    View Code

      从结果我们可以发现并没有产生什么影响。(传入的数据量>形参量)

    function foo(a,b){
        console.log('a',a);
        console.log('b',b);
    };
    var ret=foo(111); //当传入多个数据量时
    01上街内容补充.js:39 a 111
    01上街内容补充.js:40 b undefined
    View Code

      从结果我们可以看出当传入的数据量<参数时,为传入的输入定义为undefined。

      3.3.在python中如果我们不确定传入的数据量的时候,使用*args,那么在js中我们使用arguements:

    function func1(){
        var ret=0;
        console.log('总共有'+arguments.length+'个参数');
        for (var i=0;i< arguments.length;i++){
            ret+=arguments[i];
        }
        console.log(ret)
    }
    func1(11,33,44,55,66);
    结果为
    总共有5个参数
    01上街内容补充.js:49 209
    View Code

      3.4在python函数内部如果找不到变量,则向函数外层进行查找,直到找到最外层,如果还是找不到在python中会报错(但在js中会输出打印undefined)

             1看下面函数写出输出结果:

    function f(){
        var city='shenzhen';
        function inner(){
            var city='shanghai';
            console.log(city);
        }
        inner()
    }
    f()
    结果为
    shanghai
    View Code

          2.函数调用的作用域

    var city='beijing';
    function bar(){
        console.log(city);
    }
    function  f(){
        var city='南京';
        return bar;
    }
    ret=f();
    ret();
    结果为
    beijing
    View Code

        3.闭包的作用域:

    var city='nanjing';
    function f(){
        var city='beijing';
        function inner(){
            console.log(city);
        }
        inner();
    }
    f()
    结果为
    beijing
    View Code

    4.js中的词法分析:

    当函数调用前的一瞬间,会先激活一个对象:Active Object(AO),并会分析以下3个方面:

    1.函数参数:如果有,则将此此函数给AO,并且刚开始赋值undefiend;如果没有,则不做任何操作;

    2.函数局部变量,如果AO上有同名的值,则不做任何操作,如果没有则将此值赋给AO,并且值为undefined;

    3.函数声明:如果AO上有,则会蒋AO的对象覆盖,如果没有则不做任何操作:

    var age=10;
    function f() {
        console.log(age);
        var age=10;
        console.log(age);
    }
    f();
    结果为
    undefined
    02词法分析.js:8 10
    View Code
    var age=10;
    function f() {
        console.log(age);
        console.log(typeof age);
        age();
        var age=10;
        console.log(age);
        function age(){
            console.log('Hehe');
        };
    }
    f();
    结果为
    ƒ age(){
            console.log('Hehe');
        }
    02词法分析.js:7 function
    02词法分析.js:12 Hehe
    02词法分析.js:10 10
    View Code

    5数组·的两种写法:

    var list1=[1,3,4];
    var list2=new Array(1,3,4);  //定一个对象时要使用new关键字
    console.log(list1);
    console.log(list2);
    View Code

    6.遍历对象中属性的方法:(在js中键(属性)默认可以不加引号,也代表字符串)

    var list2=new Array(1,3,4);  //定一个对象时要使用new关键字
    for(var i in list2){
        console.log(i);
    };
    dic1={
        name:'alex',
        age:'133'
    }
    for (var i in dic1){
        console.log(i) ;  //获取字典中的键
        console.log(dic1[i]);// 获取字典中的values
    }
    
    结果为
    0
    02词法分析.js:22 1
    02词法分析.js:22 2
    02词法分析.js:29 name
    02词法分析.js:30 alex
    02词法分析.js:29 age
    02词法分析.js:30 133
    View Code

    7.看下面一个程序写出你的结论:

    var s1='name';
    dic1={
        name:'alex',
        age:'133'
    }
    console.log(dic1.name);  //直接去字典对象里的属性值;
    console.log(dic1[s1]);    //如果全局变量里有这个变量先去把全局变量的值放进去然后再去找属性的值(全局变量的值是字典的属性)
    alex
    02词法分析.js:38 alex
    View Code

    8.自定义一个类对象:

    var person=new object();
    person.name='alex';
    person.age=14;
    console.log(person);
    结果为
    View Code

    9.date对象:

      1.显示字符串时间:

    var d1=new Date();
    console.log(d1);
    console.log(d1.toDateString()) //显示字符串时间
    console.log(d1.toUTCString())  //显示utc字符串时间
    
    Sun Mar 29 2020 18:50:06 GMT+0800 (中国标准时间)
    02词法分析.js:45 Sun Mar 29 2020
    02词法分析.js:46 Sun, 29 Mar 2020 10:50:06 GMT
    View Code

      2.显示自定义格式的时间:

    var d1=new Date();
    console.log(d1.toDateString())
    console.log(d1.getDate())  //获得日期
    console.log(d1.getDay())  //获得周几
    console.log(d1.getMonth())//获得这是第几个月
    console.log(d1.getFullYear())//获取完整的年
    console.log(d1.getHours()) //获取小时
    console.log(d1.getMinutes()) //获取分钟
    console.log(d1.getSeconds())//获取秒数
    
    
    结果为
    Sun Mar 29 2020
    02词法分析.js:50 29
    02词法分析.js:51 0
    02词法分析.js:52 2
    02词法分析.js:53 2020
    02词法分析.js:54 18
    02词法分析.js:55 56
    02词法分析.js:56 44
    View Code

      3.题目:

    function s11(a){
        switch(a){
            case 0:return '星期天';
            case 1:return '星期一';
            case 2:return '星期二';
            case 3:return '星期三';
            case 4:return '星期四';
            case 5:return '星期五';
            case 6:return '星期六';
        }
    
    }
    var d1=new Date();
    var y1=d1.getFullYear();
    var r1=d1.getDate();
    var day1=d1.getDay();
    var day11=s11(day1);
    var M1=d1.getHours();
    var s1=d1.getMinutes();
    var m1=d1.getMonth()+1;
    var time1=y1+'-'+
            m1+'-'+
            r1+' '+
            M1+':'+
            s1+' '+
            day11;
    
    console.log(time1);
    结果为
    2020-3-30 13:0 星期一
    View Code

     10.js中的json:

      上传:

    dic1={
        name:'1la',
        age:123
    }
    var ret=JSON.stringify(dic1)
    console.log(ret);
    View Code

      下载:

    dic1={
        name:'1la',
        age:123
    }
    var ret=JSON.stringify(dic1)
    console.log(ret);
    var s1=JSON.parse(ret);
    console.log(s1);
    结果为
    {name: "1la", age: 123}
    View Code

    11.math里面的对象:(和python一样):

    var n=-2;
    console.log('绝对值',Math.abs(n));
    console.log('e的指数',Math.exp(n));
    console.log('对数进行下舍入',Math.floor(3.55));
    console.log('返回最大值',Math.max(1,4,5));
    console.log('返回最小值',Math.min(1,4,3,6));
    console.log('x的y次幂',Math.pow(3,2));
    console.log('0到1之间的数',Math.random());
    console.log('四舍五入最近整数',Math.round(4.6));
    console.log('正弦函数',Math.sin(1));
    console.log('平方根',Math.sqrt(4));
    console.log('正切',Math.tan(4));
    结果为
    绝对值 2
    02词法分析.js:68 e的指数 0.1353352832366127
    02词法分析.js:69 对数进行下舍入 3
    02词法分析.js:70 返回最大值 5
    02词法分析.js:71 返回最小值 1
    02词法分析.js:72 x的y次幂 9
    02词法分析.js:73 0到1之间的数 0.11636405034878616
    02词法分析.js:74 四舍五入最近整数 5
    02词法分析.js:75 正弦函数 0.8414709848078965
    02词法分析.js:76 平方根 2
    02词法分析.js:77 正切 1.1578212823495777
    View Code

    12.修改某个网页的价格:

     SpeedyPlay Info: waiting...
    document.body.contentEditable=true
    View Code

    13.正则表达式:

      13.1正则表达式的第一种写的形式:

    var r1=new RegExp('^[a-zA-Z][a-zA-Z0-9]{3,8}$' );
    var r2=r1.test('alex')
    console.log(r2);
    结果为
    true
    View Code

      13.2正则表达式的第二种表达形式:

    console.log(/^[a-zA-Z][a-zA-Z0-9]{3,8}$/.test('alex'))
    结果为
    true
    View Code

      13.3正则表达式中间不能有空格,否则结果会出先偏差,一直会是错的:

    console.log(/^[a-zA-Z][a-zA-Z0-9]{3, 8}$/.test('alex'))
    结果为
    false
    View Code

      13.4:正则表达式中进行字符串的替换不是再元字符串上替换,而是生成一个新的字符串:

    var r1='aAjfjjAafjj';
    var r2=r1.replace('a','ddd')
    console.log(r2);
    结果为
    dddAjfjjAafjj
    View Code

      13.5从上述结果可以看出只能替换一个:结果方法加一个全局变量g  i代表忽略大小写

    var r1='aAjfjjAafjj';
    var r2=r1.replace(/a/g,'ddd')
    console.log(r2);
    结果为
    dddAjfjjAdddfjj
    View Code
    var r1='aAjfjjAafjj';
    var r2=r1.replace(/a/g,'ddd')  //所有都替换
    var r3=r1.replace(/a/gi,'ddd') //不仅所有替换,而且显示double
    console.log(r2);
    View Code

      13.6当正则表达式使用全局模式进行匹配时,并且让你配配一个字符串时,此时会引出一个lastindex,lastindex会记住上次匹配成功的位置:

    var r1=/alex/g;
    console.log(r1.test('alex'));
    console.log(r1.test('alex'));
    console.log(r1.test('alex'));
    console.log(r1.test('alex'));
    结果为
    true
    02词法分析.js:87 false
    02词法分析.js:88 true
    02词法分析.js:89 false
    View Code

      

  • 相关阅读:
    springboot嵌入式servlet容器的自动配置以及原理
    简单认识springboot的错误处理机制
    使用springboot来编写web项目的一些实现
    spring-cloud-starter-openfeign 源码详细讲解
    简述application.properties和application.yml 以及 @ConfigurationProperties 和@PropertySource @Value 和@ImportResource的用法,区别
    Ribbon源码分析(二)-- 服务列表的获取和负载均衡算法分析
    git的详细使用,项目创建到同步远程仓库,版本回退,忽略文件,分支创建,分支合并,分支名称修改,冲突解决,项目迁移
    Ribbon源码分析(一)-- RestTemplate 以及自定义负载均衡算法
    eureka源码--服务的注册、服务续约、服务发现、服务下线、服务剔除、定时任务以及自定义注册中心的思路
    eureka集群的搭建
  • 原文地址:https://www.cnblogs.com/ab461087603/p/12594547.html
Copyright © 2011-2022 走看看