js 数组 实现 完全树_day54 前端-5-js

一、js简介。

是一种编程语言。既可以应用于前端,也可以写后端。

ECMAScript和JavaScript的关系
因此ECMAScript和JavaScript的关系是,前者是后者的规格,后者是前者的一种实现。

特点:

JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。
JavaScript 很容易学习

注释:

单行:
//

多行
/*
多行
多行
多行
*/

两种引入方式
1.script标签内部直接书写js代码
2.script标签src属性引入外部js代码
js语法结构
js是以分号作为语句的结束
但是如果你不写分号,问题也不大 也能够正常执行 但是它就相当于没有结束符

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

二、变量

命名规范:(1)数字、字母、下划线、$;(2)推荐使用驼峰体

注意:js定义变量不可直接用:name=‘egon’这种,必须要有关键字

1、val关键字

var name=‘egon’

2、let 关键字

let name=‘egon’

5.1版本只能用var,6版本可以都用

var与let的区别

ad2672cc2ee76ef7b9ee614f9907055a.png
var 全局中的n变成5了

66e458ece5c4c82087d29009633bd4a8.png
let没变,还是10


var在for循环里面定义也会影响到全局
let在局部定义只会在局部生效

三、常量

python中没有常量的概念,我们默认全大写为常量。

但是 js中有

声明常量的关键字const:
const pi = 3.14

四、数据类型

js和python都是动态类型,一个变量名可以指定多种数据。

4-1、数值类型(number)

var a = 11;
var b = 11.11;
// 如何查看当前数据类型
typeof a;

"number"
只显示number,没有int和float之分

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

类型转换:

parseInt()
parseFloat()

4e147cf42c43d3fd379b2a5fdea3c10f.png

4-2、字符类型(string)

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

所以有:模块字符串

182505f7561eab040aefc6e5faa03bd2.png

书写${} 会自动去前面找大括号里面的变量名对应的值 如果没有定义直接报错

var name = 'jason'

var age = 18

var sss = `
   my name is ${name} and my age is ${age}
`
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

字符串拼接:

在python中不推荐你使用+做拼接 join

在js中推荐你直接使用+做拼接

name + age

五、字符串常用类型

818a91b69cfb2efa6856bd2f00a5d959.png
var name = 'egondsb'

name.length
7
var name1 = '  egonDSB  '

name1
"  egonDSB  "
name1.trim()
"egonDSB"
name1.trimLeft()
"egonDSB  "
name1.trimRight()
"  egonDSB"

var name2 = '$$jason$$'

name2.trim('$')  # 不能加括号指定去除的内容
"$$jason$$"

name2.charAt(0)
"$"
name2.indexOf('as')
3

name2.substring(0,5)
"$$jas"
name2.slice(0,5)
"$$jas"
name2.substring(0,-1)  # 不识别负数
""
name2.slice(0,-1)  # 后面推荐就使用slice就可以
"$$jason$"


var name3 = 'eGoNDsb123666HahA'

name3.toLowerCase()
"egondsb123666haha"
name3.toUpperCase()
"EGONDSB123666HAHA"
var name = 'tank|hecha|liaomei|mengsao|...'


name.split('|')
(5) ["tank", "hecha", "liaomei", "mengsao", "..."]
name.split('|',2)
(2) ["tank", "hecha"]0: "tank"1: "hecha"length: 2__proto__: Array(0)
name.split('|',10)  # 第二个参数不是限制切割字符的个数还是获取切割之后元素的个数
(5) ["tank", "hecha", "liaomei", "mengsao", "..."]


name.concat(name1,name2)
"tank|hecha|liaomei|mengsao|...  egonDSB  $$jason$$"
var p = 1111

name.concat(p)  # js是弱类型(内部会自动转换成相同的数据类型做操作)
"tank|hecha|liaomei|mengsao|...1111"


l = [1,2,3,4,5,6,7]
res = '|'.join(l)  # 直接报错
print(res)

六、布尔值(boolean)

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

null与undefined

null
	表示值为空 一般都是指定或者清空一个变量时使用
		name = 'jason'
		name = null
undefined
	表示声明了一个变量 但是没有做初始化操作(没有给值)
	函数没有指定返回值的时候 返回的也是undefined
	
参考博客图解:厕所卷纸
https://www.cnblogs.com/Dominic-Ji/p/9111021.html

七、对象

7-1、数组(类似于python里面的列表) []

自定义对象(类似python中的字典)

  var l = [11,22,33,44,55]
  
  typeof l
  "object"
  var l1 = [11,'sdasd',11.11,true]
  
  l1[1]
  "sdasd"
  l1[-1]  # 不支持负数索引
  
  
  var l = [111,222,333,444,555,666]
 
  l.length
  6
  l.push(777)
  7
  l
  (7) [111, 222, 333, 444, 555, 666, 777]
  l.pop()
  777
  l
  (6) [111, 222, 333, 444, 555, 666]
  l.unshift(123)
  7
  l
  (7) [123, 111, 222, 333, 444, 555, 666]
  l.shift()
  123
  l.slice(0,3)
  (3) [111, 222, 333]
  l.reverse()
  (6) [666, 555, 444, 333, 222, 111]
  l.join('$')  # 跟python刚好相反
  "666$555$444$333$222$111"
  
  l.concat([111,222,333])  # extend
  (9) [666, 555, 444, 333, 222, 111, 111, 222, 333]
  l.sort()
  (6) [111, 222, 333, 444, 555, 666]
  
  # 三个比较重要的方法
  var ll = [111,222,333,444,555,666]
  ll.forEach(function(value){console.log(value)},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
    
    
  
  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]
  
  
  
  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]

八。运算符

 算术运算符
var x = 10;
var res1 = x++;
var res2 = ++x;
res1 10
res2 12
++表示自增1 类似于 +=1
加号在前先加后赋值 加号在后先赋值后加

 比较运算符
1 == '1'  # 弱等于  内部自动转换成相同的数据类型比较了
true  

1 === '1'  # 强等于  内部不做类型转换

1 != '1'
false
1 !== '2'
true

 逻辑运算符
 python中 and or not
  js中 && || !

5 && '5'
'5'

0 || 1
1

!5 && '5'
false


 赋值运算符
= += -= *= ....

九、流程控制

1、 if判断
var age = 28;
 if(条件){条件成立之后指向的代码块}
if (age>18){
  console.log('来啊 来啊')
}

 if-else
if (age>18){
  console.log('来啊 来啊')
}else{
  console.log('没钱 滚蛋')
}

 if-else if else
if (age<18){
  console.log("培养一下")
}else if(age<24){
  console.log('小姐姐你好 我是你的粉丝')
}else{
  console.log('你是个好人')
}

在js中代码是没有缩进的 只不过我们处于python书写习惯人为的加上了而已
()条件
{}代码块


2、 switch语法

提前列举好可能出现的条件和解决方式

var num = 2;
switch(num){
  case 0:
  	console.log('喝酒');
  	break;  # 不加break 匹配到一个之后 就一直往下执行
  case 1:
  	console.log('唱歌');
  	break;
  case 2:
  	console.log('洗脚');
  	break;
  case 3:
  	console.log('按摩');
  	break;
  case 4:
  	console.log('营养快线');
  	break;
  case 5:
  	console.log('老板慢走 欢迎下次光临');
  	break;
  default:
  	console.log('条件都没有匹配上 默认走的流程')
}

3、 for循环
 打印0-9数字
for(let i=0;i<10;i++){
  console.log(i)
}
 
题目1  循环打印出数组里面的每一个元素
var l1 = [111,222,333,444,555,666]
for(let i=0;i<l1.length;i++){
  console.log(l1[i])
}

4、 while循环
var i = 0
while(i<100){
  console.log(i)
  i++;
}

 三元运算符
 python中三元运算符 res = 1 if 1>2 else 3
 JS中三元运算  res = 1>2?1:3 
条件成立取问好后面的1 不成立取冒号后面的3
var res = 2>5?8:10 # 10
var res = 2>5?8:(8>5?666:444)  # 666

三元运算符不要写的过于复杂 
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值