学习网址：【优极限】 HTML+CSS+JavaScript+jQuery前端必学教程，小白教学，前端基础全套完成版_哔哩哔哩_bilibilin
1.安装编译器
- HBuilder X:HBuilderX-高效极客技巧
2.基本内容
①运算符
- 算术运算符：+、-、*、/、%、++、--
- 赋值运算符：=、+=、-=、*=、/=
- 字符串运算符：+、+=
- 比较运算符：>、<、>=、<=、==、!=、===、!==
- 逻辑运算符：&&、||、!
- 三元运算符：？：
②数组
- 定义：（1）隐式定义：
var 数组名 = [ ] ;
var 数组名 = [值1,值2,值3,...] ;
(2) 直接实例化：var 数组名 = new Array(值1，值2，值3,...) ;
(3) 定义数组并设置长度：var 数组名 = new Array(size) ;
- 数组提供的操作方法：
push 添加元素到最后 unshift 添加元素到最前 pop 删除最后一项 shift 删除第一项 reverse 数组翻转 join 数组转换成字符串 indexof 数组元素索引 slice 截取（切片）数组，原数组不发生变化 splice 剪接数组，原数组变化，可以实现前后删除效果 concat 数组合并
- 数组的遍历
//获取数组的属性 console.log(aee3["name"]) ; console.log("==========") ; /*数组的遍历*/ console.log(arr3) ; console.log("---for循环遍历---") ; //for 循环遍历 for (var i = 0;i < arr3.length ; i++) { console.log("下标: "+ i +" , ",值" + arr3[i]) ; } //for ... in console.log("--- for ... in ---") ; for(var i in arr3) { console.log("下标: "+ i +" , ",值" + arr3[i]) ; } // forEach console.log("--- forEach ---") ; arr3.forEach(function(element,index) { console.log("下标: "+ index +" , ",值" + element) ; })
③函数的定义
函数有三种定义方式：函数声明豫剧、函数定义表达式、Function构造函数
(1)函数声明语句：function 函数名 ( [参数列表] ) { }
(2)函数定义表达式：var 变量名/函数名 = function ( [参数列表] ) { }
(3)Function构造函数：var 函数名 = new Function ( [参数列表] , 函数体) ；
//函数声明语句 function 函数名（[参数列表]）{ } 例如： function foo() { console.log(1) ; } foo() ; //变量声明提升 console.log( a ) ; var a = 2 ;
④函数的调用
- 作为函数调用
function myFunction(a, b) { return a * b; } myFunction(10, 2); // myFunction(10, 2) 返回 20 // 构造函数: function myFunction(arg1, arg2) { this.firstName = arg1; this.lastName = arg2; } // This creates a new object var x = new myFunction("John","Doe"); x.firstName; // 返回 "John"
- 全局对象
function myFunction() { return this; } myFunction(); // 返回 window 对象
- 函数作为方法调用
var myObject = { firstName:"John", lastName: "Doe", fullName: function () { return this.firstName + " " + this.lastName; } } myObject.fullName(); // 返回 "John Doe"
3.代码实例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>函数</title>
</head>
<body>
<script type="text/javascript">
/*函数的定义*/
//1.函数声明语句
function fn01(a,b) {
console.log(a+b);
}
console.log(fn01);
//2.函数定义表达式
var fn02 = function(a,b) {
console.log(a+b);
}
console.log(fn02);
//3.Function构造函数
var fn03 = new Function('a','b','return a+b;');
//相当于
function fn04(a,b) {
return a+b ;
}
console.log("===========");
function test01(x,y) {
console.log(x+y);
}
test01(); //NaN
test01(1);//NaN
test01(1,2);// 3
function test02(x,x) {
console.log(x);
}
test02(1,2); // 2
function test03(x) {
x = x || "x" ;
console.log(x);
}
test03(10);// 10
test03(); // x
function test04(x) {
(x != null || x == undefined) ? x = x : "x" ;
}
test04(); //x
test04("Hello");
var num = 10;
function test05() {
num = 20
}
test05(num); // 实参史定义的变量
console.log(num);
//引用传递
var obj = {name:"zhangsan"};
console.log(obj);
function test06(o) {
o.name = "list";
}
test06(obj);
console.log(obj);
</script>
</body>
</html>