• JavaScript基础

    目录

    数据类型

    基本数据类型

    引用数据类型

     变量

    运算符

    算数运算符

     赋值运算符

    字符串连接符

    关系运算符

     逻辑运算符

     三目运算符

    分支语句

    循环语句

    流程控制语句

    错误处理

    函数

    数组

    对象

    内置对象

    String

    RegExp

    Math

    Date

    全局函数

    简介： 是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。

    作用：

                     1.与用户交互 

                     2.操作html标签 

                     3.操作css样式

                     4.业务处理

    代码书写位置：

                            1.在script标签中书写

    1. <!DOCTYPE html>
    2. <html>
    3. 	<head>
    4. 		<meta charset="utf-8" />
    5. 		<title></title>
    6. 		<script type="text/javascript">
    7. 			console.log("你好世界");
    8. 		</script>
    9. 	</head>
    10. 	<body>
    11. 		
    12. 	</body>
    13. </html>

                            2.在js文件中书写,通过link，使用script标签引入

                            3.在标签事件中引入

    注释：都行

    1. //
    2. /**/

    输出：

    console.log("输出的内容");

    数据类型

            js为弱类型语言,Java为强类型语言

            一律使用var定义，但是其中存储的值是有类型的

    基本数据类型

            Undefined - - (未定义)

           Null- - (空的)因为从逻辑的角度null指向空对象指针,所以使用typeof关键字得到的数据 类型为  object

            Number - - (数字)

            Boolean- - (布尔值)

            String- - (字符串)

    引用数据类型

    Object与它的子类

            例：array(数组),function(函数),date(时间)

    1,可以通过typeof关键字,获取数据的数据类型,null值的数据类型是Object

             typeof的用法:

                            typeof 值/变量名;

    1.             var a1= "123";
    2. 			console.log(typeof a1);

     

    2,所有基本数据类型的数据都可以作为boolean型使用

                             0,null,undefined,""对应的boolean型为false

    特殊值：

    null:空

    undefined:未定义

    NaN:是not a number的缩写，表示不是一个合法的数字.其类型为number.

     变量

    语法:var 变量名 = 值;

    例：

    1. var a = 10;
    2. var b = 10.1;
    3. var c = true;
    4. var d = "xx";
    5. var e = 'a';
    6. var f = null;
    7. var g;
    8. var h = function(){
    9. console.log("自定义函数");
    10. };
    11. var i = [];
    12. i[0] = 10;
    13. var o = {"name":"张三","sex":"男","eat":function()
    14. {console.log(this.name+"吃饭")}};//定义一个对象

    运算符

    算数运算符

    +,-,*,/,%

    注意:js中不分整数与小数,所以当10/3结果为3.33333循环

     赋值运算符

    =,+=,-=,*=,/=,%=

    字符串连接符

    +

    关系运算符

    、>=、<=、== 、!=、===(绝对等于：值和类型都相同)

    1. var a=10;
    2. var c="10";
    3. console.log(a==10);
    4. console.log(a===c);

     逻辑运算符

    &&      与

    ||        或

    !         非

    js中所有类型的变量都可以作为boolean型变量使用 0,null,undefined,""(空字符)都是false

    &&当所有值为真,返回最后一个表达式的值.当表达式中有假返回第一个假的表达式

    ||当所有值为假,返回最后一个表达式的值,当有一个为真,返回第一个为真的表达式

    1. var a = 1;
    2. var b = true;
    3. var c = "xx";
    4. var d = 0;
    5. console.log(a && b && c);
    6. console.log(d && b && c);
    7. a = 0;
    8. b = false;
    9. c = "";
    10. d = 1;
    11. console.log(a || b || c);
    12. console.log(d || b || c)

     三目运算符

    语法:var 变量名 = 条件表达式?值1:值2;

    条件为true真，返回值1

    条件为false假，返回值2

    分支语句

    if

    switch

    1. switch(n){
    2.     case v1:
    3.     代码1;
    4.         break;
    5.     case v2:
    6.     代码2;
    7.         break;
    8.     case v3:
    9.     代码3;
    10.         break;
    11.     ...
    12.     case vN:
    13.     代码N;
    14.         break;
    15.     default:
    16.         代码M;
    17.         break;
    18. }

    循环语句

    while

    do while

    for

    流程控制语句

    break

    continue             

      也可以使用标记，跳出多层循环

    1. a: for(var i=0 ;i<10;i++){
    2. 	for (var j = 0 ; j < 10 ; j++) {
    3. 		for (var k = 0;k < 10; k++) {
    4. 			console.log(i*100+j*10+k);
    5. 			if(i==5){
    6. 			break a;
    7. 			}
    8. 		}
    9. 		
    10. 	}
    11. }

    错误处理

    1. try{
    2. 	var c = new Array(9999999999);//会产生RangeError
    3. }catch(RangeError){//
    4. 	console.log("超出范围")//出现错误执行的代码
    5. }finally{
    6. 	console.log("必须执行的代码");//不管有没有错必须执行的代码
    7. }

    函数

    由于是弱类型，不用写返回值类型，参数列表直接传值

    语法1:

                     funation 方法名(形参列表){

                            方法体

                     }

    1. function add(a,b){
    2. 	return a+b;
    3. }

    语法2

                    var 变量名 = function(形参列表){

                            方法体

                     }

    1. var sum = function(a,b){
    2. 	return a+b;
    3. }

    调用：

    方法名(实参列表);//不接收返回值

    var 变量名 = 方法名(实参列表);//接收返回值

    数组

    数组的定义

                    方式1:var 数组名 = [];

                    方式2:var 数组名 = new Array();

          1. 取值语法:数组名[下标]

           2 .改值语法:数组名[下标] = 值;

           3.尾部添加:数组名.push(值或其他数组); 

    1. var a1=[1,2,3,4];
    2. var a2=new Array();
    3. a2=[5,6,7,8];
    4.  
    5. a1.push(a2);
    6.  
    7. console.log(a1);
    8. console.log(a1[4]);
    9.  
    10. 当数组被当作值添加时，被添加的下标所对应的时被添加的数组

     

          4.  删除值:delete 数组名[下标];

                    删除之后，此处的值会为空，还会占用下标

    1. console.log(delete a1 [0])
    2. console.log(a1)

         5.删除的返回值为布尔型

            获取长度:var 变量名 = 数组名.length;

    对象

    对象的定义

            方式1:{ },直接创建对象

    1. var student = {
    2. 	"name":"巴尔",
    3. 	"sex":"女",
    4. 	"age":2500,
    5. 	"cook":function(){
    6. 		console.log(this.name+"做饭");	
    7. 	}
    8. }
    9.  
    10. student.cook();//调用属性或方法

            方式2:构造器

    1. function User (name,age){
    2. 	this.name = name;
    3. 	this.age = age;
    4. 	
    5. 	this.eat = function(){
    6. 		console.log(this.name + "干饭");
    7. 	}
    8. }
    9.  
    10. var s1 = new User("布耶尔",500);//先new
    11. s1.eat();//再调用

    添加属性或方法：

    使用prototype方法

    1. function User (name,age){
    2. 	this.name = name;
    3. 	this.age = age;
    4. 	
    5. 	this.eat = function(){
    6. 		console.log(this.name + "干饭");
    7. 	}
    8. }
    9.  
    10. User.prototype.sex="女";//添加属性，只能默认了是这个了
    11. User.prototype.cook=function(){//添加函数
    12. 	console.log(this.name+this.sex+"做饭");
    13. }

    内置对象

    类似与jdk提供的类

    String

    1. 1.创建String对象
    2. var str1 = "qwer";
    3. var str2 = new String("java");
    4.  
    5. 2.属性
    6.  length属性获取当前字符串的长度
    7. var len = str1.length;
    8.  
    9. 3.常用函数
    10. charAt : 获取str1中索引为3的字符（索引从0开始）
    11. var c = str1.charAt(3);
    12.  
    13. indexOf: 获取str1中第一次出现"edu"的索引
    14. var i = str1.indexOf("edu");
    15.  
    16. lastIndexOf: 获取str2中最后一个“o”的索引
    17. var j = str2.lastIndexOf("o");
    18.  
    19. split :分隔字符串，将str1用"."分隔成多个字符串，存放到arr中
    20. var arr = str1.split(".");
    21.  
    22. substring : 从str1字符串索引为4的位置开始截取，直到str1结束
    23. var s1 = str1.substring(4);
    24.  
    25. 从str1字符串索引为4的位置开始截取(包含)，直到索引为9的位置(不包含)
    26. var s2 = str1.substring(4,9);
    27.  
    28. substr:从str1字符串索引为4的位置开始截取(包含),一共截取5个字符
    29. var s3 = str1.substr(4,5);
    30.  
    31. toUpperCase : 将str2所有字母都转大写
    32. var s4 = str2.toUpperCase();
    33.  
    34. toLowerCase : 将str2所有字母都转小写
    35. var s5 = str2.toLowerCase();
    36.  
    37. match : 判断str3字符串的格式是否匹配reg的规则，如果不匹配则返回值为null,正确
    38. 返回该值
    39. var str3 = "1303030330"; //假设str3是用户在页面输入的手机号
    40. var reg = "^1[3,5,7,8]\\d{9}$"; //手机号码的规则（正则表达式）
    41. var b = str3.match(reg);

    RegExp

    1.  
    2. var str = "1303030330";
    3.  
    4. // 一个RegExp对象就是一个正则规则，RegExp对象的test函数进行正则校验
    5. var reg = new RegExp("^1[3578]\\d{9}$");
    6.  
    7. //test 函数：如果匹配返回true，不匹配返回false,匹配返回true
    8. var b = reg.test(str);

    正则表达式：

    Math

            var e = Math.E;//获取e值

            var pi = Math.PI   ;//获取pi值 

    随机数：      

    1.    //random : 随机产生一个[0,1)小数
    2.     var num = Math.random()

    对数字简单处理： 

    1.  
    2. //round : 对参数进行四舍五入得到一个整数
    3. var i = Math.round(num); //0-10
    4.  
    5. //floor：只舍不入，获取比参数小的最大整数
    6. var j = Math.floor(num); //0-9
    7.  
    8.  
    9. //ceil: 只入不舍，获取大于等于参数的最小整数
    10. var k = Math.ceil(num);
    11.  
    12. // abs : 获取参数的绝对值
    13. var m = Math.abs(-5);
    14.  
    15. //sqrt : 获取参数的平方根
    16. var n = Math.sqrt(9);

    Date

    1. //1.创建Date对象:一个Date对象就表示一个时间，new Date()表示系统当前时间
    2. var date = new Date();
    3.  
    4. //2. 函数
    5. // set*: 设置当前日期的日期成分
    6. date.setFullYear(2029);
    7. date.setMonth(11);
    8. date.setDate(28);
    9.  
    10. // get* : 从当前日期对象中获取 时间成分 （年月日时分秒毫秒星期）
    11. var year = date.getYear()+1900; //获取年份，相对于1900年的偏移年份
    12. var year2 = date.getFullYear(); //今夕是何年？
    13. var month = date.getMonth()+1; //获取月份0-11
    14. var d = date.getDate(); //获取日期
    15. var hour = date.getHours(); //获取小时
    16. var min = date.getMinutes(); //获取分钟
    17. var sec = date.getSeconds(); //获取秒
    18. var ms = date.getMilliseconds(); //获取毫秒
    19. var day = date.getDay(); //获取星期
    20. var timeStr = year+"年"+month+"月"+d+"日 "+hour+":"+min+":"+sec+" "+ms+"ms"+" 星期"+day;
    21. console.log(timeStr);

    全局函数

    简介:通过全局对象Functions调用全局函数，Functions没有名称，因此全局函数可以直接调用

    1. //parseInt：将字符串转换成整数数值
    2. var s1 = "123";
    3. var m = parseInt(s1);
    4.  
    5. //parseFloat：将字符串转换成小数数值
    6. var s2 = "3.14";
    7. var n = parseFloat(s2);
    8. var url = "http://www.baidu.com/?param=中华有我";
    9.  
    10. //encodeURI ： 对网址的参数部分进行编码（特殊符号和中文
    11. var newUrl = encodeURI(url);
    12.  
    13. //decodeURI：对编码后的网址进行解码
    14. var url2 = decodeURI(newUrl);
    15.  
    16. //escape：对字符串中的特殊和中文进行编码
    17. var str1 = "My name is 赵日天";

  • 相关阅读:
    linux安装dockercompose
    sqoop 脚本密码管理
    MySQL学习笔记19
    ABP中的数据过滤器
    《010.SpringBoot+vue之学生选课管理系统02》
    SAP教程之 Sap S/4HANA的未来是什么？它会取代 SAP ABAP 吗？
    OpenCV4经典案例实战教程 笔记
    计算机毕业设计选题推荐-校园失物招领微信小程序/安卓APP-项目实战
    iOS 自动续期订阅,订阅升级降级、订阅时间、退收费处理
    选择适合户外篷房企业的企业云盘解决方案
  • 原文地址：https://blog.csdn.net/weixin_44207220/article/details/127773047