主要内容:
1 . html 及 css 和jss的区别
html :文档的结构
css : 修改文档的外观结构
javascrip: 实现页面上的动态效果
2 . JS的历史及ECMAScript
1 ) javascript的概述 :
javascript是脚本语言, 是一种较轻量级的编程语言; 是可插入HTML页面的编程代码;JavaScript插入HTML页面的编程代码.
2 ) JAVAScript(雷峰塔) Java(雷锋)没有实质性的关系
3 ) ECMAScript 一个标准 ES5/ES6
4 ) node.js 跑在服务端的js
3 . javascript的引入方式
<script>console.log(123);</script> # script标签内写代码 <script src="script.js"></script> # 引入额外的js文件
注释方式:
\ 单行注释 /*多行注释*/
结束符:
JavaScript中的语句要以分号(;)为结束符.
4 . 变量的命名规范:
1) JavaScript的变量名可以使用_ 数字 字母 $组成, 不能以数字开头.
2 ) 声明变量使用var变量名的格式进行声明.(变量名区分大小写, 建议使用驼峰式命名规则)
5. JavaScript的数据类型
1 ) 数值类型 (Number) : javascript 不区分整型和浮点型, 就只有一种数据类型.
var num = 1 undefined var b = 13.5 undefined typeof num "number" typeof b "number"
a : NaN : 是number类型, 表示不是一个数字
parseInt('123') //返回123
parseInt('abc') //返回nan
typeof NaN
"number"
parseFloat('123.456') //返回123.456
2 ) 字符串( string )
a : .length 返回长度
var s = 'lililii'
undefined
s.length
7
b : .trim() 移除空白
.trimLeft(), .trimRight() 移除左边的空白和右边的空白
var s = 'libai ' undefined s.trim() "libai"
c : .charAt(n) 返回第n个字符
var s = 'dufu ' undefined var t = s.charAt(3) console.log(t) // u
d : .concat(n1, ) 拼接
+ 使用+号也可以实现拼接,较为常用
var s = 'tian'
s.concat('tt')
"tiantt"
利用+实现的拼接
s = 'lili' v = 'uuuu' console.log(s+v) // liliuuuu
e :. indexof 子序列的位置
s = 'qwert yuiop'
s.indexOf('q') // 0
s.indexOf('q', 2) //-1 如果找不到返回-1
f : .substring 根据索引获取子序列
s = 'li si ai bi' s.substring(1, 4) //"i s" s.substring(1, -1) //"l" 如果后面负数的比前面的小, 把后面的变成0, 然后换位置
s.substring(4, 1) //"i s"把后面的数字和前面的数字换位置 h
h : .slice() 切片
s = 'li uu tt uu' s.slice(1, -1) //"i uu tt u" 按正常切 s.slice(1, 4) //"i u" s.slice(4, 1) //"" 取到空字符
substring和slice的区别
substirng()的特点：
如果 start > stop ，start和stop将被交换
如果参数是负数或者不是数字，将会被0替换
silce()的特点：
如果 start > stop 不会交换两者
如果start小于0，则切割从字符串末尾往前数的第abs(start)个的字符开始(包括该位置的字符)
如果stop小于0，则切割在从字符串末尾往前数的第abs(stop)个字符结束(不包含该位置字符)
i : .toLowerCase(), .toUpperCase() 大小写
j : .split () 切割
s = 'li uu tt uu'
s.split(' ') // ["li", "uu", "tt", "u u"]
k : $ 符格式化
var name = 'lili'
var hobby = 'read book'
var s = `我叫${name}`
console.log(s) // 我叫lili
3 ) 布尔值(Boolean)区别于python,ture或false都是小写
var a = true var b = false undefined typeof a // "boolean"
''(空字符串) 0 null undefined NaN 都是false
4 ) null和undefined
null表示值是真空, 一般是在需要指定或清空一个变量时才会使用,如name=null
undefined表当声明一个变量但未初始化时, 该变量的默认值是undefined.还有就是当函数没有明确的返回值时,返回的也是undefined
name = 'alex' "alex" name = null null name "null"
5 ) : 数组: 数组对象的作用: 使用单独的变量名来存储一系列的值. 类似于python中的列表
a: .length 获取数组的长度
var li = [11, 22, 33, 44] undefined console.log(li.length) //4
b : .push() 尾部追加元素 .pop() 获取尾部的元素
c: unshift() 头部插入元素 .shift() 头部移除元素
var li = [11, 22, 33, 44] li.push(55) 5 li (5) [11, 22, 33, 44, 55] li.pop() 55 li.unshift(9) 5 li (5) [9, 11, 22, 33, 44] li.shift() 9 li (4) [11, 22, 33, 44]
d : slice() 切片; .reverse() 翻转 . join() 将数组元素连接成字符串
li = ['a', 'b', 'n']
li.slice(1, 4) //["b", "n"]
li.reverse() // ["n", "b", "a"]
li.join('+') //"n+b+a"
e : sort排序
var li = [2 , 11, 33, 14] li.sort() //[11, 14, 2, 33] 按照ascii值进行排序 function sortNumber(a, b){ return a - b} li.sort(sortNumber) //[2, 11, 14, 33] 按照数字大小进行排序
f : splice 删除元素, 并向数组添加新的元素
var li = [11, 22, 33, 44] li.splice(1, 1) //[22] 从第一个位置开始删除一个元素 li.splice(1, 2) // [33, 44]从第一个位置开始删除两个元素 li.splice(1) //[] 不写第二个参数默认删除一个 li.splice(1, 1, 'aaa') // [11, "aaa"] 在第一个位置删除一个元素, 并把aaa加到元祖删除的位置中. li.splice(1, 1, 'aaa', 'bbb') // [11, "aaa", "bbb"]
6 ) 类型查询typeof: 它是一个一元运算符,不是一个函数,也不是一个语句
var li = [1, 2, 3]
s = 'juishi'
typeof li //"object"
typeof s //"string"
typeof null //"object"
typeof NaN //"number"
6 . 运算符
1 ) 算术运算符 + - * / % ++ --
2 ) 比较运算符 > >= < <= != == === !==
2 == '2' true # 弱等于 , 判断值是否相等 2 === '2' false # 强等于 , 既要判断值相等不相等, 还判断类型是否相等
3 ) 逻辑运算符 && || !
true || false
true
!1 //false
!99 //false
!!1 //true 快速的把一个变量转换成布尔值.
4 ) 赋值运算符 = += -= *= /=
7 . 流程控制
1 ) if- else
var age = 19;
if (age>18){
console.log('耶, 成年了');
}else{
console.log("啦啦啦啦");
}
2 ) if - else if - else
vara = 10;
if (a > 5){
console.log('a>5');
}else if (a<5){
console.log('a<5');
}else {
console.log('a=5')}
3 ) switch
var today = 2;
switch (today) {
case 1 :
console.log('今天吃红烧肉');
break;
case 2 :
console.log ('宫保鸡丁');
break;
case 3 :
console.log ('清蒸鲈鱼');
break;
default :
console.log('吃泡面!')
}
4 ) for
for(var i = 0;i < 10; i ++ ){
console.log(i);
}
for循环操作列表
var li = [11, 22, 33, 44]
for (var i = 0 ; i < li.length; i++){
console.log(li[i])
}
5 ) while
var n = 0;
while (n < 10){
console.log(n);
n ++
}
6 ) 三元运算
var a = 100; var b = 130; var c = a > b ? a : b
Python中的三元运算
a = 12
b = 13
c = a if a > b else b
print(c)