day54js学习

今日内容概要
数值类型
字符类型
布尔值
null与undefined
对象
数组
自定义对象
流程控制
函数
内置对象
时间对象
正则对象
JSON对象
BOM操作(js操作浏览器 显示动态效果等...)

今日内容详细:
变量:
"""
js变量的命名规范
1.变量名只能是
数字 字母 下划线 $
2.变量名命名规范(不遵循也可以)
1.js中推荐使用驼峰式命名
userName
dataOfDb
2.python推荐使用下划线的方式
user_name
data_of_db
3.不能用关键字作为变量名
不需要记忆

js代码的书写位置
1.可以单独开设js文件书写
2.还可以直接在浏览器提供的console界面书写
在用浏览器书写js的时候 左上方的清空按钮只是清空当前页面 代码其实还在
如果你想要重新来 最好重新开设一个 页面
(在使用浏览器书写 你自己的js代码的时候推荐你在 自己的html页面打开)
"""

js在浏览器中的console界面书写,想要写多行并用空格的话,换下一行的时候要记得按shift

数据类型:
js也是一门面向对象 的编程语言 即一切皆对象!!!
js/python是一门拥有动态类型

name = 'jason'
name = 123
name = [1,2,3,4]
# name可以指向任意的数据类型
# 但是有一些语言中,变量名只能指向一种后续不能更改

数值类型(number):
var a = 11;
var b = 11.11;
// 如何查看当前数据类型
typeof a;

var a = 11;
var b = 11.11;
typeof a;
typeof b;
"number"

// 特殊的 NaN:数值类型 表示的意思是“不是一个数字” NOT A NUMBER

// 类型转换
parseInt()
parseFloat()


parseInt('12312312')
12312312
parseFloat('11.11')
11.11
parseInt('11.11') js中浮点型转成整形也可以转,py就不可以
11
parseInt('123sdasdajs2312dasd') 字符串开头有数字都是是字母也可以转,但是如果前面不是数字就会报错了
123
parseInt('asdasdad123sdasdajs2312dasd')
NaN

字符类型(string):
var s = 'jason'
undefined
typeof s
"string"
var s1 = "jason"
undefined
typeof s1;
"string"
var s2 = '''egon''' // 不支持三引号
VM665:1 Uncaught SyntaxError: Unexpected string

// 模版字符串:支持多行文本的方式
var s3 = `
asdkajsd
sdjkladj
asdjlajdkl
`
typeof s3
"string"
// 模版字符串除了可以定义多行文本之外还可以实现格式化字符串操作
// 书写${} 会自动去前面找大括号里面的变量名对应的值 如果没有定义直接报错
var name = 'jason'

var age = 18

var sss = `
my name is ${name} and my age is ${age} # 这句就是js格式化字符串的使用
`
sss
"
my name is jason and my age is 18
"

如果没有定义过的就会像下面这样直接报错
var s4 = `my name is ${namemmmmm}`
VM1140:1 Uncaught ReferenceError: namemmmmm is not defined
at <anonymous>:1:24
// 在写js代码的时候 不要去管左侧箭头的内容


// 字符串的拼接
// 在python中不推荐你使用+做拼接 join
// 在js中推荐你直接使用+做拼接
name + age 这个拼接是接着上面那个格式化字符串的
"jason18"

字符类型常用方法:
常用方法:
方法 说明
.length 返回长度
.trim() 移除空白
.trimLeft() 移除左边的空白
.trimRight() 移除右边的空白
.charAt(n) 返回第n个字符
.concat(value, ...) 拼接
.indexOf(substring, start) 子序列位置
.substring(from, to) 根据索引获取子序列
.slice(start, end) 切片
.toLowerCase() 小写
.toUpperCase() 大写
.split(delimiter, limit) 分割

js代码演示:
var name = 'egondsb';
undefined
name.length;
7

var name1 = ' egonDSB '
undefined
name1
" egonDSB "
name.trim()
"egondsb"
name1.trimLeft();
"egonDSB "
name1.trimRight();
" egonDSB"
name2.trim('$') # 不能加括号指定去除的内容
"egonDSB"

var name2 = '$jasonsn$'
undefined
name2.charAt(0)
"$"
name2.indexOf('as')
2
name2.substring(0,5)
"$jaso"
name2.slice(0,5)
"$jaso"
name2.substring(0,-1) # 不识别负数
""
name2.slice(0,-1) # 后面推荐就使用slice就可以
"$jasonsn"

var name3 = 'hkKLJLkljIUOknUOBN'
undefined
name3.toLocaleLowerCase()
"hkkljlkljiuoknuobn"
name3.toLocaleUpperCase()
"HKKLJLKLJIUOKNUOBN"

var name = 'tank|hecha|youxi|wanshua|...'
undefined
name.split('|')
(5) ["tank", "hecha", "youxi", "wanshua", "..."]
name.split('|',2) 只拿切割之后数据的前两个元素
(2) ["tank", "hecha"]
name.split('|',10) 有多少就拿多少,拿超了也不会报错
# 第二个参数不是限制切割字符的个数还是获取切割之后元素的个数
(5) ["tank", "hecha", "youxi", "wanshua", "..."]
name.concat(name1,name2)
"tank|hecha|youxi|wanshua|... egonDSB $jasonsn$"

联想记忆:
在MySQL中
concat
concat_ws
group_concat

var p = 111
undefined
name.concat(p) # js是弱类型(内部会自动转换成相同的数据类型做操作)
"tank|hecha|youxi|wanshua|...111"

在py中:
l = [1,2,3,4,5,6,7]
res = '|'.join(l) # 直接报错,join必须用字符串才行
print(res)

布尔值(boolean):
"""
1.在python中布尔值是首字母大写的
True
False
2.但是在js中布尔值是全小写的
true
false
# 布尔值是false的有哪些
空字符串、0、null、undefined、NaN
"""

代码演示:
var a = true;
undefined
typeof a
"boolean"

null与undefined:
null
表示值为空 一般都是指定或者清空一个变量时使用
name = 'jason'
name = null
undefined
表示声明了一个变量 但是没有做初始化操作(没有给值)
函数没有指定返回值的时候 返回的也是undefined


对象
一切皆对象
数组(类似于python里面的列表) []

var l = [11,22,33,44,55]

typeof l
"object"
var l1 = [11,'sdasd',11.11,true]

l1[1]
"sdasd"
l1[-1] # 不支持负数索引

数组的常用方法:
方法 说明
.length 数组的大小
.push(ele) 尾部追加元素
.pop() 获取尾部的元素
.unshift(ele) 头部插入元素
.shift() 头部移除元素
.slice(start, end) 切片
.reverse() 反转
.join(seq) 将数组元素连接成字符串
.concat(val, ...) 连接数组
.sort() 排序
.forEach() 将数组的每个元素传递给回调函数
.splice() 删除元素,并向数组添加新元素。
.map() 返回一个数组元素调用函数处理后的值的新数组

py知识点回顾:


代码演练:
var l = [111,222,333,444,555]
undefined
l.length
5
l.push(666)
6
l.pop()
666
l
(5) [111, 222, 333, 444, 555]
l.unshift(123)
6
l
(6) [123, 111, 222, 333, 444, 555]
l.shift()
123
l.slice(0,3)
(3) [111, 222, 333]
l.reverse()
(5) [555, 444, 333, 222, 111]
l.join('$') 将数组里的元素连接成字符串,跟python刚好相反
"555$444$333$222$111"
l.concat([111,222,333])
(8) [555, 444, 333, 222, 111, 111, 222, 333]
l.sort()
(5) [111, 222, 333, 444, 555]

# 三个比较重要的方法
.forEach方法:
var ll = [111,222,333,444,555,666]
ll.forEach(function(value){console.log(value)},ll)
# ll.forEach(函数,变量名)
# 拿到ll里面每一个元素,然后交给函数去执行
VM2277:1 111 # 一个参数就是数组里面每一个元素对象
VM2277:1 222
VM2277:1 333
VM2277:1 444
VM2277:1 555
VM2277:1 666

ll.forEach(function(value,index){console.log(value,index)},ll) 这是写两个形参的情况
VM2346:1 111 0 # 两个参数就是元素 + 元素索引
VM2346:1 222 1
VM2346:1 333 2
VM2346:1 444 3
VM2346:1 555 4
VM2346:1 666 5
undefined
ll.forEach(function(value,index,arr){console.log(value,index,arr)},ll) # 元素 + 元素索引 + 元素的数据来源
VM2430:1 111 0 (6) [111, 222, 333, 444, 555, 666]
VM2430:1 222 1 (6) [111, 222, 333, 444, 555, 666]
VM2430:1 333 2 (6) [111, 222, 333, 444, 555, 666]
VM2430:1 444 3 (6) [111, 222, 333, 444, 555, 666]
VM2430:1 555 4 (6) [111, 222, 333, 444, 555, 666]
VM2430:1 666 5 (6) [111, 222, 333, 444, 555, 666]
undefined

ll.forEach(function(value,index,arr,xxx){console.log(value,index,arr,xxx)},ll) # 最多三个
VM2532:1 111 0 (6) [111, 222, 333, 444, 555, 666] undefined
VM2532:1 222 1 (6) [111, 222, 333, 444, 555, 666] undefined
VM2532:1 333 2 (6) [111, 222, 333, 444, 555, 666] undefined
VM2532:1 444 3 (6) [111, 222, 333, 444, 555, 666] undefined
VM2532:1 555 4 (6) [111, 222, 333, 444, 555, 666] undefined
VM2532:1 666 5 (6) [111, 222, 333, 444, 555, 666] undefined

.splice方法:
.splice(起始位置,删除的位数,在删除的位置要增加的参数) # 第三个参数可不写
ll
(6) [111, 222, 333, 444, 555, 666]
ll.splice(0,3) # 两个参数 第一个是起始位置 第二个是删除的个数
(3) [111, 222, 333]
ll
(3) [444, 555, 666]
ll.splice(0,1,777) # 先删除后添加
[444]
ll
(3) [777, 555, 666]
ll.splice(0,1,[111,222,333,444]) # 这句后面的是添加了一个数组
[777]
ll
(3) [Array(4), 555, 666] # 这里结果显示添加后就整体成添加了一个数组

.map方法:
.map(函数,参数)
var l1 = [11,22,33,44,55,66]
undefined
l1.map(function(value){console.log(value)},l1)
VM3115:1 11
VM3115:1 22
VM3115:1 33
VM3115:1 44
VM3115:1 55
VM3115:1 66
l1.map(function(value,index){return value*2},l1)
(6) [22, 44, 66, 88, 110, 132]
l1.map(function(value,index,arr){return value*2},l1)
(6) [22, 44, 66, 88, 110, 132]

猜你喜欢

转载自www.cnblogs.com/python--wang/p/12898639.html
今日推荐