软件设计之JavaScript(1)
【狂神说Java】JavaScript最新教程通俗易懂
学习内容：
软件开发技能点参照：软件开发，小白变大佬，这套学习路线让你少走弯路是认真的，欢迎讨论
软件开发技能点顺序参照：Java学习完整路线，强烈建议收藏转发
- 什么是JavaScript
- 引入JS
- 数据类型
- 函数
- 变量作用域
- 方法
1、什么是JavaScript
JavaScript是一门脚本语言
一个合格的后端人员，必须要精通JavaScript
ECMAScript可以理解为是JavaScript的一个标准
2、引入JS
Script内语句
var num = 1；设置变量时出现warning：
'var' used instead of 'let' or 'const'
解决方法
<script >
//1. 定义变量 变量类型 变量名 = 变量值
var num1 = 1;
var num2 = 2;
//条件控制
if (num1>num2){
alert("true");
}else{
alert("false");
}
</script>
严格审查模式
前提：IDEA需要设置
支持ES6语法
严格审查模式预防JS的随意性导致产生一些问题
局部变量建议使用let定义
<script >
`use strict`;
</script>
console.log(var)
在浏览器控制台打印变量
3、数据类型
number
JS不区分小数和整数，Number
字符串
正常字符串使用单引号或双引号
多行字符串编写用这个包裹``(TAB键上面的)
字符串仍不可变
模版字符串
此处的是TAB上的
``号
<script >
`use strict`;
let name = "小明"
let msg = `你好,${name}`
console.log(msg)
</script>
substring
从第一个字符串截取到最后一个字符串 X.substring(1)
从第一个字符串截取到第三个字符串 X.substring(1,3)
布尔值
true，false
逻辑运算
&& 与
|| 或
！ 非
比较运算符
=
== 等于 (类型不一样，值一样，也会判断为true)
=== 绝对等于(类型一样，值一样，结果true)
注意NaN与所有的数值都不相等，包括自己 (NaN===NaN返回false)
可以通过isNanN()方法返回值判断是否为NaN，true为是；false为否
浮点数问题
第一行代码结果是false
数组
假如给数组的length属性赋值，数组大小会发生变化。赋值过小，元素会丢失
indexOf通过元素获取下标索引
slice() 截取Array一部分，返回一个新数组
push：从尾部添加
pop：从尾部弹出
对象
每个属性用逗号隔开，键值对描述属性 XXXX: xxxx
取对象用 Person.age
对象赋值直接赋值 person.name = “xxx”
使用一个不存在的对象属性不会报错–>输出undefined
JS中所有的键都是字符串，值是任意对象
<script >
var Person = {
name:"中国",
age:3,
tags:["js","java"]
}
</script>
动态删减/添加属性
通过delete删除对象的属性
直接给新的属性添加值就可以实现动态添加
判断属性值是否在对象中
xxx in xxx 返回布尔类型
'age' in person
全局对象window
默认所有的全局变量，都会自动绑定在window对象下
<script>
var x = 'xxx';
alert(x);
alert(window.x)//等价
</script>
Map与Set
Map：键值对集合数据结构
Set：无序不重复集合
Map
Set
iterator循环遍历
<script >
`use strict`;
let map = new Map([["tom",1],["jack",2]]);
for (let x of map){
console.log(x)
}
let set = new Set([5,6,7]);
for (let x of set){
console.log(x)
}
</script>
4、函数
定义函数
如果没有执行return，函数执行完也会返回结果，结果为：undefined
在JavaScript中，函数是一等公民，这意味着函数可以被赋值给变量、作为参数传递给其他函数、或作为其他函数的返回值。此外，函数在JavaScript中也充当构造函数的角色，用于创建对象。
<script >
`use strict`;
// 方法一
function abs(x){
if (x>=0){
return x;
}else{
return -x;
}
}
let abs1 = function (x){
if (x>=0){
return x;
}else{
return -x;
}
}
</script>
调用函数
参数问题：JS可以传任意个参数，也可以不传递参数
不存在参数，如何规避
手动抛出异常来判断
<script >
`use strict`;
let abs1 = function (x){
if (typeof x !=='number'){
throw 'Not a Number'
}
if (x>=0){
return x;
}else{
return -x;
}
}
</script>
参数存在多个
arguments是一个JS的关键字，代表
传递进来的所有参数，是一个数组
(ES6引入)rest获取除了已定义的参数之外的所有参数
<script >
`use strict`;
function aaa(a,b,...rest) {
console.log("a=>"+a);
console.log("b=>"+b);
console.log(rest);
}
</script>
5、变量的作用域
在JS中，var定义的变量是有作用域的
var变量在函数体中声明，则在函数体外不可用
如果两个函数使用相同变量名，只要在函数内部，则不冲突
<script >
`use strict`;
function aaa(x) {
var x = 1;
}
function bbb(x) {
var x = 'A';
}
</script>
内部函数可以访问外部函数的成员，反之不行
JS中函数查找变量从自身函数开始，由内向外，当内部没有该变量时，会去外部查找
<script >
`use strict`;
function aaa() {
var x = 1;
function bbb() {
var x = 'A';
console.log(x);
}
console.log(x);//1
var z = y + 1 //ReferenceError: y is not defined
bbb();//A
}
</script>
局部作用域let
ES6 let关键字，解决局部作用域冲突问题
<script >
`use strict`;
function aaa() {
for (var i = 0; i < 100; i++) {
console.log(i);
}
console.log(i)//100,正常情况是不能输出i的
}
</script>
提升变量作用域
规范：所有变量的定义都放在函数的头部，不能随用随定义，便于代码维护。
全局函数
6、方法
对象只有
属性和方法
方法的定义：把函数放在对象里
调用属性： func.name
调用方法：带括号 func.age()
调用方法1
<script >
`use strict`;
var func = {
name:'计算年龄',
birth:1999,
//方法
age:function () {
var now = new Date().getFullYear();
return now - this.birth;
}
}
</script>
调用方法2
其中 func.age()是正确使用
直接getAge()会报错NaN，因为this此时代表的是window，window没有birth属性
this的指向是可以通过apply进行改变的
getAge.apply(func,[]) //此时this指向对象func，getAge方法参数为空所以是[]
<script >
`use strict`;
function getAge() {
var now = new Date().getFullYear();
return now - this.birth;
}
var func = {
name:'计算年龄',
birth:1999,
//方法
age:getAge()
}
</script>
