JS变量和流程控制
1、JS变量
1.1 变量的声明
JS中声明与初始化/赋值分开,第一次赋值叫初始化,第一次以外叫更新和修改,
声明 + 初始化 = 定义。
只要不是在涵数中发声明的变量都默认是全局变量,浏览器的全局对象就是window窗口。
量标示符规则和php一样,大小写英文字母
$
_
不区分大小写; 保持区分(控制台中区分)。
- 语句:分号结束(可选)
var n = 100;
- 表达式:
var n = 50 +50;
- 括号()控制优先级
- 空语句合法:
;;;
1.2 变量的作用域
代码块:由一对大括号包装起来的代码块,可以为空
JS支持函数作用域,ES5/5.1没有块作用域
ES6中支持块作用域,变量用let/const
<script>
console.log('php中文网欢迎');
console.log('我是学员,很高兴能到php中文网学习');
// <script src="">导入外部脚本
//1、语句:分号结束(可选)
var n = 100;
console.log('变量n的值是:' + n); //JS用+拼接字符串
//表达式:
var n = 50 +50;
console.log('变量n的值是:' + n);
//括号()
var n = (50 + 50) * 2;
console.log('变量n的值是:' + n);
;;;//空语句合法
//2、变量:由名称和值组成
//变量标示符规则和php一样
//不区分大小写; 保持区分(控制台中区分)
//name 是window全局属性
var name = 'zhaodashu';
console.log(name);
//变量使用步骤
//php中声明+初始化/赋值 合在一起: $name = 'zhaodashu';
//JS中声明与初始化/赋值 分开: var name;
var site;//声明后会有个默认值:undefined
console.log(site);
//第一次赋值叫初始化
site = 'php中文网';
console.log(site);
//第一次以膈叫更新和修改
site = 'php,cn';
console.log(site);
//声明 + 初始化 = 定义
var email = 'admin@php.cn';
//site, email 只要不是在涵数中发声明的变量都默认是全局变量
//浏览器的全局对象就是window窗口
console.log(window);
console.log(window.site);
console.log(site);
console.log(window.email);
//变量
console.log(salary);
var salary; //会自动提升到当前作用域顶部
//等价代码
// var salary;
// console.log(salary);
// salary = 5500;
//标识符:大小写英文字母 $ _
//代码块:由一对大括号包装起来的代码块,可以为空
//JS支持函数作用域,ES5/5.1没有块作用域
//ES6中支持块作用域,变量用let/const
function f() {
var x = 8;
}
//console.log(x); 不能访问
if(true){
var y = 100;
}
console.log(y);//可以访问
</script>
2、JS流程控制
2.1 分支
1.单分支:if()
2.双分支:if(){...}else{...}
3.多分支:if(){...}else if(){...}else if(){...}else{...}
4.switch:switch(){case:'';...;break;...; default:...;}
<script>
//1、单分支
var grade = 60;
var res = '';
if(grade >= 60) {
res = '60分及格万岁!'
}
console.log(res); //单分支,如果条件不满足则没有输出
//2、双分支
var grade = 59;
var res = '';
if(grade >= 60) {
res = '60分及格万岁!' //条件满足执行
}else{
res = '59分也是犯罪。'//条件不满足执行
}
console.log(res);
//双分支简化:三元运算符
//条件 ? true : false;
var grade = 61;
var res = '';
res = grade >= 60 ? res = '60分及格万岁!' : res = '59分也是犯罪。';
console.log(res);
//3、多分支
var grade = 99;
var res = '';
if(grade >= 60 && grade <= 69) {
res = '合格!';
}else if (grade >= 70 && grade <= 79) {
res = '中!';
}else if (grade >= 80 && grade <= 89) {
res = '良!';
}else if (grade >= 90 && grade <= 100){
res = '优!';
}else{
res = '成绩输入的误!';
}
console.log(res);
//4、switch
var grade = 88;
var res = '';
switch (true) {
case grade >= 60 && grade <= 69 :
res = '合格!';
break;
case grade >= 70 && grade <= 79 :
res = '中!';
break;
case grade >= 80 && grade <= 89 :
res = '良!';
break;
case grade >= 90 && grade <= 100 :
res = '优!';
break;
default :
res = '成绩输入的误!';
}
console.log(res);
//switch更多应用场景是单值判断
var salary = '高级技工';
switch(salary) {
case '高管':
case '高级技工': //可以两个CASE执行同一代码
salary += ': 工资15k-25k';
break;
case '中层' :
salary += ': 工资8k-12k';
break;
case '主管' :
salary += ': 工资5k-8k';
break;
case '管理' :
salary += ': 工资3k-5k';
break;
default :
salary += ': 工资2k-8k';
}
console.log(salary);
</script>
2.2 循环
1.for()
:比较适合处理确定数量的对象,数组
2.whlie()
:
3.do{...}whil()
:条件不满足也执行一次循环体
4.break
:终止循环,跳出
5.continue
: 终止本次循环,提前进入下一次
<script>
//5、循环:for/while/ 对象:for-in(); 数组:for-of\forEach
//for():比较适合处理确定数量的对象,数组
var sum = 0;
for(var i = 0; i < 5; i++){
sum += i;//+会判断是连接还是运算
}
console.log(sum);
var arr = [1,3,5,7,9];
console.log(arr.length);
for(var i = 0; i < arr.length; i++){
console.log(arr[i]);
}
//6、while()
var arr = [2,4,6,8,0];
var i = 0;//初始化循环变量
while(i < arr.length){ //循环条件
console.log(arr[i]);
i++;//更新循环条件
}
//do-while():条件不满足也执行一次
var arr = [2,4,6,8,0];
var i = 0;//初始化循环变量
do{
console.log(arr[i]);
i++;//更新循环条件
} while(i > arr.length);//循环条件
//break:终止循环,跳出
var sum = 0;
for(var i = 0; i < 10; i++){
if(i === 5) break;//终止i=5后的循环
sum += i;
}
console.log(sum);
//continue: 终止本次循环,提前进入下一次
var sum = 0;
for(var i = 0; i < 10; i++){
if(i === 5) continue;//终止i=5的循环
sum += i;
}
console.log(sum);
</script>
PHP欠下很多课程,先把JS开个头(毕竟万事开头难)。