第六次网页前端培训笔记（JS的基础语法）-CSDN博客

本文链接：https://blog.csdn.net/weixin_58155375/article/details/122849061

一、运算符

比较运算符 == ：等于 === ：全等（值和类型）

逻辑运算符 && ：and || : or ! :not

三目运算符？：如果.....否则......

二、循环

for - 循环代码块一定的次数

for (语句 1; 语句 2; 语句 3)
{
    被执行的代码块
}

for/in - 循环遍历对象的属性
while - 当指定的条件为 true 时循环指定的代码块

while (条件)
{
    需要执行的代码
}

do/while - 同样当指定的条件为 true 时循环指定的代码块

do
{
    需要执行的代码
}
while (条件);

三、数组

1.数组定义

1.隐式定义

var 数组名 = []; // 空数组
ar数组名 = [值1，值2，值3，....];

var arr1 = [];
			console.log(arr1);
			var arr2 = [1,2,'a',true];
			console.log(arr2);

2.直接实例化

var 数组名 = new Array（值 1，值2，值3，...）;

var arr3 = new Array(1,2,3);
			console.log(arr3);

3.定义数组并设置长度

var 数组名 = new Array（size）；

var arr4 = new Array(5);
			console.log(arr4);

4.数组的操作

数组的下标从0开始
获取数组指定下标的值：（如果下标不存在，则undefined）
数组名[下标]；
设置数组指定下标的值: （如果下标不存在，则自动扩容）
数组名[下标] = 值；
                 获取数组长度：
数组名.length;
设置数组长度：
数组名:length = 值；
了解：
如果设置非整数型的下标，则会成为数组的属性，并不计入数组的长度
设置属性：
                       数组名.属性名 = 值；
                           数组名["属性名"] = 值；
获取属性：
                       数组名.属性名；
                           数组名["属性名"]；

	/*数组的操作*/
			//获取指定下标的值
			console.log(arr2[1]);
			//如果下标不存在
			console.log(arr2[5]);
			//设置指定的下标值
			arr2[1] = 20;
			console.log(arr2);
			//如果下标不存在
			arr2[10] = 20;
			console.log(arr2);
			//获取数组的长度
			console.log(arr3.length);
			//设置数组的长度
			arr3.length = 5;
			console.log(arr3);
			//设置数组的属性
			arr3.name = "zhangsan;"
			console.log(arr3);
			arr3["ped"] = "123456";
			console.log(arr3);
			//获取数组的属性
			console.log(arr3["name"]);

2.数组的遍历

1. for循环遍历

for（var index = 0；index<数组长度;index++){

                       }
相当于Java中：
  for（int index = 0；index<数组长度;index++){

                       }

console.log("-------for 循环遍历------");
			for (var i = 0;i < arr3.length; i++){
				console.log("下标： "+ i +",值:"+arr3[i]);
			}

2.for...in循环

for（var下标名 in 数组）{

}

console.log("-------for ...in------");
			for (var i in arr3){
				console.log("下标： "+ i +",值:"+arr3[i]);
			}

3.forEach循环

数组.forEach（function（element，index）{
                       //element:元素
                       //index:下标
                   }）

arr3.forEach(function(element,index){
				console.log("下标： "+ index +",值:"+ element);
			})

               注：
               for --- 不遍历属性
               foreach --- 不遍历属性和索引中的undefined
               for in -- 不遍历索引中的undefined
           数组提供的方法
           push 添加元素到最后
               indexof 数组元素索引
               join 数组转成字符串
               split 字符串方法，将字符串转换成数组

               unshift 添加元素到最前
               pop 删除最后一项
               shift 删除第一项
               reverse 数组翻转
               slice 截取（切片）数组，原数组不发生变化
               splice 剪接数组，原数组变化，可以实现前后删除效果
               concat 数组合并

var arrS = ["a","b","c"]
			//push       添加元素到最后
			arrS[arrS.length] = "d";
			arrS.push("e");
			console.log(arrS);
			//indexOf    数组元素索引
			console.log(arrS.indexOf("a"));
			console.log(arrS.indexOf("t"));  //-1,找不到返回-1
			//join       数组转成字符串
			console.log(arrS.join("-"));//a-b-c-d-e
			//split      字符串方法，将字符串转换成数组
			var str = "1,2,3,4,5";
			console.log(str.split(","));

四、函数的定义

1.函数声明语句
               function 函数名（[参数列表]）{

                   }

//1.函数声明语句
			function fn01(a,b){
				console.log(a+b);
			}
			console.log(fn01);

2.函数定义表达式
               var 变量名/函数名 = function([参数列表]){

                   }

//2.函数定义表达式
			var fn02 = function(a,b){
				console.log(a+b);
			}
			console.log(fn02);

  3.Function构造函数（了解）
               var 函数名 = new Function([参数列表]，函数体)；

//3.Function构造函数（了解）
			var fn03 =new Function('a','b','return(a+b);');
			console.log(fn03);
			//相当于
			function fn04(a,b){
				return (a+b);
			}

函数的参数
           定义的函数
               1.实参可以省略，则形参为函数时传递实参。
                  2.如果形参名相同，则以最后一个参数为准
                  3.可以设置参数的默认值
                  4.参数为值传递，传递副本；参数是引用传递，则传递的是地址，操作的是同一个对象

//1.实参可以省略，则形参为undefined
			function test01(x,y){
				console.log(x+y);
			}

函数的调用
           1.常用的调用模式
               函数名([参数列表])；
               2.函数调用模式 (函数有返回值)
               var 变量名函数名([参数列表])；

//函数调用模式
			var f2 =function(a){
				console.log("函数调用模式...");
				return a;
			}
			var num1 = f2(1);
			console.log(num1);

3.方法调用模式
对象.函数名([参数列表])；

//方法调用模式
			//定义对象   key键:字符串    value值: 任意数据类型
			var obj = {
				name:"zhangsan",  //字符串
				age:18,     //数值
				sex:true,   //布尔
				cats:["大猫",["二猫"]],  //数组
				dog:{     //对象
					name:"二狗",
					age:1
				},
				SayHello:function(){   //函数
					console.log("你好呀~");
				}
			}
			console.log(obj);
			console.log(obj.name);
			console.log(obj.dog.name);
			console.log(obj.SayHello);
			obj.SayHello() //对象调用函数

函数的返回值
           return
               1.在没有返回值的方法中，用来结束方法。(如果方法没有返回值，使用return，返回的是undefinded)
                   2.有返回值的方法中，一个用来结束方法，一个是将值带给调用者。
函数作用域
           在JS中，只有在函数中才有作业域
               1.在函数中，存在局部变量和全局变量
               2.在函数中，如果声明变量时未使用var修饰符，则该变量是全局变量

/*  函数的返回值  */
			function a1(){
				console.log("没有返回值...");
				return;
				console.log('.....');
			}
			console.log(a1());
			function a2(){
				console.log("有返回值...");
				return "test";
			}
			console.log(a2());
			
			console.log("--------------");
			
			/*函数作用域*/
			var pp="Hello"//全局变量
			//函数中定义的变量是局部变量
			function qq(){
				//局部变量
				var box = 10;
				//全局变量 （没有使用var声明，所有是全局变量）
				box2 = 20;
			}
			//调用方法，执行方法中的代码
			qq();
			console.log(qq);
			//console.log(box);//box局部变量
			console.log(box2);