JS

JS

变量声明

var a= 10;

a
10
let b = 10;

b
10

js拥有动态的数据类型
var x;  // 此时x是undefined
var x = 1;  // 此时x是数字
var x = "Alex"  // 此时x是字符串

数据类型

  • 数值

    js不区分整形和浮点型，就只有一种数字类型

var a=10;

typeof(a)  /*查看数据类型*/
"number"
var c=10.2

typeof(c)
"numbe

NaN表示不是一个数字

// 类型转换
parseInt('12')   // 类型转换内置函数，，跟python的字符串转整形 int('123') 等价
12
parseFloat('12.1')
12.1
parseInt('abc')  //这个不是数字做类型转换就会返回一个NaN
NaN

/*只要代转的字符串前面有数字就可以转，转到不是数字结束，但是要是不是数字开头，就返回NaN*/

  • 常量

    const pi=3.14  // 定义一个常量
undefined
pi=3           //这里的常量不能修改
VM544:1 Uncaught TypeError: Assignment to constant variable.
    at <anonymous>:1:3

  • 模板语法

    var name='lyh'

var age=18

var c = `my name is ${name}, my age is ${age}    // 这个是esc下面的反引号
`

c
"my name is lyh, my age is 18\n"

  • 字符串

    /*字符串拼接*/
a
"hello"
var c='world'

var c=a+b  //拼接的时候字符串可以和数字类型拼接，python是不行的，

c
"hello10"
b
10

c='world'
"world"
var c= a+c;

/*字符串内置方法*/
var a ='welcome to js hello world'

a.length    // 字符串长度，，等价于python里面的len(a)
25

var a ='  welcome to js hello world   '

a.trim()  //移除空白，，等价于python的strip
"welcome to js hello world"

var a ='  welcome to js hello world   '

a.trimLeft()  //移除左边空白 等价于python的lstrip
"welcome to js hello world   

var a ='  welcome to js hello world   '

a.trimRight()  //移除右边空白  等价于python的rstrip
"  welcome to js hello world"

var a ='welcome to js hello world'

a.charAt(12)  //返回第几个字符,,类比于索引取值
"s"

a.concat('lyh')  //拼接，
"welcome to js hello worldlyh"

"welcome to js hello world"
a.indexOf('world')  //返回括号中子序列的位置，，没有则返回-1
20
a.indexOf('asd')
-1

a.substring(10,20)  //根据索引获取子序列，索引取值
" js hello "

a.slice(10,20)   //切片
" js hello "

a.toLowerCase()  //转小写
"welcome to js hello world"

a.toUpperCase()  //转大写
"WELCOME TO JS HELLO WORLD"

var a='qwe|123|asd'

a.split('|')  //切割
(3) ["qwe", "123", "asd"]
a.split('|', 2)
(2) ["qwe", "123"]

  • 布尔值

    true
false
	0 空 null undefined NaN 

/*
null:
	表示值为空，一般在需要指定或清空一个字符串的时候使用
undefined:
	只声明了变量，但是没有赋值，还有就是函数没有明确的返回值
*/

var a

a
undefined
a = 10;
10
a
10
a=null
null
a
null

  • 对象

    数组对象：
	类似于python中的列表

a  // 一维数组
(5) [111, 222, "lyh", 333, "qwe"]0: 1111: 2222: "lyh"3: 3334: "qwe"length: 5[[Prototype]]: Array(0)
a[0]  //索引取值
111
var b=[11,22,[33,44],'qwe']  // 二维数组

b[2][1]  //索引取值
44

a.pop()  //尾部弹出，有一个返回值
"qwe"
a
(4) [111, 222, "lyh", 333]

a.shift()  //删除头部
111
a
(3) [222, "lyh", 333]

a.unshift('egon')  //头部添加
4
a
(4) ["egon", 222, "lyh", 333]

a.push('json') //尾部追加
5
a
(5) ["egon", 222, "lyh", 333, "json"]

a.length  //获取数组长度
5

a.slice(0,3)  //按索引切片
(3) ["egon", 222, "lyh"]

a.reverse()  //反转
(5) ["json", 333, "lyh", 222, "egon"]

a.join('|')  //将索引按照指定符号拼接
"json|333|lyh|222|egon"

var b=[11,22,44,55,33,99,77]

a.concat(b)   //连接数组
(12) ["json", 333, "lyh", 222, "egon", 11, 22, 44, 55, 33, 99, 77]

b.sort() //排序默认排序是升序，如果想要降序，就reverse反转
(7) [11, 22, 33, 44, 55, 77, 99]

var a = ['qwe', 123, 'qe', 244]
a.forEach(function (value, index, array) {  //将数组的每个元素传递给回调函数
    console.log(index, value, array)
})
/*
value: 必须要填的，当前元素，
index： 可选，当前元素的索引值
arrary： 可选，当前元素所属的数组对象
*/
VM968:3 0 "qwe" (4) ["qwe", 123, "qe", 244]
VM968:3 1 123 (4) ["qwe", 123, "qe", 244]
VM968:3 2 "qe" (4) ["qwe", 123, "qe", 244]
VM968:3 3 244 (4) ["qwe", 123, "qe", 244]

a
(4) ["qwe", 123, "qe", 244]
a.splice(0,2)  // 删除，第一个起始位置，第二个删除几个元素
(2) ["qwe", 123]
a.splice(0,2, ['egon','jason'])  //第三个值，向数组添加的新元素，可以是数组，也可以是单个元素，如果是数组，那就会变成一个二维数组
(2) ["qe", 244]0: "qe"1: 244length: 2[[Prototype]]: Array(0)
a
[Array(2)]

a.map(function (value, index, array) {  //这个方法和forEach一样
    console.log(index, value, array)
})
VM260:2 0 "qwe" (4) ["qwe", 123, "qe", 244]
VM260:2 1 123 (4) ["qwe", 123, "qe", 244]
VM260:2 2 "qe" (4) ["qwe", 123, "qe", 244]
VM260:2 3 244 (4) ["qwe", 123, "qe", 244]
(4) [undefined, undefined, undefined, undefined]

    运算符

    + - * / % ++ --   

这些和python大差不差，
区别：
	++:自增1
    	x++： 先赋值在自增
        ++x:  先自增在赋值
	--：自减1
    
    var a=10
    res = a++
    console.log(res)  // 先赋值在自增，，所以此时打印的res=10
    console.log(a)   //  a做了一次自增 此时为11
    res1 = ++a
    console.log(res1) //先自增在赋值， 11自增1为12，在赋值给res1
    VM271:3 10
    VM271:4 11
    VM271:6 12


> >= < <= != == === !==
        
        ==： 是弱等于，只比较值，不比较数据类型
        ===： 是强等于，值和数据类型都要比较
        ！=： 弱不等，只比较值
        ！==：强不等，值和数据类型都比较

console.log(1 == '1')   // 若等于，，1和1值相等，数据类型不相等
console.log(1 === '1')  // 强等于，，1和1值相等，数据类型不相等
VM277:1 true
VM277:2 false


&& || !   与  或  非 类比python的and or not

= += -= *= /=  类比python的赋值运算符

    流程控制

    if-else if -else 
/*
需求：
   用流程控制打印一个分数，分数小于60不及格，大于60小于70及格，，依次类推
*/
var score=90
if (score<60){
    console.log('不及格')
}else if (score>=60 && score <70){
    console.log('及格')
}else if (score>=70 && score<80){
    console.log('良好')
}else if (score>=80 && score<90){
    console.log('优秀')
}else {
    console.log('棒')
}


switch
    
/*
需求：
	定义一个变量，如果是1则打印周一，2则打印周二，3则打印周三，其他则打印不存在
*/
    var day=1
    switch (day) {
        case 1:
            console.log('周一')
            break
        case 2:
            console.log('周二')
            break
        default:
            console.log('其他')
    }
switch分支语句，每一个case条件下面都要加入break结束掉，不然，只要一个成立后面跟着的全部都成立
最后一个可以加一个default，相当于if里面的else

    循环

    for (var i = 0; i< 10; i++){
    console.log(i)
}
/*for循环这样写，这个打印0-9*/


var i = 0
while(i<10){
    console.log(i)
    i++
}

    三元表达式

    var aa=1
var bb=2
var c=aa>bb ? aa:bb  
    /*这个就是判断aa>bb是否成立，，如果成立则返回：前面的，不成立返回：后面的*/

c
2

可以多个条件连用

    函数

    • 普通函数

      function func() {
    console.log('函数func')
}
func()

    • 带参函数

      function func(a,b,c) {
    console.log(a) //这个就是位置传参，第一个
    console.log(arguments.length)
    console.log(arguments[0]+arguments[1]) //arguments这个里面包含了所有传递的参数
}
func(1,2,3)
 1
 3
 3
/*传参按照位置传参，arguments相当于将出传入的参数全部包含*/

    • 带返回值的函数

      function f(a,b) {
    return a+b
}
var res=f(1,2)
console.log(res)

// 函数只能返回一个值，如果要返回多个值，只能将其放在数组或对象中返回。

    • 匿名函数

      var res = function () {
    console.log('匿名函数')
}
res()
VM419:2 匿名函数

    局部变量和全局变量

    局部变量：
	只要函数运行完毕，本地变量就会被删除
全局变量：
	函数外声明的都是全局变量
    
作用域：
	与python作用域关系查找一模一样

    自定义对象

    • 第一种定义方式

      1. 定义一个空对象
var obj=new Object() //定义空对象

console.log(obj) 
obj.name='egon'   //增加属性
obj['age']=19    //增加属性

console.log(obj)
VM465:1 {name: "egon", age: 19}

obj.name  //查看属性

"egon"
delete obj.name  //删除属性
true
obj
{age: 19}
obj.age=20  //修改属性
20
obj
{age: 20}

var obj = {'name':'egon', 'age': 10}
for (i in obj){  //对象的循环打印
    console.log(i, obj[i])
}
VM596:3 name egon
VM596:3 age 10

    • 第二种定义方式

      var = obj={}

// 这种方法定义的对象的处理方式和new出来的是一样的

    Date对象

    var d=new Date()   //创建一个日期对象
undefined
d.getDate(        //获取日
    )
5
d.getDay()        //获取星期
4
d.getMonth()       //获取月份  语法规定月份(0-11)
7
d.getYear()        //获取年，1990年到现在多少年
121
d.getHours()       //获取小时
19
d.getMinutes()      //获取分钟
25
d.getSeconds()       //获取秒
21
d.getMilliseconds()   //获取毫秒
795
d.getTime()            //获取累计毫秒(1970年到现在的毫秒)
1628162721795

    JSON对象

    var d={'name':'egon', 'age': 10}
var d_json = JSON.stringify(d)   // 对象序列化成字符串 等价于python的dumps
console.log(d_json)
console.log(JSON.parse(d_json))  //字符串反序列化成对象等价于python的loads
VM948:3 {"name":"egon","age":10}
VM948:4 {name: "egon", age: 10}

    正则对象

    //定义正则的两中方式
var re1 = new RegExp('^[a-zA-Z0-9]{5,16}')
re1.test('json000')

var res2 = /^[a-zA-Z0-9]{5,16}/
res2.test('jaon0000')

注意全局匹配：
	var res  ='egondsb dSb dsb'
    /*match 是全局匹配的方法，字符用//，全局后面跟g(gloable),,,i代表忽略大小写*/
    res.match(/s/gi)

    Math对象

    abs(x)      返回数的绝对值。
exp(x)      返回 e 的指数。
floor(x)    对数进行下舍入。
log(x)      返回数的自然对数（底为e）。
max(x,y)    返回 x 和 y 中的最高值。
min(x,y)    返回 x 和 y 中的最低值。
pow(x,y)    返回 x 的 y 次幂。
random()    返回 0 ~ 1 之间的随机数。
round(x)    把数四舍五入为最接近的整数。
sin(x)      返回数的正弦。
sqrt(x)     返回数的平方根。
tan(x)      返回角的正切。
posted @ 2021-08-05 19:43  剧终cur  阅读(113)  评论(0)    收藏  举报