Java教程

Javascript基础学习笔记(Ⅱ)

本文主要是介绍Javascript基础学习笔记(Ⅱ),对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

前言:此Javascri基础学习笔记是需要有其他语言的基础(C/C++/Java等),与其他语言重复或类似的部分不在此学习笔记中。且仅为基础学习。

六.函数基础

<!-- 函数基础 -->
<!-- 用户登录 -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>

        function checklogin(username,password)
        {
            if(username==="admin"&&password==="123"){
                return true;
            }
            else{
                return  false;
            }
        }
        console.log(checklogin("123","admin"));
    </script>
</body>
</html>

七.对象

<!-- 对象 -->
<!-- 对象的分类
    自定义对象:封装
    内置对象:(例如Date,获取当前时间)
    宿主对象(document)
    第三方库的对象(JQuery Vue)
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var cat={
            name:"TOM",
            age:3,
            sayName:function(){
                console.log("I am "+this.name) 
            }
        }
        console.log(cat.name);
        console.log(cat["age"]);
        cat.name="邦邦"
        cat.sayName();
    </script>
</body>
</html>

八.数组

<!-- 数组 -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var list1=[1,2,3,4,5];     //可以存放不同类型数据
        var list2= new Array("a","b","c");
        var list3=["java","c","c++"];
        var list4=[1,3,6,5,2,7,9];
        // var length=list1.length;
        // console.log(length);
        // for in遍历(i为索引)
        for(var i in list1){
            console.log(list1[i]);
        }
        // for of遍历(i为值)
        for(var j of list2){
            console.log(j);
        }
        //map方法循环
        list3.map(function(value,index){
            console.log(value);
        });
        //push方法 ,增加元素到数组中
            list1.push(6);
            console.log(list1);
        //sort方法 排序
            list4.sort();
            console.log(list4);
        //filter方法  过滤
            var newList=list1.filter(function(item){
                if(item>=3)
                    return item;
            })
            console.log(newList);
        //join方法  连接数组成为字符串
            var str=list2.join("");
            console.log(str);
        //String的split方法    字符串分为数组
        var str1="2022-2-12";
        var list5=str1.split("-");
        console.log(list5);
        // 结合数组与对象
        var list6=[
            {name:"张三",age=1}
            {name:"李四",age=2}
            {name="王五",age=3}
        ]
        // 获取数据:list[0].name
            </script>
        
</body>
</html>

九.内置对象

<!-- 内置对象,使用现成的功能  Math部分-->
<!-- Array  数组
    Math    数学
    Date    日期
    RegExp  正则表达式
-->
<!-- Math.floor: 向下取整
    Math.random():0-1随机数
    Math.abs():绝对值
    Math.sqrt():开方
    Math.pow(2,4):乘方
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var number1=3.14;
        var ret1 =Math.floor(number1);
        var ret2 =Math.pow(2,4);     //2的4次方
        var number2=Math.floor(Math.random()*10+1);   //0-10的随机数
        console.log(number2);
        var list=["Java","C","C++","Php","Javascript"];
        var index=Math.floor(Math.random()*list.length);
        console.log(list[index]);
    </script>
</body>
</html>
<!-- 内置对象   Date部分 -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // var d=new Date();
        // var year =d.getFullYear();
        // var month=d.getMonth();    //0-11月
        // var date=d.getDate();
        // var day=d.getDay();     //获取星期
        // var hours=d.getHours();
        // var minutes=d.getMinutes();
        // var seconds=d.getSeconds();
        var ret =d.getTime();     //时间戳格林威治时间起至现在的总毫秒数
        console.log(ret);
        // 计时器方法setinterval
        setInterval(function(){
            var d=new Date();
            var hours=d.getHours();
            var minutes=d.getMinutes();
            var seconds=d.getSeconds();
            console.log(hours+":"+minutes+":"+seconds);
        },1000)
    </script>
</body>
</html>

十.正则表达式

<!-- 正则表达式用来匹配字符串 -->
<!-- 通过正则表达式,实现字符串的截取或按规则替换和验证字符串内容-->
<!-- 1.验证邮箱格式
    2.字符串"2020-01-01",将数字部分截取出来
    3."123a456b789c",去掉字符串中的所有字母(replace("a","1"))-->
    <!-- 正则表达式的语法 
        ^:开头   $:结尾    []:范围     {}:位数     ():分组
        +:匹配1位或多位,同{1,}     ?:0位或1位,同{0,1}
        .:匹配所有    \:转义      \d:数字  同[0-9] 
        \w:数字,字母,下划线        \s:空格或换行
    -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var reg1=new RegExp("123");//创建正则表达式 var reg=/123/
        var str1="123";
        var result1 =reg1.test(str1);    //返回值为布尔
        console.log(result1);
        //中括号表示范围  一位小写字母
        var reg2 =/^[a-z]$/;  //规定固定的格式
        var str2="a";
        var result2=reg2.exec(str2);  //返回值为匹配的内容/null
        console.log(result2);

        var reg3=/^[0-9]{11}$/;       //{11}为位数
        var str3="18888888888";
        var result3=reg3.test(str3);
        console.log(result3);

        var reg4=/^[a-z0-9]+$/;    //字母数字
        var str4="en8535";
        var result4=reg4.test(str4);
        console.log(result4);
        
        var reg5=/^\w$/;    //相当于/^[a-z0-9A-Z_]$/  字母数字大小写下划线
        var reg6=/^.+$/;    //一位或多位  匹配所有
        var reg7=/^1\+$/    //+表示普通加号,非表示一位或多位

    </script>
</body>
</html>

这篇关于Javascript基础学习笔记(Ⅱ)的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!