目录
一、变量
变量是用于存储信息的"容器"。
变量名称：
- 变量有数字、字母、下划线（_）和$组成
- 不能以数字开头，不能是关键字、保留字
- 严格区分大小写（y 和 Y 是不同的变量）
- 变量名必须有意义
- 遵循驼峰命名法（首字母小写，后面单词的首字母需要大写，例如：myName）
1.声明（创建）变量
定义变量，先声明后赋值；一个变量名只能定义一次
var name; //使用关键字var声明变量
name="ly"; //向变量赋值
//var name = "ly"2.声明变量关键字
- var、let 关键字：初始化值后可再次赋值修改
var name = 'ly'
name = 'zk'
let age = 20
console.log(name,age);//输出结果：zk 20注：想要输出多个变量，用逗号（，）分隔
- const 关键字：const 用于声明一个或多个常量，声明时必须进行初始化，且初始化后值不可再修改
const PI = 3.141592653589793;
PI = 3.14; // 报错
PI = PI + 10; // 报错
// 错误写法
const PI;
PI = 3.14159265359;
// 正确写法
const PI = 3.14159265359;值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、空（Null）、未定义（Undefined）、Symbol。
引用数据类型（对象类型）：对象(Object)、数组(Array)、函数(Function)，还有两个特殊的对象：正则（RegExp）和日期（Date）。
二、数据类型
1.字符串（String）
使用单引号或双引号
- 字符串长度：格式语法为变量名.length
- 字符串拼接：多个字符串之间可以使用 + 进行拼接，拼接前会把与字符串相加的任何类型转成字符串。字符串 + 任何类型=拼接后的新字符串
2.数字(Number)
整型值和浮点型值，如20、12.9
2.1数字型三个特殊值
- Infinity ，代表无穷大，大于任何数值
- -Infinity ，代表无穷小，小于任何数值
- NaN ，Not a number，代表一个非数值
isNaN（）：用来判断一个变量是否为非数字的类型，返回 true 或者 false
3.布尔(Boolean)
只能有两个值是 true 或 false，等价于1和2，默认值为false
4.未定义（Undefined）
表示变量不含有值
声明了变量userInfo，但是没有给值
let userInfo
console.log(userInfo); //输出：undefined5. 空（Null）
null是一个只有一个值的特殊类型，表示一个空对象引用。
三、数据类型的获取和转换
1.typeof
用来获取检测变量的数据类型
console.log(typeof 18); //number
console.log(typeof "小白"); //string
console.log(typeof true); //boolean
console.log(typeof undefined); //undefined
console.log(typeof null); //object2.数据类型转换
2.1转换为字符串
- toString() 和 String() 使用方式不一样
- 加号拼接字符串是隐式转换
2.2转换为数字型
- 注意parseInt和 parseFloat的大小写
- 隐式转换是我们在进行算数运算的时候，JS 自动转换了数据类型，
2.3转换为布尔型
Boolean（）函数 其他类型转换成布尔值
- 代表空、否定的值会被转换为 false ，如 ' '、0、NaN、null、undefined
- 其余值都会被转为true
四、对象
1.对象(Object)
JavaScript对象，对象也是一个变量，对象可以包含多个值（多个变量），
1.1利用字面量创建对象
格式为 {name：value } //（键：值）
- 键：相当于属性名
- 值：相当于属性值，可以是任意类型的值（数字类型、字符串类型、布尔类型，函数类型等）
1.2调用对象
- 对象里面的属性调用 : 对象.属性名
- 对象里面属性的另一种调用方式 : 对象[‘属性名’]，注意方括号里面的属性必须加引号
- 对象里面的方法调用：对象.方法名() ，注意这个方法名字后面一定加括号
var person = {
firstName:"John",
lastName:"Doe",
age:50,
eyeColor:"blue"
}
person.eyeColor = "pink" //修改变量的值
console.log(person); //输出：age: 50
// eyeColor: "pink"
// firstName: "John"
// lastName: "Doe"1.3利用new Object创建对象
- Object() ：第一个字母大写
- new Object() ：需要 new 关键字
- 使用的格式：对象.属性 = 值
- 每个属性和方法之间用分号结束
//利用new Object创建对象
let obj = new Object();
obj.name = "ly";
obj.age = 20;
obj.sex = "女";
obj.sayHi = function () {
console.log("hi~");
};
console.log(obj.name);
console.log(obj["sex"]);
obj.sayHi();1.4利用构造函数创建对象
构造函数就是把我们对象里面一些相同的属性和方法抽象出来封装到函数里面
- 构造函数用于创建某一类对象，其首字母要大写
- 函数内的属性和方法前面需要添加 this ，表示当前对象的属性和方法
- 构造函数中不需要 return 返回结果
- 当我们创建对象的时候，必须用 new 来调用构造函数
//构造函数的语法格式
function 构造函数名() {
this.属性=值;
this.方法=function(){}
}
new 构造函数名();//调用函数
//利用构造函数创建对象
function Star(uname, age, sex) {
this.name = uname;
this.age = age;
this.sex = sex;
this.sing = function (sang) {
console.log(sang);
};
}
let ly = new Star("栗子", 20, "女");
console.log(ly); //调用函数返回的是一个对象
console.log(ly.name);
console.log(ly["sex"]);
ly.sing("冷死了");
let zk = new Star("张广", 22, "男");
console.log(zk);
zk.sing("关空调");1.5遍历对象属性
for...in 语句用于对数组或者对象的属性进行循环操作。
//for in 遍历我们的对象
for (变量 in 对象名字) {
// 在此执行代码
}
let obj = {
name: "奥特曼",
age: 18,
hobby: "读书",
fn: function () {},
};
for (const key in obj) {
console.log(key); //key变量，输出得到的是属性名
console.log(obj[key]); //obj[key]得到的是属性值
}2.数组(Array)
2.1数组的定义格式
声明 变量名 = [ 值，值]
let arr1 = [1,2,3,4,5] //数组
let arr2 = [{num=1},2,3,'张三'] //数组里面的值也可以是对象、数字、字符串等
2.2数组的索引
数组名[下标/索引] //索引值从0开始，0、1、2、3......
- 当访问数组元素的没有时，输出undefined
2.3数组的长度
数组名.length
取数组的最后一个元素为：数组名[数组名.length-1]
2.4添加删除数组元素的方法
let arr=[10,23,45,26,78,90]
console.log(arr[3]);
console.log(arr.length);
let a=arr[arr.length-1]
console.log(a);
//
let arr1=[1,2,3,4,5]
//arr1[5]=6 //如果没有这个索引，也可修改添加值
console.log('操作之前',arr1);
//1.往末尾添加一个元素
arr1.push('ly')
//2.删除末尾的元素
// arr1.pop()
//3.删除前面的元素
// arr1.shift()
//4.往前面添加一个元素
arr1.unshift('zk')
console.log('操作之后',arr1);2.5数组转字符串 （join）
数组名.join('拼接符')
如果不想有拼接符传空字符串
let arr = [1, 2, 3, 4, 5];
console.log(arr.join(""));//12345
console.log(arr.join(" "));//1 2 3 4 5
console.log(arr.join("-"));//1-2-3-4-52.6字符串转数组 （split）
数组名.split(" ")
默认不传，每个都分割，如果传了，从传入的开始分割
let str1 = "12345";
let str2 = "120345";
console.log(str1.split(""));
console.log(str2.split("0"));
2.7数组的截取 （slice）
数组名.slice（a,b）
- a是索引（从0开始），从该索引开始提取原数组元素。
- b是提取终止处的索引（从0开始），提取原数组中索引从a到b的所有元素，包含 a，但不包含 b
- slice()方法 会返回一个新的数组，原数组不会被改变
let arr = [1, 2, 3, 4, 5];
// slice 不会改变原数组
let arr2 = arr.slice(0, 2);
let arr3 = arr.slice(2);
let arr4 = arr.slice(-4);
console.log(arr2, arr3, arr4);执行结果：
2.8数组的删除（splice）
数组名.splice（a,b）
- 第一个参数a是索引，第二个参数b是删除几个（从a的索引开始，包含a）
let arr = [1,2,3,4,5]
arr.splice(1,2)
console.log(arr);
// splice 也可以在指定位置上添加
let arr2 = [1,2,4,5]
arr2.splice(2,0,3)
console.log(arr2);
// 补充 删除方法 的返回值就是删除的元素
let arr3 = [1,2,3,4,5]
let res = arr3.splice(1,2)
console.log(res,'最后的删除');执行结果：
2.9数组的map方法
语法格式：
数组名.map(函数(数组的每一项，索引/下标)=>{
return 判断条件
}）
let arr = [1,2,3,4,5]
// 每一项都做函数里面的操作 最后返回一个新数组
let arr1 = arr.map((it,idx)=>{
return it * 5
})
console.log(arr1);//输出：[5,10,15,20,25]
// 简写
// let arr1 = arr.map( it=> it * 5 )
// console.log(arr,arr1);
2.10数组的过滤（filter）
格式语法：
数组名.filter(函数(数组的每一项，索引/下标)=>{
return 判断条件
}）
// 把 > 50 的数过滤出来 还是返回一个数组
let arr = [1,2,3,4,6,99,5,4,38,77]
// let arr1 = []
// arr.forEach(item=>{
// if(item>50){
// arr1.push(item)
// }
// })
// console.log(arr1);
// 过滤器 就是把满足条件的放到一个 新数组里面
// let arr2 = arr.filter((item,index)=>{
// return item > 50
// })
// 简写
// let arr2 = arr.filter(item=> item > 50)
// console.log(arr2);注： map、filter方法都有return返回值，forEach没有return返回值
五、运算符
1.算术运算符
以y=5为例：
2.赋值运算符
以：x=10，y=5为例：
3.字符串的+运算符
4.字符串和数字进行加法运算
- 数字+数字=数字和；
- 数字+字符串=字符串
var x=5+5;
var y="5"+4;
var z="Hello"+5;
console.log(x,y,z); //输出结果：10 '54' 'Hello5'5.比较运算符
以x=5为例：
6.逻辑运算符
- 逻辑与 &&：&&的前后都为true时，则返回true；&&的前后有一个为false，则返回false。当&&的前面为true时，则返回&&后面的；当&&的前面为false时，则返回&&前面的。
- 逻辑或 || ：||的前后有一个为true，则返回true；||的前后都为false时，才返回false。当||的前面为true时，则返回||前面的；当||的前面为false时，则返回||后面的。
- 逻辑非！：把！后面的值转换成布尔值，然后取反并返回。!true = false; !false = true
注：null、undefined、NaN、0、"" 在逻辑运算中会转为false
六、条件语句
1.if 语句
语法：
if (condition)
{
当条件为 true 时执行的代码
}
2.if...else 语句
语法：
if (condition)
{
当条件为 true 时执行的代码
}
else
{
当条件为 false 时执行的代码
}
3.if...else if...else 语句
语法：
if (condition1){
当条件 1 为 true 时执行的代码
} else if (condition2){
当条件 2 为 true 时执行的代码
} else{
当条件 1 和 条件 2 都不为 true 时执行的代码
}
七、for 循环
for循环的语法：
for (语句 1; 语句 2; 语句 3) //语句 1 （代码块）开始前执行
{ //语句 2 定义运行循环（码块）的条件
被执行的代码块 //语句 3 在循环（代码块）已被执行之后执行
}
八、forEach
forEach() 方法是遍历数组的每一个元素的函数
- item：数组元素的内容
- index：数组索引下标
let array=[1,2,3,4,5]
array.forEach((item,index)=>{
console.log(item,index);
})执行结果：
九、箭头函数
箭头函数语法:
声明 变量名 =（）=>{ }
//使用箭头函数，当只含有一个表达式时，可以省略{...}、return
let zk=(num1,num2)=> num1*num2
let res=zk(314,2)
console.log(res);
//当含多条语句，不能省略{ ... }和return
326
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
