英文企业网站源码,工程装修,杭州专业做网站的公司有哪些,将网站保存怎么做文章目录 一、输入和输出内容 1.1 输出 1.1.1 在浏览器的控制台输出打印 1.1.2 直接在浏览器的页面上输出内容 1.1.3 页面弹出警告对话框 1.2 输入 二、变量 2.1 变量是什么 2.2 变量的声明和赋值 2.3 变量的命名规范和规范 三、变量扩展#xff08;数组#xff09; 3.1 数组…文章目录 一、输入和输出内容 1.1 输出 1.1.1 在浏览器的控制台输出打印 1.1.2 直接在浏览器的页面上输出内容 1.1.3 页面弹出警告对话框 1.2 输入 二、变量 2.1 变量是什么 2.2 变量的声明和赋值 2.3 变量的命名规范和规范 三、变量扩展数组 3.1 数组的声明 3.2 数组的使用 3.3 数组的长度 四、常量 4.1 常量的声明和赋值 五、数据类型 5.1 数字数据类型 5.2 字符串类型 5.3 布尔类型 5.4 null 类型 5.5 未定义类型 六、隐式转换和显示转换 6.1 使用 进行隐式转换 6.2 显示转换 七、运算符 7.1 算数运算符 7.2 赋值运算符 7.3自增自减运算符 7.4 比较运算符 7.5 逻辑运算符 7.6 三元运算符 7.7 运算符的优先级 八、分支语句 8.1 单分支语句 8.2 双分支语句 8.3 多分支语句 8.4 switch分支语句 九、循环语句 9.1 while循环 9.2 for 循环 9.3 for循环的嵌套 十、数组的使用 10.1 数组的声明可以放任意的数据类型不只是数字这里 10.2 取值 10.3 数组的长度表示 10.4 数组的基本使用 10.5 数组的相关操作 十一、函数的使用 11.1 封装函数 11.2 函数参数以及默认参数 11.3 函数的返回值 11.4 作用域 11.4.1 全局作用域 11.4.2 局部作用域 11.5 匿名函数 没有名字的函数 11.5.1 函数表达式 11.5.2 立即执行函数 十二、对象 12.1 对象的基本使用 12.2 对象的相关操作 12.3 对象的方法 12.4 遍历对象 12.5 内置对象 十三、随机数函数 十四、总结 一、输入和输出内容
1.1 输出
1.1.1 在浏览器的控制台输出打印 console.log(I love JS) 1.1.2 直接在浏览器的页面上输出内容
document.write(111) 1.1.3 页面弹出警告对话框
alert(出错啦) 1.2 输入
prompt(请输入你的姓名)
显示一个对话框对话框中包含一条信息用来提示用户输入文字 二、变量
2.1 变量是什么 变量是一个容器用来存储数据的。举一些生活中的例子就比如比较熟悉的HTML标签、教室、宿舍等等 2.2 变量的声明和赋值 使用关键字let 声明
let age 20let arr [10, 20, 30, 40, 50, 60, 70, 80, 90]let name 张三 案例 交换两个变量 scriptlet a 10let b 20let tt aa bb tdocument.write(a/br b)/script 2.3 变量的命名规范和规范 规则 1. 不能使用关键字有特殊含义的字符比如JavaScript内置的一些英语词汇var, let, const, for, if... 2. 只能用数字、字母、下划线、$组成 不能以数字开头 3. 严格区分大小写 比如name和Name是两个不同的变量 规范 1. 起名要有意义比如商品你可以使用goods, 这样别人看到就可以很快理解了 2. 可以采用小驼峰命名比如用户姓名 userName 三、变量扩展数组
3.1 数组的声明
let arr [1,2,3,4, xx]
3.2 数组的使用 数组是有序的如果需要使用数组中的元素可以使用索引号(下标)来查找索引号从0开始 - 数组名[下标] console.log(arr[0]) // - 1console.log(arr[2]) // - 3
3.3 数组的长度
console.log(arr.length) // - 5 四、常量
4.1 常量的声明和赋值
使用 const 声明 const PI 3.14
//常量声明时必须赋值
//常量赋值后不能修改
console.log(PI) 注意常量不能够被重新赋值常量在声明的时候必须赋值初始化 五、数据类型 JS的数据类型分为两大类基本数据类型和引用数据类型 1. 基本数据类型 数字类型number、字符串类型string、布尔类型boolean、空类型null、未定义型undefined 2. 引用数据类型对象object 在JS中可以使用type of 来查看变量是什么数据类型 5.1 数字数据类型
let num 20
console.log(type of num) // - number
5.2 字符串类型
let name 张三
console.log(type of name) // - string 1. 字符串的拼接 使用 进行拼接 console.log(我的同学叫 name ,他很帅) 2. 模板字符串 /scriptlet str xxlet str1 xx1let str2 // 模板字符串// 1. 模板字符串用反引号标识// 2. 模板字符串中可以出现变量变量用${变量名}标识// 3. 模板字符串中可以出现表达式表达式用${表达式}标识// 4. 模板字符串中可以出现函数调用函数调用用${函数名()}标识// 5. 模板字符串中可以出现多行文本用\n标识let age 20console.log(我今年${age}岁了);/script 5.3 布尔类型
let isClick true
console.log(type of isClick) // - trueconsole.log(3 4) // - false
5.4 null 类型
let obj null5.5 未定义类型 声明了变量但是未赋值那么这个变量就是未定义类型 let num
console.log(num) // - undefined
六、隐式转换和显示转换
6.1 使用 进行隐式转换
只要加号一侧有引号就会将另一侧的数字型转换为字符串类型
console.log(1 1) // - 2
console.log(xx 1) // - xx1 6.2 显示转换 1. 转为数字类型 let s 1
let num Number(s)
console.log(num) // - 1 注意1其实除了 外 其他运算符 - * /都有同样的作用 2但是利用NUmber()进行强制转换时所需转换的变量去掉引号后必须是数字不然会变成NaN 除了Number以外还有两种方法可以转换为数字类型 1. parseInt() 只保留整数 2.parseFloat() 可以保留小数 2.转为字符串类型 let num 1
let str String(num)
console.log(str) - 1 七、运算符
7.1 算数运算符 算数运算符我们应该已经很熟悉了 - * / , % ... 7.2 赋值运算符 1. 2. - * / ,...... let num 10
num 10 // - 相当于 num num 10 7.3自增自减运算符 -- let num 1
num num 1
console.log(num) // - 2// same
num
console.log(num) - 2 更多解释 后置自增 i 和 前置自增 i 的区别 let i 1console.log(i 1); // 结果是3// 注意 i是2// i先自加 1 变成2之后再和后面的2相加
let i 1
console.log(i 1) // - 2// i后加1参与运算的i值仍是1
7.4 比较运算符 等于值相同 全等 值和数据类型都相同 不等!, 不全等!, , , 结果是布尔类型 7.5 逻辑运算符 逻辑与 一假则假 逻辑或 || 一真则真 逻辑非 假变真真变假 7.6 三元运算符
console.log(3 5 ? 3 : 5)
分析如果35为true, 则结果为3 否则结果为5 案例数字补零 也涉及到了字符串的拼接 // 1. 用户输入
let num prompt(请输入一个数字)alert(num 10 ? 0 num : num) 7.7 运算符的优先级 这里面分的比较细 八、分支语句
8.1 单分支语句
if (i 10) {document.write(猜对了)
}
8.2 双分支语句
if (i 10) {document.write(猜对了)
} else {document.write(猜错了)
} 案例判断闰年 let year prompt(请输入年份)
if (year % 4 0 year % 100 ! 0 || year % 400 0) {alert(${year}是闰年)
} else {alert(${year}不是闰年)
} 8.3 多分支语句
if() {} else if () {} else if () {} ... else {} 直接上案例成绩判断 let score prompt(请输入分数)
if(score 90) {alert(A)
} else if (score 80) {alert(B)
} else if (score 70) {alert(C)
} else if (score 60) {alert(D)
} else {alert(不及格)
} 8.4 switch分支语句 语法格式 switch (key) {case value:break;case value:break;...default:break;} 案例还是上面成绩案例 let score prompt(请输入你的成绩)score / 10switch (score) {case 10:alert(A)break;case 9:alert(B)break;case 8:alert(C)break;case 7:alert(D)break;case 6:alert(E)break;default:alert(不及格)break;} 九、循环语句
9.1 while循环
// 循环三要素: 变量起始值; 终止条件; 变量变化量(用自增或者自减)let i 0 // 变量起始值while(i 5) { //终止条件document.write(我爱学习!)i //变量变化量} 案例无限循环 - 只要不满足退出的条件就会无限执行你爱我吗 while(1) {let text prompt(你爱我吗?)if (text 爱) {break}} 9.2 for 循环 语法格式 for (变量初始值; 终止条件; 变量变化量) {// 循环体
} 案例演示 for (let k0; k3; k) {document.write(好好学习)} 9.3 for循环的嵌套 直接上案例九九乘法表 let i, jfor (i 1; i 9; i) {for (j 1; j i; j) {document.write(${j} * ${i} ${i * j} )}document.write(br)} 补充那么什么时候使用for循环什么时候使用while循环 当循环次数确定时使用for循环。循环次数不确定时使用while循环 十、数组的使用
10.1 数组的声明可以放任意的数据类型不只是数字这里
let arr [2, 6, 1, 7, 4] //可以放任意的数据类型不只是数字这里以数字举例
10.2 取值 通过下标或索引号取值从0开始 arr[0] // - 2
arr[1] // - 6 10.3 数组的长度表示
arr.length // - 5
10.4 数组的基本使用 直接上案例使用for循环遍历数组 , 求数组元素之和和平均值 let arr [2, 6, 1, 7, 4]let ilet sum 0let average 0.0for (i 0; i arr.length; i) {sum arr[i];}average sum / arr.length * 1.0document.write(和为${sum}, 平均值为${average}) 案例求数组中的最大值 默认最大值和最小值的初始值为数组中的第一个元素arr[0] let arr [2 ,6, 1, 77, 52, 225, 7]let max arr[0]let min arr[0]for (let i 1; i arr.length; i) {if (arr[i] max) {max arr[i]}if (arr[i] min) {min arr[i]}}document.write(最大值为${max})document.write(最小值为${min})
10.5 数组的相关操作 修改 // 改let arr []arr[0] 1console.log(arr)let arr1 [蓝, 红, 黄]arr1[1] 绿console.log(arr1) 新增 // 增// 1. push 末尾新增let arr2 [小明, 小强, 小刚]arr2.push(小华)console.log(arr2)console.log(arr2.push(小华)) // 可以直接返回数组的长度// 2. unshift 开头新增let arr3 [1, 2, 3, 4]console.log(arr3.unshift(6)) // 也可以直接返回数组的长度console.log(arr3)删除 // 删除// 1. pop() 可以删除数组中的最后一个元素,并且返回该元素的值let arr4 [1, 3, 5, 7, 8, 9]console.log(arr4.pop())console.log(arr4)// 2. shfit() 删除第一个元素, 并且返回该元素的值console.log(arr4.shift())console.log(arr4)// 3. splice() 删除指定的元素// 语法: arr.splice(起始位置-索引号, 删除几个元素)let arr5 [9, 10, 87, 99, 76]console.log(arr5.splice(1,2))console.log(arr5) 十一、函数的使用
11.1 封装函数 函数: 可以实现代码复用,提高开发效率 function 是执行特定任务的代码块 1. 声明语法: function 函数名() { 函数体 } 2. 调用语法: 函数名() // 声明
function fn() {document.write(好好学习)
}// 调用
fn() 11.2 函数参数以及默认参数 直接上案例 封装一个函数,计算两个数的和 // let a,b function sum(a, b) {console.log(a b)}sum(4,3) // - 7 基于上述代码如果调用函数时没有传参相当于a 和 b 都未定义为undefined, 所以返回结果时NaN, 为了优化代码我们可以设定默认参数 11.3 函数的返回值
函数返回值的优点是便于得到数据并对数据进行相应的处理和使用 关键字 return function sum(a0, b0) {return a b}let sum1 sum(4,3)console.log(sum1) 11.4 作用域
11.4.1 全局作用域 作用于所有代码的执行环境整个script标签内部 在下述代码中定义了一个变量num , 它既可以在函数外部使用也可以在函数内部使用 11.4.2 局部作用域 作用域函数内的代码环境因为跟函数有关所以也叫函数作用域 在下述代码中在函数内部定义了一个变量 str, 在函数外部使用时会报错 11.5 匿名函数 没有名字的函数
11.5.1 函数表达式 语法格式 let fn function() {// 函数体
} 这里面 fn 就相当于函数的名字 调用函数时 直接用 fn() 即可 // 1.函数表达式let fn function () {console.log(函数表达式)}fn() 11.5.2 立即执行函数 立即执行函数就是不用调用直接就可以执行 语法格式 (function() {})() // 立即执行函数: 避免全局变量之间的污染// 多个立即执行函数,之间需要用 分号 隔开(function () {let num1 9console.log(11)})();(function () {let num2 10console.log(11)})() 十二、对象 对象是一种无序的数据集合用来描述一个人或物 12.1 对象的基本使用
语法格式
let obj {属性名: 属性值...
}
比如描述一个人
let obj {name: xx,age: 20,gender: 男
} 12.2 对象的相关操作 查找 语法对象名.属性 还有一种查的方法
对象名[属性名] console.log(obj[name]) 修改对象名.属性 新值 let obj {name: xx,age: 20,gender: 男}obj.name yyconsole.log(obj.name); 新增对象名.属性 新值 新增和修改的语法格式相同只不过增的是对象中没有的属性 删除delete 对象名.属性 12.3 对象的方法 12.4 遍历对象 let obj {name: xx,age: 20,gender: 男}for (let k in obj) {console.log(k) // k 是属性名, k字符串类型console.log(obj[k]) }
上述字符串的查找方式上文有介绍过 12.5 内置对象 十三、随机数函数
let num Math.random() // 返回一个 0-1 之间的随机小数, 包括0 不包括 1
console.log(num) 生成0-10的随机数 // 生成0-10的随机数
Math.floor(Math.random() * (101)) // 向下取整 同理 // 生成5-10的随机数Math.floor(Math.random() * (51)) 5// 生成N-M的随机数
Math.floor(Math.random() * (M-N1)) N 案例 let arr [1, 2, 3]
let n Math.floor(Math.random() * (arr.length))
console.log(arr[n]); 十四、总结 本片博客介绍了JavaScript的基础知识的内容是自己学完后的总结希望也可以帮助正在学习的你后续也会继续更新js高级的相关知识。
