JS 笔记-CSDN博客

本文链接：https://blog.csdn.net/m0_61834747/article/details/134988977

1、js变量

js的常见变量类型如下五种：

数值类型： number

字符串类型： string

对象类型： object

布尔类型： boolean

函数类型： function

js当中特殊的值：

undefi未定义，所有JS变量未赋予初始值的时候，默认值都是undefi

nul空值

NaN全称是：not a number 非数字，非数值

js定义变量的语法：var变量名=值

2、js关系比较运算和逻辑比较运算

关系运算：

等于：==比较值

全等于：===除了做自勉之的比较之外，还会比较两个变的数据类型

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <script type="text/javascript"> var i ="11"; var j = 11; document.write(i == j); document.write("br />") document.write(i ===j) </script> </body> </html>

首先来说明一下“utf-8”是一种字符编码。charset=”utf-8”是告知浏览器此页面属于什么字符编码格式，下一步浏览器做好“翻译”工作。常见的字符编码有：gb2312、gbk、unicode、utf-8。

各个字符编码含义：

gb2312：代表国家标准第2312条，其中是不包含繁体的（虽然咱们不怎么使用繁体了，但是台湾还在使用繁体啊。那怎么办呢？）。

gbk：国家标准扩展版（增加了繁体，包含所有亚洲字符集）。

unicode：万国码（字面意思你也懂的）。

**utf-8：**unicode的升级版。

逻辑运算

且运算：&&

或运算：||

取反运算：！

0、null、undefined、“”（空串）都认为是false

&&且运算

第一种：当表达式全为真的时候。返回最后一个表达式的值。

第二种：当表达式中，有一个为假的时候。返回第一个为假的表达式的值。

||或运算

第一种：当表达式全为假时，返回最后一个表达式的值；

第二种：只要有个表达式为真。就会回第一个为真的表达式的值。

3、js当中的数组

js数组的定义：

var数组名=[];//空数组

var数组名=[1,'abc',true];//定义数组同时赋值元素

eg:arr[0]=12;

//数组的遍历

for (var i=0;i

alert(arr[i]);

}

4、js当中的函数（function）

第一种：使用function关键字来定义

function函数名（形参列表）{

函数体

}

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <script type="text/javascript"> function fun() { document.write("我是无参函数fun"); } function sum(num1,num2) { document.write("我是有参函数：") var result = num1 + num2; return result; } document.write(fun()); document.write("<br />") document.write(sum(100,50)); </script> </body> </html>

第二种定义函数的方法

var 函数名=function（形参列表）{

函数体

}

<!DOCTYPE html> <html> <head> <meta charset="UTF - 8"> <title></title> </head> <body> <script type="text/javascript"> var fun = function() { document.write("我是无参函数fun"); } var sum = function (numl,num2) { document.write("我是有参函数：") var result = numl + num2; return result; } document.write(fun()); document.write("<br />") document.write(sum(100,50)); </script> </body> </html>

注意：在Java中函数允许重载。但是在JS中函数的重载会直接覆盖掉上一次的定义。

5、js中的自定义对象

Object形式的自定义对象对象的定义：

var 变量名=new Object();//对象实例（空对象）

变量名.属性名=值；//定义一个属性

变量名.函数名=function（）{}//定义一个函数

对象的访问：变量名.属性//函数名（）；

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <script type="text/javascript"> //创建对象 var dog = new Object(); //创建属性 dog.color = "白色"; dog.age = 3; //创建函数 dog.fun = function() { document.write("颜色:"+this.color+"<br/>狗狗年龄："+this.age); } dog.fun(); </script> </body> </html>

{}花括号形式的自定义对象

对象的定义：var 变量名={//空对象

属性名：值，//定义一个属性

函数名：function（）{}//定义一个函数

}；

对象的访问：变量名.属性/函数名（）

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <script type="text/javascript"> var dog = { name: "小白", color: "白色", sex: "公", show: function() { document.write("姓名：" + this.name + "颜色：" + this.color + "性别：" + this.sex) } }; dog.show(); document.write("<br />") document.write(dog.name) </script> </body> </html>

6、js事件

什么是事件？事件是电脑输入设备与页面进行交互的相应。我们称之事件。

常用的事件如下：

事件	描述
onchange	HTML元素改变
onclick	用户点击HTML元素
onmouseover	用户在一个HTML元素上移动鼠标
onmouseout	用户从一个HTML元素上移开鼠标
onkeydown	用户按下键盘按键
onload	浏览器已完成页面的加载

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <input type="button" id="" value="单击我" οnclick="show()"/> <body> <script type="text/javascript"> var show = function() { alert("我爱学习JavaScript"); } </script> </body> </html>

JavaScript用法

HTML中的Javascript脚本代码必须位于标签之间。

JavaScript脚本代码可被放置在HTML页面的

和部分中。