js基础
在什么地方写js代码
内联的：写在标签事件相关的属性中，例如onclick属性,属性值就是js代码
内部的：写在script标签的内容中，script标签理论上是可以放在整个html文件的任意位置
但是一般放在head或者body中。
外部的js：写在外部的一个js文件（后缀是js的文件中)中，
然后再通过script标签设置src属性的值为js文件地址来导入。
1.js基础语法
1.注释
// 单行注释
/*
多行注释
多行注释
*/
2.标识符
标识符就是用来命名的(给变量命名，函数命名，对象命名)
js中要求标识符是由字母,数字,下划线和$符组成,数字不能开头
js中大小写敏感
console.log()-在控制台打印括号中的内容
3.常用数据类型
a.数字类型(Number) 布尔(Boolean) 字符串(String) 数组(Array) 对象(object) 函数(function)
数字类型(Number):包含所有的数字(整数和小数),支持科学计数法,不支持虚数
100
13.9
2e2 (2*10**2)
布尔(Boolean)
true false
字符串(String):用单引号或者双引号括起来的
'aaa' "awa"
数组(Array):相当于python中的列表
[12, 25, 52, 'sasd', [1,2]]
对象(object):python中字典和对象的集合
var p1 = {
name:'聂锐杰',
age: 18,
sex:'男'
}
Function(函数):相当于python中的函数
function function_name(){
console.log('函数体')
}
function_name()
b.typeof(数据),获取数据类型
null、对象、数组返回的都是object类型
console.log(typeof(100)) #number
console.log(typeof['52']) #object
c.new 类型名(数据)--将数据转换成指定的类型
var a = new Boolean(100)
console.log(a) # true
d.常用的特殊值:underfined(相当于python，None),null(一般用来清空变量)
4.格式:js没有缩进的要求
2.变量
注意:不支持这种写法 -> x,y = 10, 20
var - 是js关键字，声明变量的时候用。var可以省略，省略的时候变量名后面必须赋值。
不省略的时候变量名后可以赋值，也可以不赋值，不赋值的时候默认值是undifined
变量名 - 标识符，不能是关键字，驼峰式命名规范
<script type="text/javascript">
// 声明一个变量
var name1
console.log(name1) # undefined
name2 = '小明'
console.log(name2) # 小明
var name3 = '小花'
console.log(name3) # 小花
// 同时声明多个变量
var age=18, sex, score=60
console.log(age,sex,score) # 18 undefined 60
age1 = 10, sex1 = '男'
console.log(age1,sex1) # 10 "男"
// 变量中的值:可以赋其他任何类型的值
age = '老年'
console.log(age) # 老年
</script>
3.运算符
不支持整除!!!!!!!
js中支持:数学运算符；比较运算符；赋值运算符;位运算符
1.数学运算符:+, -,* ,/ ,% ,**(js7), ++, --
var number1 = 1,number2
number2 = number1++ // 相当于:number2=number1;number1 += 1
console.log(number1,number2) // 2,1
var number11 = 1,number12
number12 = ++number11 // 相当于:number11 += 1;number12=number11
console.log(number11,number12) // 2,2
2.比较级运算符:>,<,==,!=,<=,>=,===,!==.
==(相等) :判断内容是否相等
===(完全相等):判断值和类型是否相等
console.log(5==5) //true
console.log(5=='5') //true
console.log(5===5) //true
console.log(5==='5') //false
3.复合运算:数学>比较>逻辑>赋值
可以通过()来改变运算顺序
4.分之结构
1.if 语句
a.if结构
if(条件语句){
代码段
执行过程：判断条件语句是否为ture，为true就执行{}的代码(不管缩进问题)
}
b.if-else结构
if(条件语句){
代码段1
}
else{
代码段2
}
c.if- else if - else
if(条件语句){
代码段1
}else if(条件语句2){
代码段2
}else if(条件语句3){
代码段3
}else{
代码段4
}
switch语句
switch(表达式){
case 值1：{
代码段1
}
case 值2：{
代码段2
}
case 值3：{
代码段3
}
.....
default:{
代码段4
}
}
执行过程：先计算表达式的值，然后从上往下一一和case后面的值进行比较，找到第一个和表达式相等的case；
然后将这个case作为入口，依次执行后边的所有的代码段，直到执行完或者遇到break为止。
如果没有那个case的值和表达式的值一样，就直接执行default后面的代码段
default可以省略！
num = 10
switch(num){
case 1:
console.log('1')
case 2:
console.log('2')
case 10:
console.log('10')
case 11:
console.log('11')
default:
console.log('default')
}
10
11
default
5.循环结构
注意：取出来的是元素的下标或者key（属性名）
序列可以是字符串、字典、数组
for (变量 in 序列){
循环体
}
str1 = 'abc'
for (x in str1){
console.log(str1[x])
}
arr = [10,20,30]
for(x in arr){
console.log(x,arr[x])
}
object1 = {name:'小明',age:18}
for (x in object1){
console.log(x,object1[x])
}
a
b
c
0 10
1 20
2 30
name 小明
age 18
for循环结构
for(语句1；表达式2；语句3){
循环体
}
执行过程：先执行表达式1，
再判断表达式2的结果是否为true，为true就执行循环体，执行完循环体在执行语句3
再判断表达式2的结果是否为true，为true就执行循环体，执行完循环体在执行语句3
依次类推，直到表达式2的结果为false，整个循环就结束。
指导思想:语句1：里面写魂环开始前的准备工作
表达式2：控制循环次数
语句3: 改变循环次数
// 计算：1+2+3+...+100
for(num1=1,sum=0;num1<=100;num1++){
// console.log(num1)
sum += num1
}
console.log(sum) #5050
2.while循环
a.while循环：和python的while循环一样
while(条件语句){
循环体
}
b.do-while循环
do{
循环体
}while(条件语句)
执行过程： 先执行循环体，然后在判断条件语句是否为true；
为true执行循环体，执行完又判断条件语句是否为true；
以此类推，直到条件语句的结果为false，循环就结束。
6.函数
函数分为声明和调用,声明的时候不会执行函数体,只有调用函数才会执行函数体
1.函数的声明
a.和python相同的声明方式
function 函数名(参数列表){
函数体
return 返回值
}
b.以声明变量的形式声明函数
函数名 = function (参数列表){
函数体
return 返回值
function sum(num1,num2){
console.log('求两个数的和',num1, num2)
return num1+num2
}
mul = function (num1,num2){
console.log('求两个数的乘积', num1, num2)
return num1*num2
}
console.log(sum())
console.log(sum(5,8))
console.log(mul(4,10))
求两个数的和 undefined undefined
NaN
求两个数的和 5 8
13
求两个数的乘积 4 10
40
2.函数的调用：
函数名（实参列表）
调用的时候，保证每个参数都有值。
只能通过位置参数传参。
js中不支持不定长参数
7.字符串
字符串：由单引号或者双引号括起来的
1.转义字符：和python一样
2.字符串的长度：字符串.length
3.获取单个字符：字符串[下标]
注意：下标取值范围0~长度-1；超出范围取到的是undefined
// 字符串长度
console.log('adas1223'.length)
// 获取单个字符
console.log('abc123'[1])
4.相关运算符
'+' :将两个字符串拼接在一起产生一个新的字符串 注意：如果一个一个字符串加上其他的数据，会先将其他数据转换成字符串在相加
js中字符串不支持*运算符
比较运算(>,<,==,!=,===,!==)
。>、< - 和python一样，比较字符编码值大小
console.log('asc'+'123')
console.log('zxc'+12)
console.log(12+'zxc')
console.log('acv'*3) #NaN -> 是数字类型中的一个特殊值,表示一个不存在的数
console.log(10/0) # Infinety -> 无穷大
console.log('abc'>'abaaaa')
5.相关方法(看菜鸟的表)
match(正则表达式) - 根据正则表达式匹配结果
js中的正则表达式是写在//之间的
str1 = 'asd7ds7d78sa9d78d97asd98a7'
result = str1.match(/\d+/)
console.log(result)
8.数组
数组就是python中的列表
1.数组有序，可变的，里面的元素可以是任意类型的数据
2.增删改查
a.查(获取数组中的元素)
数组[下标]
数组.slice(开始下标，结束下标)-切片
arr1 = [1,2,3,'abc']
console.log(arr1[3]) #abc
// 获取数组的长度
console.log(arr1.length) #4
result = arr1.slice(0,2)
console.log(result,arr1) # [1,2] # [1, 2, 3, "abc"]
b.增(添加元素)
数组.push(元素) - 将元素添加到数组的最后
arr1.push('hello')
console.log(arr1) # [1, 2, 3, "abc", "hello"]
c.删(删除元素)
数组.pop() - >删除最后一个元素
数组.splice(开始下标，删除的个数) - 从数组指定的下标开始删除指定个数元素
arr1 = [1, 2, 3, "abc", "hello"]
arr1.pop()
console.log(arr1) #[1, 2, 3, "abc"]
arr1.splice(1,3)
console.log(arr1) #[1]
d.改(修改元素的值)
数组[下标] = 新值 - 修改指定下标的元素
数组.splice(开始下标，个数，多个其他参数) - 用其他参数替换开始下标后指定个数个元素
arr1 = [1,2,5,6,9]
arr1[0] = 10
console.log(arr1) # [10, 2, 5, 6, 9]
arr1.splice(1,2, 5,5)
console.log(arr1) # [10, 5, 5, 6, 9]
9.对象
js中没有python的类,但是只有对象和构造方法
1.对象的字面量
{属性名1：属性值1，属性名2：属性值2...}
2.使用对象属性
对象[属性名]
对象.属性
p1 = {
// 对象属性
name :'xiao',
age : 18,
tei : '1542265421',
// 对象方法
eat: function (){
console.log('吃饭')
}
}
console.log(p1['name'],p1.name) # xiao xiao
p1.eat() # 吃饭
3.构造方法
function 类名(参数列表){
this.属性1 = 属性值1
this.属性2 = 属性值2
……
return this // 这句话必须写
}
这儿的this相当于python中的self，表示当前对象
function Person(name1,age1){
this.name = name1
this.age = age1
this.tel = ''
this.sex ='男'
// 对象方法
this.eat = function(food){
console.log(this.name+'在吃'+food)
}
return this
}
p2 = Person('faker',18)
p2.tel = '252210003332'
p2.eat('面条') # faker在吃面条
