js入门基础语法

js入门基础语法

什么是javaScript

概述

javaScript是世界上最流行的一门脚本语言
javaScript是一门很随意的语言 有句话叫做如果可以重新来过我就只愿意学javaScript
足够简单可以写前端也可以写后端
java和javaScript没关系知识名字恰好比较像 蹭java的热度

历史

博客JavaScript的起源故事-CSDN博客
javaScript从开发到上线10天
ECMAScript他可以理解成javaScript的一个标准
最新的版本语句到了es6版本了，但是大部分的浏览器还停留在es5代码上 这就使得开发环境和线上环境，版本不一致

快速入门

引入javaSciprt

内部标签

<script>
    //``````
</script>

外部引入

abs.js

//

test.html

<script src="abs.js"></script>

基本语法入门

<script>
    // 1.定义变量   变量类型   变量名=值;
    var score=71;
    alert( score);
//    2.条件控制
    if(score>60&&score<80){
        alert("及格");
    }else if(score>=80){
        alert("优秀");
    }else{
        alert("不及格");
    }
    //console.log(score)   在浏览器的控制台打印变量 相当于java中发sout
</script>

数据类型

变量

var 王者荣耀="倔强青铜"//只有数字不能大头

number

js不区分小数和整数，Number

123 //整数
123.1  //浮点数
1.123e3  //科学计数法
-99    //负数
NaN    //  not  anumber
Infinity    //表示无线大

字符串

"zbc"  'zbc'

布尔值

true   false

逻辑运算

&&  两个都为真
||  一个为真，结果为真
！  真就是假   假就是真

不叫运算符！！！！！！重要

= 赋值预算符
== 等于（类型不一样，值一样，也会判断成true）
=== 就对等于（类型一样，值一样，结果true）
这是js的一个缺陷，坚持不要用= =比较
须知：NaM= =NAN,这个与所有的数值都不相等，包括自己
只能通过isNAN（NAN）来判断这个数是否是NaN

浮点数问题

console.log（（1/3）===（1-2/3））

尽量避免使用浮点数进行运算，存在精度问题！
Math.abs（1/3-(1-2/3)）<0.00000001

null 和undefine

• null 空
• undefined 未定义

数组

**java的数组必须是相同类型的对象~，js中不需要这样 **

//保证代码的可读性，尽量使用[]
var arr =[1,2,3,4,5,6,'hello',null,true];
new Array(1,2,16,3,8,2,'hello');

取数组下标：如果越界了，就会

undefined而不是报错

对象

对象是大括号 数组是中括号，每一个属性之间使用逗号隔开，最后一个属性不需要添加

var person={
name：“qinjiang”,
age:3,
tags:['js','java']
}

数据类型

字符串

1. 正常我们使用单引号或者双引号包裹
2. *注意使用转义字符 *

• ' 单引号
• \n 换行
• \t tab
• \u4e2d Unicode字符
• \x41 Ascll字符

3. 多行字符串编写

//tab  上面esc键下面
    var   msg=`
    Hello
    world
    `

4. 模版字符串

let  name="qinjing"
let   age=3;
let   mag=`nihaoya,${name}`

5. 字符串长度
   str.length
6. 字符串的可变性和不可变性

Let student="student"
Console.log(student[0])     s
Student[0]=1             1
Console.log(student)     student

7. 大小写转换

student.toUpperCase()
student.toLowerCase()

8. student.indexOf('t') //什么下表
9. subing

[)
student.subing(1)  //从第一个字符串截取到最后一个
student.subing(1,3)//包头不包尾 

数组

Array可以包含任意的数据类型

var arr=[1,2,3,4,5,6]

1. 长度

arr.length

注意： 加入给arr.length赋值，数组大小就会发生变化，如果赋值过小，元素就会丢失

2. indexof，通过元素获得下标索引、

arr.indexof(2)     //1

字符串的1和数字1不一样

3. slice() 截取Array的一部分，返回一个新数组
   类似于string的substring
   
4. pop()，push()
   添加删除从尾部
   
5. unshift(),shift()
   添加删除从头部
   
6. 排序 sort（）
7. 元素反转reverse（）
   
8. 拼接concat（）
   并不会修改数组，只是会返回一个新数组
   
9. 连接符 join
   打印数组，使用特地的字符串连接
   
10. 多维数组
11. fill
    

对象

若干个键值对

var 对象名={
    属性名：属性值,
    属性名：属性值,
    属性名：属性值
}
var person={
    name:"kuangsheng",
    age:3,
    email:"1985298021@qq.com"，
    score：0
}

js中的对象，{}表示一个对象，键值对描述属性XXXXXX：XXXXXX多个属性之间使用逗号隔开，最后一个不加逗号！！！！

1. 对象赋值

    person.name="qinjiang"
    "qinjiang"
    person.name
    "qinjiang"

2. 使用一个不存在的对象属性，不会报错！ undefined

person.haha
undefined

3. 动态的删除属性

delete person.name
true
person

4. 动态的添加

person.haha="haha"
"haha"
person

5. 判断属性值是否在这个对象中！ XXX in XXX！

'age' in person
true
//继承  tostring是父类有的
'toString' in person
true

6. 判断属性值是否在这个对象自身有的hasOwnProperty（）

person.hasOwnproperty('toString')
false
person.hasOwnProperty(;age)
true

流程控制

判断

var age =3
if(age>3){
	slert('hah');
}else if(age<5){
	alert('kuwa');
}else{
	alert('kukuku~~~~');
}

循环避免死循环

while(age<100){
	age=age+1;
	console.log(age);
}
for(let i=0;i<100;i++ ){
	console.log(i);
}
do{
	age=age+1;
	console.log(age);
}while
//数组循环=>函数循环    foreach
var person={ 1，1,2,3,6,58,52，41}
person.forEach(function (value)){
	console.log(value)
}
//数组循环
for(var num in person){
	console.log(person[num])
}

map set

es6 新特性
map

//统计学生的成绩和学生的名字
//var names=["tom","jack","haha"]
var map=new Map(['tom',100],['jack',90],['haha',90])
var name=map.get('tom');//取值
map.set('admin',123456)//添加
console.log(name);
map.delete("tom")//删除

set

var set=new Set([3,1,1,1,1])
console.log(set)//去重      3,1
set.add(2) //添加  3,1,2
set.delete(1) //删除
console.log(set.has(3))//是否包含某个元素

iterator

es6 新特性
遍历迭代

//通过 for   of 实现 迭代循环    通过for   in下表  
//遍历数组
var arr=[3,4,5]
for(var x of arr){//不仅可以打印数组还可以打印集合
console.log(x)
}
//遍历map集合
var map=new Map(['tom',100],['jack',90],['haha',90])
for(var x of map){
console.log(x)
}
//遍历set集合
var set=new Set([3,1,1,1,1])
for(var x of set){
console.log(x)
}