1.js基本语法
1.什么是js
js是javascript的缩写，是web标准中的行为标准。负责网页中变化的部分
2.在哪儿写js代码
a.写标签的事件相关属性中，例如按钮的oncliced属性
b.写在script标签中(将js代码作为script标签的内容)
注意，script标签理论上可以放在html中的任何位置，但是一般放在head或者body中
c.写在js文件中，在html中通过script标签将文件导入(src属性值就是要导入的js文件的路径)
3.js能做什么
a.在网页的指定位置插入标签
b.修改网页中标签的内容
c.修改标签样式
4.怎么写js代码
javascript是一门编程语言，和python一样是动态语言也是脚本语言。但是和java没有关系
补充：
window.alert(信息) - js代码，在浏览器上弹出一个对话框，对话框中显示指定的信息
1.控制台输出
//console.log（输出的内容） - 和print的功能一样
console.log('abc',100)
//2.注释 - 和 c一样
//单行注释
/*
*
* 多行注释
*/
//3.标识符
//由字母、数字、下划线和$组成，数字不能开头
a=10
//4.行和缩进
//从语法角度，js代码怎么换行都和缩进都无所谓。js中通过{}来确定代码块。
//5.常见的数据类型：数字，布尔，字符串，数组，对象，函数
/*a.数字（number） - 包含所有的数字，包括整数和小数。例如：100,12.5，-13
支持科学计数法,不支持虚数.
b.布尔(Boolean) - 只有两个值，true和false。这个两个值是关键字；分别代表'真'和'假'
c.字符串（String） - 使用单引号或者双引号引起来的字符集
d.数组（Array） - 相当于python中的列表， [12,'abc',true]
2.变量
1.变量的声明
/* 语法1：变量名 = 值
* 变量名 - 标识符,不能是关键字;
* 驼峰式命名(第一个单词首字母小写，后面每个单词首字母大写);见名知义
*
* 语法2：var 变量名 = 值 或 var 变量名
* var - 声明变量的关键字
*
* 区别：声明的时候加var，变量可以不用赋值，默认是undefined;不加var就必须赋值，否则报错
*
* 补充:js中两个特殊的值 - undefined(没有，空)和null(清空)
*/
name = 123
console.log(name)
var age = 10
var sex // 通过var声明变量的时候如果不赋值，默认是undefined
console.log(age, sex)
//重新给变量赋值
name = '小明'
age = 18
sex = '男'
console.log(name, age, sex)
//同时声明多个变量,赋一样的值
a1 = a2 = a3 = 10
console.log(a1, a2, a3)
//同时声明多个变量，赋不同的值
b1=1, b2=2, b3=3
var b1=1, b2=2, b3=3
console.log(b1, b2, b3)
3.运算符
1.数学运算符: +, -, , /, %, ++, --
/ 前面四个运算符和python一模一样
*
* ++， --都是单目运算符，使用方式：变量++/--, ++/--变量
* a. ++ - 自加1运算;让变量本身的值加1
* b. -- - 自减1运算；让变量本身的值减1
*/
num = 10
num++
console.log(num) // 11
++num
console.log(num) // 12
num--
console.log(num) // 11
--num
console.log(num) //10
// 坑：用一个变量单独使用++/--的时候,++/--放前面和放后面效果一样；
// 如果是使用++/--运算的结果给另个变量赋值，++/--放前面是先自加/自减再赋值，
// ++/--放后面是先赋值再自加/自减
num2 = 10
num = ++num2 // 相当于：num2 += 1; num = num2
console.log(num, num2) // 11 11
num2 = 10
num = num2++ // 相当于：num=num2; num2 += 1
console.log(num, num2) // 10 11
//2.比较运算符: >, <, ==, !=, >=, <=, ===, !==
// 结果是布尔值
// 比较大小的和python一样
// a. ==：判断值是否相等(相等)
// b. ===：判断值和类型是否相等(全完相等) ,相当于python中的==, !==相当于python中的不等
console.log(5 == 5) //true
console.log(5 == '5') //true
console.log(5 != 5) //false
console.log(5 != '5') //false
console.log(5 === 5) //true
console.log(5 === '5') //flase
console.log(5 !== 5) //false
console.log(5 !== '5') //true
//3.逻辑运算符:&&(逻辑与)、||(逻辑或)、!(逻辑非)
//运算规则和使用方式和python的逻辑运算一模一样
console.log('=================')
console.log(true && true) //true
console.log(true && false) //false
console.log(false || true) //true
console.log(false || false) //false
console.log(!true) //false
//4.赋值运算符:=, +=, -=, *=, /=, %=
//和python一模一样
//5.三目运算符 - ?:
//语法：
//条件语句?值1:值2 - 判断条件语句的值是否为true,为true整个表达式的结果是值1否则是值2
age = 16
is_man = age>=18 ? '成年' : '未成年'
console.log(is_man)
//6.运算顺序
//数学>比较>逻辑>赋值
//如果有括号，先算括号里面的
4.分之结构
js中的分之结构有两种：if和switch
/*
* 1.if语句
* a.if
* if(条件语句){
* 满足条件会执行的代码
* }
* b.if-else
* if(条件语句){
* 代码段1
* }else{
* 代码段2
* }
* c. if - else if - else
* if(条件语句){
* 代码段1
* }else if(条件语句2){
* 代码段2
* }else if(条件语句3){
* 代码段3
* }else{
* 代码段4
* }
* 执行过程和python一模一样
*/
num = 11
if(num % 2){
console.log('奇数')
}else{
console.log('偶数')
}
age = 80
if(age < 18){
console.log('未成年')
}else if(age < 60){
console.log('成年')
}else{
console.log('老年')
}
/*
* 2.switch语句
* a.结构：
* switch(表达式){
* case 值1:
* 代码段1
* case 值2：
* 代码段2
* ...
* default:
* 代码段3
* }
* b.执行过程:
* 使用表达式的值依次和后面每个case后面的值进行比较，看是否相等。
* 找到第一个和表达式的值相等的case,将这个case作为入口，依次执行后面所有的代码，
* 直到执行完成或者遇到break为止。如果每个case的值都和表达式的值不相等，
* 就执行default后面的代码
*
* 注意：case后面必须是一个有结果的表达式
*/
a = 15
switch(a){
case 5:
console.log('表达式1')
case 6:
console.log('表达式2')
case 7:
console.log('表达式3')
case 10:
console.log('表达式4')
case 11:
console.log('表达式5')
break
default:
console.log('表达式6')
}
//练习：用一个变量保存10分制的成绩，根据成绩打印情况：0-5(不及格) 6(及格)，7-8(良好)，9-10(优秀)
score = 2
switch(score){
case 0:
case 1:
case 2:
case 3:
case 4:
case 5:
console.log('不及格')
break
case 6:
console.log('及格')
break
case 7:
case 8:
console.log('良好')
break
default:
console.log('优秀')
5.循环结构
js中有for循环和while循环两种
//1.for循环
/*
* a.for-in
* 结构：
* for(变量 in 序列){
* 循环体
* }
* 执行过程和python一样，但是变量取到的不是元素，而是下标/key(属性名)
* 序列 - 字符串，数组，对象
b.C的for循环
* 结构：
* for(表达式1;表达式2;表达式3){
* 循环体
* }
* 执行过程：先执行表达式1；判断表达式2的值是否为true,如果为true就执行循环体，执行完循环体再执行表达式3；
* 然后再判断表达式2是否为true，如果为true就执行循环体，执行完循环体再执行表达式3；
* ...依次类推，直到表达式2的结果为false为止(循环结束)
*
表达式1
while(表达式2){
循环体
表达式3
}
表达式1
for(;表达式2;){
循环体
表达式3
2.while循环
/*
* a.while循环
* while(条件语句){
* 循环体
* }
* 执行过程和python一模一样
*
* b.do-while循环
* do{
* 循环体
* }while(条件语句)
* 区别：do-while的循环体至少会执行一次
*/
//1+2+3...+100(do-while)
num = 1
sum = 0
do{
sum += num
num++
}while (num <= 100)
console.log(sum)
6.函数
1.函数的声明
/*
* function 函数名(参数列表){
* 函数体
* }
* js中的函数除了声明的关键字不一样，其他的都一样
*/
//参数可以设置默认值, 也可以通过关键字参数来调用函数
function sum(num1, num2=3){
console.log('求两个数的和')
return num1+num2
}
//2.函数的调用
/*
* 函数名(实参列表)
*/
console.log(sum(10, 20))
console.log(sum(10))
console.log(sum(num1=100, num2=200))
//js中所有的函数都有返回值，默认是undefined
function func1(){
console.log('我是js函数')
}
re = func1()
console.log(re)
//3.匿名函数(函数的字面量)
/*
* 函数名 = function(参数列表){函数体}
*/
func2 = function(a,b){
console.log(a, b)
return a*b
}
console.log(func2(3, 4))
funcs_arr = [func1, function(a){console.log(a)}]
funcs_arr[0]()
funcs_arr[1]('abc')
//4.变量的作用域
/* a.全局变量: 只要声明在函数外面的变量就是全局变量; 在函数中以‘变量名=值’的形式声明的变量也是全局的
*
* b.局部变量: 以var关键字声明在函数中的变量，才是局部变量
*/
var1 = 1000 //这是一个全局变量
var var2 = 'abc' //这是一个全局变量
for(xxx in 'hello'){
}
function abc(){
var2 = 'abcabc'
var3 = 111 //这个是一个全局变量
var var4 = 222 //这是一个局部变量
console.log(var1, var2, xxx)
}
abc()
console.log(var3)
console.log(var2)
7.字符集
1.字符串字面量
//a.使用双引号或者单引号括起来的字符集
//b.除了普通字符以外还可以是转义字符:\n, \t, \, ', "
//c.\u4位16进制值对应的Unicode编码, \u4e00 - 一
str1 = '\abc\n"123''
str2 = "abc"123\u4e00==="
console.log(str1, str2)
//2.获取字符
//字符串[下标] - 获取单个字符
//下标 - 范围是0 ~ 长度-1；下标如果越界取到的值是undefined
//js中没有切片语法
str1 = 'hello js'
console.log(str1[1])
//3.相关运算: +
// NaN - js中一个特殊的值，类似undefined、null,用来表示一个不存在的数值
// 字符串+数据 - 支持字符串和其他任何数据相加，是将其他数据全部转换成字符串，然后再拼接
str2 = 'abc'+ [1, 'abc', 2, '123']
console.log(str2)
// 补充：js中数据类型转换: 类型名()
num_str = String(123)
str_num = Number('a23.45')
arr_str = String([1, true, 'abc'])
console.log(num_str, str_num,arr_str)
//4.字符串长度
console.log('hello world'.length)
str3 = 'abc' // str3是String类型
str4 = new String('abc') //object
console.log(str3==str4, str3 === str4)
console.log(str3[1], str4[1])
//5.字符串相关方法(见菜鸟教程：http://www.runoob.com/js/js-strings.html)
function yt_print(aa){
console.log(aa)
}
yt_print('abc'.charAt(2))
yt_print(String.fromCharCode(97))
result = 'abcd12abc23hhh123'.replace(/\d+/g, '*')
yt_print(result)
for(index in result){
yt_print(index)
}
//6.js中的数组值需要关注：a.怎么获取数组中的元素 b.数组对应的方法 c.元素可以是任何类型
arr = [1, 'abc', true] // arr = {0: 1, 1: 'abc', 2: true}
yt_print(arr)
nums = [1, 34, 67, 2, 344]
new_nums = nums.sort(function(a,b) {return b-a})
yt_print(new_nums)