js

js基础

js是用于游览器实现人机交互的编程语言

作用：

  1. 网页特效（监听用户的行为，让网页做出反馈）
  2. 表单验证（针对表单中的数据合法性进行判断）
  3. 数据交互（获取后台数据，渲染到前端）
  4. 服务端编程（node.js）

组成：

  1. 语法（变量，语句，对象等）
  2. Wed APls（DOM 和BOM）

使用方式：

内部：在body内，在HTML下面使用script标签直接写

外部：在外部写js文件，在body内使用script src=“地址”引入

1
2
3
4
5
<body>
    zzzzzzz
    <script>????????</script>
    <SCript:src="./11.JS "></SCript:src>
</body>

输入输出语法

输出：

  1. ​ document.write(‘要输出的内容’)

    内容可以是标签

  2. ​ alert(‘要输出的内容’)

    页面弹出警告对话框

  3. ​ console.log(‘控制台输出’)

    调试使用

输入：

  • prompt(‘请输入你的年龄’)

弹出对话框

变量

声明和赋值

let 变量名 = ？

1
2
let age =18;
alert(age)

使用

1
2
let age =prompt('请输入你的年龄')
alert(age)

数组

定义：

let 数组名 = [数据1，.......]

长度：

数组名.length

增:

数组名.push(元素1，元素2)将一个或者多个元素添加到数组末尾，并返回新长度

数组名.unshift(元素1，元素2)将一个或者多个元素添加到数组开头，并返回新长度

删:

数组名.pop()删除最后一个元素并返回该元素的值

数组名.shift()删除第一个元素并返回该元素的值

数组名.splice(起始位置，删除几个元素)删除最后一个元素并返回该元素的值

常量

定义：

const 常量名 = ？

注意：常量不允许重新赋值，声明的时候必须初始化

数据类型和字符串

js是弱数据类型，变量只有赋值后才知道数据类型

注意：

输出的时候时候，如果是变量加‘ ’或者``或者“ ”就会变成字符串

“ “和’ ‘可以嵌套所以，不能同种嵌套(或者使用转移符，\后面的字符不编译)

1
2
console.log('我是"大帅"哥');
console.log('我是\'大帅\'哥');

字符串或者变量相连

使用+可以使内容相连输出

1
2
3
4
5
console.log('我是' +'大帅哥');
let a=10
let b=20
console.log(a+b); //=30
console.log('我' + a+b+'岁');  //我1020岁

模版字符串

使用${变量}代替+号

1
2
let a=10
console.log(`我${a}岁`);  //我10岁

注意：使用模板字符串必须使用``(单引号)

布尔，未定义和空类型

  1. 变量初始化的时候，值为true 或者 false 就是布尔类型
  2. 声明之后没有初始化的变量叫未定义类型（不可计算）
  3. 变量初始化的时候，值为null 就是空类型（可以作为还没创建的对象，可计算=0）

类型转换

隐式转换：

使用+号时，左右有一个字符串，则另一个默认转化为字符串

除了+号以外，其他的运算符但是转化为数字型

+号加字符串会转化成数字型

1
2
3
4
5
6
let a=10
let b=20
console.log('我' + a - b +'岁');  //我1020岁

alert(+ '12') //数字型
alert('0' - 2);//=-2

显性转化：

  1. Number（数据）：数字型

    （NaN也是数字类型，代表非数字）

  2. parselnt（数据）：只保留整数

  3. parseFloat（数据）：可以保留小数

1
2
parselnt（'12px'） //12
parseFloat（'12.52px'）//12.58

运算符

  1. === ：判断两边类型和值是否相等
  2. !==：判断两边类型和值不相等

注意：

  • NaN不等于任何人，包括它自己

  • 字符串比较使用对应的ASCII表，对位一一对比

选择结构

  1. if（条件）{执行代码}else if{执行代码} else{执行代码}

    所有空字符串（’ ‘）都为真

  2. 三元运算符（条件？满足执行：不满足执行）

  3. switch（条件）{case 值1 : 代码 break case 值2 : 代码 break default :代码 }

循环结构

  1. 断点调试：

  2. while(条件){代码}

  3. for(起始值；终止条件；变量变化量){代码}

    break：结束循环

    continue：结束本次循环，进入下一次循环

函数

声明：

function 函数名 (){函数体}

返回值：

return 数据

匿名函数：

  1. 函数表达式：将匿名函数赋值给一个变量，通过变量名使用

    1
    let a1 = function (){}

  2. 立即执行函数：防止相同变量名污染，后面的括号是调用函数，是实参

    1
    2
    (   function(x){}  )(1);
    (  (function(x){}  )(1)    )

  3. 注意：

  • 两种写法，多个中间要分号隔开
  • 可以加函数名，但是因为立即执行不能调用