五、JavaScrip基础

6、语法与变量

变量:什么是变量
在这里插入图片描述
什么是强类型和弱类型?
在这里插入图片描述

8、一元运算符

在这里插入图片描述

9、比较运算符

10、逻辑运算符

注意:
对于【比较运算符】:如果2个变量之间比较,除了全等之外,如果不是同类型那么要先转换成同类型再比较内容,返回布尔值
对于【逻辑运算符“!”】:如果【!(变量)】不是布尔值,就会转换为布尔值,是true,是false看下面
在这里插入图片描述
Demo:

number转布尔值

var a = 1;
document.write(!a)	//true

null转布尔值

var c =null;

以前判断对象是否为空
if(c != null){
document.write(c)	//true
}

现在··
if(c){
document.write(c)	//true
}

String转布尔值

var b = "123"

以前的死循环
if(b != null && b.length > 0){
documen.write(b)	//true
}

利用JS特性
if(b){
document.write(b)	//true
}

12、JS的特殊语法

  • 语句结束可以加分号,也可以不加【建议加】
  • 定义变量用var,也可以不用。用var就是局部变量,不用就是全局变量。【建议用var】

这样写虽然多了一行代码,但是符合正常逻辑。
var a;
funation( ) {
a = 3;
}
alter(3)

13、JS流程控制

在这里插入图片描述
在这里插入图片描述

14、嵌套表格的99乘法表

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>嵌套表格的九×九乘法表</title>
    <style>
        /*给每个单元格设置边框*/
        td{
            border: 1px solid;
        }
    </style>
    <script>
        document.write("<table align='center'>");

        for (var i = 1; i <=9 ; i++) {//行

            document.write("<tr>"); //每行对于表格每行
            for (var j = 1; j <=i ; j++) {//列

                document.write("<td>");//每列对于表格每个单元格
                document.write(i + " * " + j + " = " + ( i*j) +"&nbsp;&nbsp;&nbsp;");
                document.write("</td>");//第n个表格单元格结束
            }

            document.write("</tr>")//n行结束
        }
        document.write("</table>");


    </script>

</head>
<body>

</body>
</html>

15、Function对象

1. Function:函数(方法)对象
            1. 创建:
                1. var fun = new Function(形式参数列表,方法体);  //忘掉吧
                2. 
                    function 方法名称(形式参数列表){
                        方法体
                    }

                3. 
                   var 方法名 = function(形式参数列表){
                        方法体
                   }
            2. 方法:

            3. 属性:
                length:代表形参的个数
            4. 特点:
                1. 方法定义是,形参的类型不用写,返回值类型也不写。
                2. 方法是一个对象,如果定义名称相同的方法,会覆盖
                3. 在JS中,方法的调用只与方法的名称有关,和参数列表无关
                4. 在方法声明中有一个隐藏的内置对象(数组),arguments,封装所有的实际参数
            5. 调用:
                方法名称(实际参数列表);
		

解释说明:

3、 在JS中,方法的调用只与方法的名称有关,和参数列表无关

扫描二维码关注公众号,回复: 10553421 查看本文章
 		// 第一种
        function add(a,b) {
            alert(a);
        }
        add(1); //1

        //第二种
        function add2(a,b) {
            alert(a);
        }
        add2(1,2); //1

        //第三种
        function add3(a,b) {
            alert(a);
            alert(b);
        }
        add3(1,2,3);  //1 and 2

        //第四种
        function add4(a,b) {
            alert(a)
            alert(b)
        }
        add4()   //underfined and underfined

4. 在方法声明中有一个隐藏的内置对象(数组),arguments,封装所有的实际参数
【是用arguments来接收实际参数,方法的参数可以不用写】

arguments就像Java的数组:
        function add() {
            alert(arguments[0])
            alert(arguments[1])
        }

        add(1, 2)    //1 and 2 


求任意数的和:
        function add() {
            var sum = 0;
            for (var i = 0; i < arguments.length; i++) {
                sum += arguments[i];
            }
            return sum;
        }
       var a = add(1,2,3,4);
        alert(a)    //10 

16、Arrays对象

Array:数组对象
            1. 创建:
                1. var arr = new Array(元素列表);
                2. var arr = new Array(默认长度);
                3. var arr = [元素列表];
            2. 方法
                join(参数):将数组中的元素按照指定的分隔符拼接为字符串
                push()	向数组的末尾添加一个或更多元素,并返回新的长度。
            3. 属性
                length:数组的长度
            4. 特点:
                1. JS中,数组元素的类型可变的。
                2. JS中,数组长度可变的。

注意:
这样 的var arr2 = new Array(5),不是元素为5,而是长度为5,一个长度为“.”,5个长度为“…”

数组元素类型可变:

var arr = [1,"abc",true];
document.write(arr +"<br>");

数组长度可变

var arr = [1,"abc",true];

 arr[10] = "hehe";
        document.write(arr[10] +"<br>");
        document.write(arr[9] +"<br>");
此数组有11个长度,分别是1,abc,true,(此处省略7个underled),hehe

join(参数):将数组中的元素按照指定的分隔符拼接为字符串
参数为指定的分隔符,不填,默认以逗号作为分隔符

17、Boolean 相当于包装类

18、Date对象

在这里插入图片描述

19、Math对象



           Math:数学对象
                1. 创建:
                    * 特点:Math对象不用创建,直接使用。  Math.方法名();

                2. 方法:
                    random():返回 0 ~ 1 之间的随机数。 含0不含1
                    ceil(x):对数进行上舍入。
                    floor(x):对数进行下舍入。
                    round(x):把数四舍五入为最接近的整数。
                3. 属性:
                    PI

         *
         */

        document.write(Math.PI +"<br>");
        document.write(Math.random() +"<br>");
        document.write(Math.round(3.14) +"<br>");
        document.write(Math.ceil(3.14) +"<br>");
        document.write(Math.floor(3.14) +"<br>");

----------------------------------------------------------------------
         *1~100之间的随机整数
         *      1. Math.random()产生随机数:范围 [0,1)小数
         *      2. 乘以 100 --> [0,99.9999] 小数
         *      3. 舍弃小数部分 :floor --> [0,99] 整数  或 ceil(x):对数进行上舍入。
         *      4. +1 -->[0,99] 整数 [1,100]
         *
         *
         */
        document.write("<hr>")
        var number =  Math.floor((Math.random() * 100)) + 1;
        document.write("0-100:"+"<br>"+number);
        
        var number2 = Math.ceil((Math.random()*100));
        document.write("<br>"+"0~100:"+"<br>"+number2);

20、RegExp:正则表达式对象【上】

用于表单校验:

在这里插入图片描述

8. RegExp:正则表达式对象
			1. 正则表达式:定义字符串的组成规则。
				1. 单个字符:[]
					如: [a] [ab] [a-zA-Z0-9_]
					* 特殊符号代表特殊含义的单个字符:
						\d:单个数字字符 [0-9]
						\w:单个单词字符[a-zA-Z0-9_]
				2. 量词符号:
					?:表示出现0次或1*:表示出现0次或多次
					+:出现1次或多次
					{m,n}:表示 m<= 数量 <= n
						* m如果缺省: {,n}:最多n次
						* n如果缺省:{m,} 最少m次
				3. 开始结束符号
					* ^:开始
					* $:结束
			2. 正则对象:
				1. 创建
					1. var reg = new RegExp("正则表达式");
					2. var reg = /正则表达式/;
				2. 方法	
					1. test(参数):验证指定的字符串是否符合正则定义的规范	

\w*:表示字符串由单词组成,单词出现几次呢?没有,或者多次。

21、RegExp:正则表达式对象【中】


			2. 正则对象:
                1. 创建
                    1. var reg = new RegExp("正则表达式");
                    2. var reg = /正则表达式/;
                2. 方法
                    1. test(参数):验证指定的字符串是否符合正则定义的规范


		var reg2= /^\w{6,12}$/;		【规则:6-12长度的单词】
		 var username = "zhangsan";
        //验证
        var flag = reg.test(username);
        alert(flag);

22、RegExp:正则表达式对象【下】

补充:
这样写是错误的:
var reg = new RegExp("\w{6,12}");
我们知道在字符串里的【\】这个符号是转义符号,如果是这样"\w{6,12}",【\w】被转换成其他一个字符了,所以正确写法是:
var reg = new RegExp("^\w{6,12}$");


23、Global对象

Global
				1. 特点:全局对象,这个Global中封装的方法不需要对象就可以直接调用。  方法名();
				2. 方法:
				    encodeURI():url编码
				    decodeURI():url解码

				    encodeURIComponent():url编码,编码的字符更多
				    decodeURIComponent():url解码

				    parseInt():将字符串转为数字
				        * 逐一判断每一个字符是否是数字,直到不是数字为止,将前边数字部分转为number
				    isNaN():判断一个值是否是NaN
				        * NaN六亲不认,连自己都不认。NaN参与的==比较全部问false

				    eval():讲 JavaScript 字符串,并把它作为脚本代码来执行。
                3. URL编码
                   传智播客 =  %E4%BC%A0%E6%99%BA%E6%92%AD%E5%AE%A2
                  

为什么要编码解码?
因为网站域名有些字符不能够直接解析,比如中文。
编码的过程:【网站的域名】
在这里插入图片描述
2套编码解码方法,区别:encodeURIComponent()能够把更多的字符进行编码

encodeURI():url编码
decodeURI():url解码
	    var str = "http://www.baidu.com?wd=传智播客";
        var encode = encodeURI(str);
        document.write(encode +"<br>");
        var s = decodeURI(encode);
        document.write(s +"<br>");
------------------------------------------------------------
encodeURIComponent():url编码,编码的字符更多
decodeURIComponent():url解码
        var str1 = "http://www.baidu.com?wd=传智播客";
        var encode1 = encodeURIComponent(str1);
        document.write(encode1 +"<br>");
        var s1 = decodeURIComponent(encode1);
        document.write(s1 +"<br>");//传智播客

parseInt():将字符串转为数字

parseInt(参数)。parseInt()方法会把传入的非number参数的内容进行逐一判断,也就是一个一个的判断,它会从左往右判断,如果一有非number值就返回。

		var str = "a234abc";
        var number = parseInt(str);
        alert(number);	//NaN

		var str = "2a34abc";
        var number = parseInt(str);
        alert(number);	//2


isNaN():判断一个值是否是NaN

NaN跟谁比较都是false,包括自己。那么我们怎么样判断某个值是否非NaN?

	    var a = NaN;
        document.write(a == NaN);	//false
        document.write(isNaN(a));	//true
发布了65 篇原创文章 · 获赞 1 · 访问量 1477

猜你喜欢

转载自blog.csdn.net/weixin_45097731/article/details/104582065