JavaScript基础知识

news/2024/11/27 19:43:08/

一.计算机基础知识

1.编程语言

​ 机器语言: 0 1

​ 汇编语言: %##&&

​ 高级语言: Java python c c++ c# go php javascript,node andriod objective-c swift

注意点: html css 不是编程语言 标记语言

2.计算机组成

​ 硬件:显示器,… 硬盘 内存

​ 硬盘:可以永久存储数据

​ 内存: 数据计算空间(容器)

软件: 操作系统(windows macOS Linux andriod ios)-> 应用软件(qq,云音乐…)

存储单位: 1G = 1024M 1m= 1024K 1k= 1024B

二.javascript入门

1.概念

​ javascript是一门运行在’客户端‘,面向对象的 ,事件驱动的,单线程的 编程语言。

2.js的作用

  • 表单动态校验(密码强度检测) ( JS 产生最初的目的 )

  • 网页特效(webAPI)

  • 服务端开发(Node.js)

  • 桌面程序(Electron)

  • App(flutter)

  • 控制硬件-物联网(Ruff)

  • 游戏开发(cocos2d-js)

    网站开发:vue.js 微信小程序 react.js

3.js代码是怎么执行

浏览器内核分为两部分:渲染引擎 解析引擎

渲染引擎:解析html css

解析引擎: 解析javascript

4.js的组成

分为三部分:ECMAScript 与 DOM,BOM

1.ECMAScript(欧州机算机标准协会): 制定js的语法规范

2.DOM与BOM: 可以做浏览器上网页特效(webAPI)

了解一下原生javasript有哪些: js基础语法,webAPI, js高级,ajax

5.js代码的书写位置

1.行内式(一般不会写行内式的js,了解即可)

<div onclick="alert(123)">点我</div>     //当点击时触发点击事件

2.内嵌式

<script>这里写js代码
</script>

3.外联式

<script src='xxx.js'>不要在这里写js代码</script>

6.js中的注释

1.内行注释 ctrl + /

2.多行注释

7.js的常见的输入方式

alert(‘xxx’) 警式框

console.log(‘xxxx’) 控制台语句

prompt(‘请输入你的信息’) 输入框

confirm(‘你确定要删除码’) 确定选择框

三.js基础

编程的三要素:数据 流程控制 函数

“xiaosa” 18

1.数据

1.1变量

作用

是一个存放数据的空间 , 这个空间只能存放一个数据

变量的使用
// 变量分为两个部分:   变量名   变量值
// 1.声明变量名 var === variablevar age;
// 2.赋值age = 18;// 重点:一般连起来写var age = 18
变量的语法注意点
//1.变量是可以更新的
var myname = "jack"
myname = "rose"
console.log(myname)   //rose//2.一次可以声明多个变量
var myname='tom',age=4,gender="公";
console.log(myname,age,gender) //3.变量只声明不赋值 结果为undefined
var gender
console.log(gender)   //undefined//4.变量不声明直接打印会报错,除了name和一些特殊的名字
console.log(tel)   //报错 age is not defined
变量名的定义规范
规则
由字母(A-Za-z)、数字(0-9)、下划线(_)、美元符号( $ )组成,如:usrAge, num01, _name
严格区分大小写。var app; 和 var App; 是两个变量
不能 以数字开头。 18age 是错误的
不能 是关键字、保留字。例如:var、for、while
变量名必须有意义。 MMD BBD nl → age
重点案例练习:两个变量交换数据
// 两个变量相互交换数据var a = 10;var b = 100;var temp;temp = a;a = bb = temp;console.log(a,b); //  100   10

1.2 数据类型–重点

在javascript中数据分为两大类,8小类

1.基本数据类型(值类型): 数值型Number 字符串型String 布尔型Boolean 未定义型undefined 空型Null

2.复杂数据类型(引用类型): 对象型Object 数组Array(但是数组也是对象) 函数型 function(){}

变量的数据类型是由变量的值决定的,它是可变的

数值型Number
var a = 100
var b = 99.8;
var c = -10;

进制问题:二进制 八进制 十进制 十六进制

八进制 :数字以0开头

十六进制:数字以0x开头

最大值:Number.MAX_VALUE

最小值:Number.MIN_VALUE

无穷大:Infinity

无穷小:-Infinity

(重点)非数字:NaN (not a number) 不是一个数字 (当一个数据向数值类型转换时,转换不过去,就是NaN)

isNaN函数

//isNaN()   判断  是否 不是一个数字
console.log(isNaN(100))   //false
consolo.log(isNaN('jack'))   //true
字符串型String

概述:用单引号或双引号包裹起来的数据就是字符串类型,es6还可以用反引号``来包裹

var str = "我是一个字符串"
var str = '123'
var str = `abc`   //反引号可以写变量${变量名}
字符串嵌套
var str = '我是一个"字符串"'
var str = "我是一个\"字符串\""
转义字符:
转义符解释说明
\n换行符,n 是 newline 的意思
\ \斜杠 \
’ 单引号
"”双引号
\ttab 缩进
\b空格 ,b 是 blank 的意思
字符串的长度length (重点)
var str = "我是武汉传智播客的老师"
console.log(str.length)  //11
字符串的拼接 ”+“

口决:数值相加,字符相连

var str = "我是"+"老师"   //”我是老师"
var str = "pink" + 10    //"pink10"
//左右两边只要有一个字符串就是拼接
字符串拼接加强

建议大家用 反引号+${变量} 这种写法

var age = 18
var str = "我今年"+age+"岁"    //"我今年18岁"    不要用这种写法
var str = `我今年${age}岁`     //"我今年18岁"    用这种写法
布尔型Boolean

只有两个值 true false

var flag = true
var flag = false
未定义型undefined
var un = undefined    // 这个变量有值 但是不知道数据类型
空型Null
var nl = null         //这个变量的值是空的

数据类型检测 typeof 或 typeof()

console.log(typeof 10);   //number
console.log(typeof(10));  //numberconsole.log(typeof 'abc'); //string
console.log(typeof(abc));  //stringconsole.log(typeof true);  //boolean
console.log(typeof(false));//booleanconsole.log(typeof undefined)  //undefinedconsole.log(typeof null)  //object
字面量:

概念:从表面就可以看出这个数据是什么类型

8,  "string"   true   []    {}     function(){}

1.3数据类型之间的相互转换

a.基它类型转换为字符串型

1.toString()

var num=10
console.log(num.toString())    //'10'var flag = true
console.log(flag.toString())   //'true'

2.String()

var num=10
console.log(String(num))    //'10'var flag = true
console.log(String(flag))   //'true'

3.加上空字符串 + ‘’

var num=10
console.log(num+'')    //'10'var flag = true
console.log(flag+'')   //'true'
b.其它类型转换为数值型

parseInt (parse integer)

var str = "520肖战"
console.log(parseInt(str))   //520var str = "宋祖儿5201314"
console.log(parseInt(str))  //NaN

parseFloat(parse float)

var str = "520.1314肖战"
console.log(parseFloat(str))   //520.1314var str = "宋祖儿520.1314"
console.log(parseFloat(str))  //NaN

Number

var str = '100'
console.log(Number(str))   //100

隐式转换 - * /

console.log('123' - 0)   //123
console.log('123' * 1)   //123
console.log('123' / 1)   //123
c.其它类型转换为布尔型
Boolean()这个函数转换为布尔型,但是我们一般不用写,因为有隐式转换哪此值代表false呢?  
'',0,NaN,undefined,null   这些值在隐匿转换中都表示假false

1.4运算符

a.算术运算符

加+ 减- 乘* 除/ 取余% 自增 ++ 自减 –

//自增运算符  自身值加1    
// 注意点:变量++    var num=10    num++
var num=10
num++   //  11++num   //  11
//总结:前置自增与后置自增 单独是一行,没有区别,都是自身变量+1//1.前置自增:先自增,再返回,
++num//2.后置自增 : 先返回,再自增
num++
b.比较运算符

大于: >

小于:<

大于等于: >=

小于等于: <=

等于:== (值相等,数据类型有可能不一致)

console.log(10=='10')   //true

不等于: !=

全等于:=== (值相等,数据类型也要一致)

console.log(10==='10')   //false

不全等于: !== (只要是值不相等或类型不相等,结果为真true)

console.log(10 !== 11);    //true
console.log(10 !== '10');  //true
console.log(10 != '10');   //false
c.逻辑运算符

非:! 取反

console.log(!true)  //false
console.log(!false)  //true

与:&& 两边都为真,结果为真

或:|| 只要有一个为真,结果为真

重点:短路运算 逻辑中断

逻辑与中断    只要是碰到假,就会中断
consoloe.log(123 && 0 && 456)   //0
逻辑或中断    只是是碰到真,就会中断
consoloe.log(123 || 0 || 456)   //123案例:
var num = 10;
console.log(123&&''&&num++)  //''
console.log(num)  //10
d.赋值运算符

赋值:= += -= *= /= %=

  var a = 10;a += "10"    //a = a+"10"a++console.log(a);  // '1010'
e.三元运算符(三目运算符)

语法:

结果 = 条件表达式 ? 表达式1 : 表达式2

当条件表达式为真时,结果是表达式1的值。当条件表达式为假时,结果是表达式2的值

//案例: 求两个数的最大值
var a = 3
var b = 10
var res = a > b ? a : b//经典面试题:用一行代码实现求三个数的最大值var a = 100var b = 30var c = 10var res = a > b ? (a > c ? a : c) : (b > c ? b : c)

二.流程控制

数据+流程控制 = 算法

分类:顺序 分支 循环

1.顺序 不用学

2.分支:

2.1单分支
//语法
if(条件表达式  => boolean){...业务逻辑代码
}// 当单分支的业务逻辑代码只有一行时,{}可以省略//案例
var year = 3
if(year >= 1){console.log("有年终奖")
}
console.log("加油,好好干")
2.2双分支
//语法
if(条件表达式  => boolean){如果为真:...执行业务逻辑代码1
}else {如果为假:...执行业务逻辑代码2
}//案例:判断是否是闰年
//算法: 年份能被4整除但不能被100整除 或  年份能被400整除
var year  = prompt('请输入年份')
if(year%4==0 && year %100 !=0 || year % 400 ==0){console.log("闰年")
}else {console.log('平年')
}
2.3多分支
//语法
if(条件表达式  => boolean){如果为真:...执行业务逻辑代码1
}else if(条件表达式) {如果为假:...执行业务逻辑代码2
}else if(条件表达式){...
}...else {...
}
2.4switch case

语法:

​ switch(条件表达式){

​ case value1:

​ 表达式1;

​ break

​ case value2:

​ 表达式2;

​ break

​ …

​ default:

​ 表达式

​ break

}

注意事项:1.case后面的break不能丢,除了default外 2.条件表达式的值与case后的value必须 全等

//用switch case方式打印学生的成绩   大于90 优秀   大于80 良好  大于70 一般    大于60及格    小于60  不及格var score = prompt('请输入学生成绩');var data = parseInt(score / 10)   switch(data){case 10:console.log("棒棒哒");breakcase 9:console.log("优秀");breakcase 8:console.log("良好");breakcase 7:console.log("一般");breakcase 6:console.log("及格");break;default:console.log("不及格");}

总结:多分支一般用来处理 “范围” 的业务逻辑,switch case处理 “定值” 的业务逻辑

3.循环

作用:重复的执行代码

3.1 for 一般跟 计数 相关

语法:

for(初始化变量;条件表达式;操作表达式){

​ …循环业务代码

}

执行顺序:

​ 初始化->条件表达式->循环体->操作表达式

​ 条件表达式(真)->循环体->操作表达式

​ 条件表达式(假)->循环结束

//案例
for (var i = 1; i <= 3; i++) {console.log(i);  //1 2 3
}console.log(i);// 4   全局变量
//案例   求1~3的和
var sum = 0
for(var i = 1;i<=3;i++){sum = sum +i
}
console.log(sum)//求1~100之间所有数的平均值
var sum = 0;
var average = 0;
for(var i = 1; i<=100; i++){sum += i;
}
average = sum / 100;
console.log(average)//求1~100之间偶数与奇数的和
var even = 0;
var odd = 0;
for(var i = 1; i <= 100; i++){if(i % 2 == 0){even += i}else {odd += i}
}
console.log(`偶数和为${even}`)
console.log(`奇数和为${odd}`)//求1~100之间能被3整除的和
var res = 0;
for(var i = 1; i <= 100; i++){if(i % 3 == 0){res += i}
}
console.log(res)//循环字符串拼接
var str = '';
for(var i = 1; i <= 5; i++){str += '☆'
}
console.log(str)

双重for循环

语法:

​ for (外层的初始化变量; 外层的条件表达式; 外层的操作表达式) {

​ for (里层的初始化变量; 里层的条件表达式; 里层的操作表达式) {

​ // 执行语句;

​ }

​ }

//案例:
//打印五行五列的小星星
var str = ""
for(var i=1; i<=5; i++){   //行for(var j = 1; j<=5; j++){  //列str  = str + "☆"    }str +=  '\n'
}console.log(str);//打印10行的倒三角形
// 算法1:
var str = ""
for (var i = 1; i <= 10; i++) {for (var j = 1; j <= 10 - i + 1; j++) {str += "☆"}str += "\n"
}
console.log(str);
// 算法2:
var str = ""
for (var i = 10; i >= 1; i--) {for (var j = 1; j <= i; j++) {str += "☆"}str += "\n"
}
console.log(str);//打印 九九乘法表
var str =""
for (var i = 1; i <= 9; i++) {for (var j = 1; j <= i; j++){str += `${j}×${i}=${j*i}\t`}str += '\n' 
}
console.log(str);
3.2 while

语法:

while(条件表达式){

​ 循环体

}

注意点:在循环体中要有修改条件表达式的操作,否则就可以成为死循环了

//案例 求1~100所有整数的和
var sum = 0
var j=1;
while(j <= 100){sum += jj++
}
console.log(sum)//案例:弹出一个提示框,你爱我吗?如果输入我爱你,就提示结束,否则一直弹
var message = prompt('你爱我吗')
while( message !== '我爱你' ){message = prompt('你爱我吗')
}
alert("我也爱你")
3.3 do…while

语法:

do {

​ 循环体

} while(条件表达式)

注意点:在循环体中要有修改条件表达式的操作,否则就可以成为死循环了。do至少会执行一次

//案例 
do {var message = prompt('你爱我吗')
} while( message !== '我爱你')
alert('我也爱你')
3.4.循环中的两个关键词 break 与continue

break: 中断所有循环

continue:中断本次循环,跳到下一个循环

//案例:吃包子出现虫子
for (var i = 1; i <= 5; i++) {if (i == 2) {   // 第二个出现虫子,扔掉第二个,接着吃continue;   }if (i == 4) {   // 第四个出现虫子,扔掉,不再吃包子了break;}console.log(`我正在吃第${i}个包子`);
}

循环ATM机作业题

var money = 100;
do {var operation = prompt("请输入您要的操作\n 1.存钱 \n 2.取钱 \n 3.显示余额 \n 4.退出");if (operation === '1') {var m = prompt("请输入你要存的钱数")money += parseInt(m)alert('你的余额为:' + money)} else if (operation === '2') {var m = prompt("请输入你要取的钱数")money -= parseInt(m)alert('你的余额为:' + money)} else if (operation === '3') {alert('你的余额为:' + money)} else if (operation === '4') {var flag = confirm('你确定要退出吗')if(!flag){operation = null}} else {alert('请输入正确的操作数字')}
} while (operation !== '4')

三.数组

1.概念

数据的有序集合,可以用来存储多个数据

2.创建的两种方式

1.构造函数方式:var arr = new Array()

var arr = new Array();  //创建了一个空的数组
console.log(arr);      // []

2.字面量

var arr = [1,'string',true,undefined,null,[],{},function(){}]
//数组中的成员(元素)可以是任意的数据类型

数组的索引(下标):从 0 开始

数组的的元素的访问

var arr = ['胖虎','静香','大雄'] 
console.log(arr[2])   //'大雄'
3.数组长度

​ arr.length

4.遍历
var arr = ['胖虎','静香','大雄']
for(var i=0; i< arr.length; i++){console.log(arr[i])
}// 扩展
arr.forEach(function(value,index){console.log(value,index);
})
5.案例
//1.求数组中的最大值
var arr = [1,2,3,9,5,7]
var max = arr[0];
for(var i=1; i<arr.length; i++){if(arr[i] > max){max = arr[i]}
}
console.log(max)//数组中存放10个整数(1~10)
var arr = []
for(var i = 1; i <= 10; i++){arr[i-1] = i
}
console.log(arr)//数组筛选 将大于5的值筛选出来
//方案1var arr = [1,2,5,3,4,6,9] var newArr = []var j = 0 //j的作用相当于一个计数器for(var i = 0; i<arr.length; i++){if(arr[i] >= 5){newArr[j] = arr[i]j++}}console.log(newArr)//方案2var arr = [1,2,5,3,4,6,9] var newArr = []//利用了newArr.length的长度是动态的特性for(var i = 0; i<arr.length; i++){if(arr[i] >= 5){newArr[newArr.length] = arr[i]}}console.log(newArr)// 求数组中出现次数最多的元素及它的次数
var arr = [1,2,3,'a',"b",2,"c","a","d","a"]//数组的反转
//方案1
var arr = ['胖虎','静香','大雄','小夫'] 
var newArr = [];
for (var i = 0; i < arr.length; i++) {newArr[arr.length - i - 1] = arr[i]
}
console.log(newArr);//方案2
var arr = ['胖虎','静香','大雄','小夫'] 
var newArr = [];
for (var i = arr.length - 1; i >= 0; i--) {newArr[newArr.length] = arr[i]
}
console.log(newArr);//数组的冒泡排序从小到大
var arr = [9, 2, 17, 8, 5, 3]   // =>[2,3,5,8,9,17]for (var j = 0; j < arr.length - 1; j++) {   //外层控制是趟数 行for (var i = 0; i < arr.length - 1-j; i++) {if (arr[i] > arr[i + 1]) {var temp = arr[i]arr[i] = arr[i + 1]arr[i + 1] = temp}}
}

四.函数

1.概念

将相同的业务逻辑封装起来,重复使用

2.语法

从现实中理解函数的使用:函数声明相当于是 ’做榨汁机‘,函数调用相当于是 ’使用榨法机‘。

分为两部分: 函数的声明 函数的调用

函数声明:

function 函数名 ([形参列表]) {

​ 函数体

​ [return 返回值]

}

函数调用

​ 函数名 ([实参列表])

//案例
function getSum(){   //函数声明var sum = 0for(var i=1; i<=100; i++){sum += i}console.log(sum)
}
getSum()   //函数调用
3.形参与实参
function getSum(a,b){   //a,b是形参console.log(a+b)
}
getSum(1,2)   // 1,2是实参//形参与实参的个数不匹配的情况
function getSum(a,b){console.log(a+b)
}getSum(1,2)    //形参与实参个数一至
getSum(1,2,3)  //把3传给函数,但是在函数中没有形参来接收,就不接收
getSum(4)      //相当于b接收是undefined
4.返回值

函数可以有返回值,也可以没有返回值,根据业务逻辑

function foo(name){return name+",大傻逼"   // return 返回值
}
var res = foo("傻逼")
console.log(res)

注意事项:

1.return 可以终止函数的执行,return后面可以不跟 数据

2.如果函数没有return 默认返回就是undefined

5.函数小案例
//利用函数求两个数的最大值
function getMax(a, b) {// if(a>b){//     return a;// }else {//     return b// }return a > b ? a : b;}var res = getMax(4, 6)
console.log(res);//利用函数求三个数的最大值
function getMax(a, b, c) {// if(a>b){//     //a大于b  //     if(a>c){//         return a//     }else {//         return c//     }// }else {//     //b大于a//     if(b>c){//         return b//     }else {//         return c//     }// }return a > b ? (a > c ? a : c) : (b > c ? b : c)}
var res = getMax(19, 10, 3)
console.log(res);
6.arguments的使用

1.在任意函数内部都有一个看不见的arguments,除了箭头函数外

2.arguments是一个长的像数组的伪数组,可以对它进行遍历

3.函数调用的实参变成了arguments的元素

function getSum(){var sum = 0// arguments = [[1,2,3]]   [[2,3,9,4,5]]for(var i = 0; i< arguments.length; i++){sum += arguments[i]}return sum
}
var res1 = getSum(1,2,3)
console.log(res1);  //6
var res2 = getSum(2,3,9,4,5)
console.log(res2);  //23
7.函数声明的两种形式

a.声明式

function fn(){console.log("我是声明式的函数")
}
fn()

b.表达式式(匿名式) 函数也是一种数据类型

var fn = function(){console.log("我是表达式式的函数")
}
fn()
8.作用域

概念:代码(变量)起作用效果的区间范围

分类:全局作用域 局部作用域

重点:es6之前只有函数的{}才有限定作用域

<script>var a = 10;     //全局function fn(){var b = 20  //局部}if(true){var c = 30   //全局}while(true){var d = 40   //全局的}
</script>
9.全局变量与局部变量

全局变量:变量声明在全局作用域下

局部变量:变量声明在函数内部

注意点:在函数内部变量没有声明,直接赋值,就是全局变量(这句话在一定的条件下有问题)

10.变量的生命周期

变量的生命周期指的是变量从什么时候开始创建,么时候销毁。

全局变量的生命周期:

​ 生:代码开始运行

​ 死:关闭浏览器当前的窗口

局部变量的生命周期:

​ 生:函数开始调用时

​ 死:调用函数完毕时 (将来学习闭包时这句话又要注意)

11.作用域链

函数内部是可以套函数的,因此函数内部形成了作用域链

重点:函数内部的变量如果没有找到,就向上一层查找,上一层出没有,再向上一层查找,因为形成了一条查找的链条。

做题时的原则:就近原则

function fn1(){      //   0级链    有函数 fn1var a = 1function fn2(){  //   1级链    有a=1 与函数 fn2var b = 2function fn3(){   //2级链       有b=2  与函数 fn3var c = 3console.log(c)   //3级链    有c = 3}fn3()}fn2()
}fn1()

五.对象

1.概念

现实生活:对象就是东西,是一个具体的事物。万物皆对象

程序角度: 对象是一组无序的数据的集合。包含属性方法

2.对象的创建

方式1:字面量

var person = {name:"jack",age:18,sex:'男',showFilm:function(){console.log("I can showFilm");},liaoMei:function(){return "I can liaoMei"}
}//属性输入打印
console.log(person.name); //jack
//关联数组的写法
console.log(person['age']); //18
//如果属性不加引号就是变量名
var gender = 'sex'
console.log(person[gender]);  //男//方法调用
person.showFilm()
//方法调用关联数组写法
var res = person['liaoMei']()
console.log(res)

方式2: new Object()

var obj = new Object()   //相当于创建了一个空的对象   var obj = {}//对象的动态特性
obj.name = "项**";
obj.age = 21;
obj.type = "女海王"
obj.dance = function(){console.log("I can dance")
}// 属性输入
console.log(obj.name)
console.log(obj['type'])
// 方法调用
obj.dance()
obj['dance']()

方式3: 构造函数

以上的两种方式都只能创建一个对象,如何多次创建对象呢?批量的生产对象

工厂函数:

function person(name,age,gender){var obj = {};obj.name = name;obj.age = age;obj.gender = gender;return obj   
}var p1 = person('jack',18,"男")
console.log(p1);
var p2 = person('rose',21,"女")
console.log(p2);

构造函数:

function Mario(name,color,height){   //模板  模具   类classthis.name = namethis.color = colorthis.height = heightthis.smallJump = function(){console.log("smallJupm");}this.bigJump = function(){console.log("bigJupm");}this.attack = function(){console.log("attack");}}var m1 = new Mario("redMario",'red',"100cm")   // new构造函数的过程也叫   实例化
console.log(m1);
var m2 = new Mario("greenMario",'green',"100cm")
console.log(m2);//m1,m2可以称为实例

构造函数的注意事项:

1.构造函数的函数首字母一般建议大写

2.构造函数的返回值如果没有写return 默认返回this

3.构造函数调用时前面要用关键词 new

new关键词执行的过程

1.在内存中开辟了一个空间

2.this变量指向了这个空间

3.进入函数体执行代码

4.有一个看不见的return this

3.对象的遍历 for…in
var obj = {name: "jack",age: 18,gender: "male",fn:function(){}
}for(var k in obj){console.log(k)console.log(obj[k])console.log(k,obj[key]);
}

六.内置对象

学习内置对象: Math 数学 Date 日期 String字符串 Array 数组

怎么学:多写,多记方法名,后期多练

Math 数学

属性:Math.PI

方法:

//1.最大值
Math.max(1,2,4,9)  //9//Math.max() 不能求数组的最大值
Math.max([3,65,76,2,9])   //NaN
//求数组的最大值解决方案,后期学
Math.max.apply(null,[3,65,76,2,9])   //76
Math.max(...[3,65,76,2,9])  //76//2.求绝对值
Math.abs(-1)    //1
Math.abs(1)     //1
//3.向下取整
Math.floor(1.3) //1
Math.floor(1.9) //1
//4.向上取整
Math.ceil(1.2)  //2
Math.ceil(1.9)  //2
//5.四舍五入
Math.round(1.1)  //1
Math.round(1.8)  //2
Math.round(-1.1) //1
Math.round(-1.5) //1   负数时,  .5往大了取整//6.取随机数  [0,1)   从0到1,包括0,不包括1
Math.random()
//获取两个数之间的整数,包括两个整数的算法
Math.floor(Math.random() * (max - min + 1)) + min; //含最大值,含最小值 
Date 日期
var date = new Date()  //获取当天时间对象
var date = new Date('2021-4-17')   //取参数时间对象
//date不好用date.getFullYear()  //年
date.getMonth()+1   //月份    注意date.getMonth()要加1才能得到正确的月份
date.getDate()      //日期
date.getDay()       //星期几   注意date.getDay()得到的值是[0-6]  星期日是0date.getHours()     //时
date.getMinutes()   //分
date.getSeconds()   //秒

时间戳:

解释:从1970年1月1日 到 一个时间点 经过了多少毫秒

//方式1:valueOf  getTime
var date = new Date()    //从1970年1月1日 到 现在 经过了多少毫秒
cosole.log(date.valueOf())
console.log(date.getTime())//方式2: +new Date
var date = +new Date('2000-01-01') //从1970年1月1日 到 '2000-01-01' 经过了多少毫秒
console.log(date)//方式3: Date.now()   //从1970年1月1日 到 现在 经过了多少毫秒
var date = Date.now()
console.log(date)//案例:计算从你出生到现在活了多少天?
var nowTime = Date.now()
var birthTime = +new Date('2001-3-20')var time = Math.ceil((nowTime-birthTime)/1000/60/60/24)
console.log(time);//案例:倒计时效果
function countDown(time) {var nowTime = +new Date(); // 返回的是当前时间总的毫秒数var inputTime = +new Date(time); // 返回的是用户输入未来时间的总毫秒数var times = (inputTime - nowTime) / 1000; // times是剩余时间总的秒数 var d = parseInt(times / 60 / 60 / 24); // 天var h = parseInt(times / 60 / 60 % 24); //时var m = parseInt(times / 60 % 60); // 分var s = parseInt(times % 60); // 当前的秒return d + '天' + h + '时' + m + '分' + s + '秒';
}
Array数组

1.数组类型检测

var arr = [1,2,3]
console.log(typeof arr);  //object//arr 是否是 Array的实例
var arr = new Array()
console.log(arr instanceof Array);  //true
console.log(Array.isArray(arr));  //true

2.数组元素的添加与删除

//push  在数组的后面添加元素
1.修改了原数组
2.参数:追加的元素
2.返回值:是追加后数组的长度
var arr= [1,2,3]
arr.push(4,5)    //返回值是5   原数组变成了[1,2,3,4,5]
arr.push([4,5])  //返回值是4   原数组变成了[1,2,3,[4,5]]//unshift  在数组的前面追加元素
1.修改了原数组
2.参数:追加的元素
2.返回值:是追加后数组的长度
var arr= [1,2,3]
arr.unshift(4,5)   //返回值是5   原数组变成了[4,5,1,2,3]//pop  删除数组的最后一个元素
1.修改了原数组
2.参数:无
2.返回值:删除的那个元素
var arr= [1,2,3]
arr.pop()   //返回值是3   原数组变成了[1,2]//shift 删除数组的第一个元素
1.修改了原数组
2.参数:无
2.返回值:删除的那个元素
var arr= [1,2,3]
arr.shift()   //返回值是1   原数组变成了[2,3]

3.数组的反转

//数组.reverse()  反转数组var arr = [1,2,3,4]
arr.reverse()
console.log(arr)   //[4,3,2,1]

4.数组的排序

//数组.sort()     数组排序
var arr = [4,2,8,12,9]arr.sort(function(a,b){return a - b    //数组升序
})
console.log(arr)   //[2,4,8,9,12]arr.sort(function(a,b){return a -b    //数组降序
})
console.log(arr)   //[12,9,8,4,2]

5.数组的索引

//根据元素找下标   indexOf()    lastIndexOf()  
//indexOf()   从数组的左边向右边找,找到一个就马上返回下标   没有找到返回-1
//lastIndexOf()   从数组的右边向左边找,找到一个就马上返回下标   没有找到返回-1var arr = [1,2,3,4,5,3]
console.log(arr.indexOf(3))      //2
console.log(arr.indexOf(8))      //-1console.log(arr.lastIndexOf(3))  //5
console.log(arr.indexOf(7))      //-1//案例 数组去重
//方案1
var arr = [1,2,3,'a',"b",2,"c","a"]
var newArr = []
for(var i=0; i<arr.length; i++){if(newArr.indexOf(arr[i])===-1){newArr.push(arr[i])}
}
console.log(newArr)//方案2   暂时了解   可以关注数组的includes方法
var arr = [1,2,3,'a',"b",2,"c","a"]
var newArr = []
for(var i=0; i<arr.length; i++){if(!newArr.includes(arr[i])){newArr.push(arr[i])}
}
console.log(newArr)//方案3  暂时了解   可以关注数组的reduce方法
var arr = [1,2,3,'a',"b",2,"c","a"]
var newArr = arr.reduce(function(acc,value,index){if(!acc.includes(value)){acc.push(value)}return acc
},[])
console.log(newArr)

6.数组转换为字符串

//数组.join()
var arr =[1,2,3]
var str = arr.join()
console.log(str)   //1,2,3var str = arr.join("&")
console.log(str)   //1&2&3

7.数组合并

//数组.concat()
var arr = [1,2,3];
var newArr = arr.concat([4,5,6]);
console.log(arr);    //没有修改原数组
console.log(newArr); //[1,2,3,4,5,6]

8.数组的截取

//数组.slice(start,end)   
var arr = ['red','blue','yellow','pink','purple'];
var newArr = arr.slice(1,3);
console.log(newArr);     //['blue','yellow']
console.log(arr);        //没有修改原数组//数组.splice(start,count)
var arr = ['red','blue','yellow','pink','purple'];
var newArr = arr.splice(1,3);
console.log(newArr);     //['blue','yellow','pink']
console.log(arr);        //原数组修改了,截取后剩下的元素//面试题
var arr = ["小泷",'小天',"小苍","小泽","xiaosa"];  //=> [["小泷",'小天',"小苍"],["小泽","xiaosa"]]
var newArr = []
while (true) {if (arr.length === 0) {break}newArr.push(arr.splice(0, 3))
}console.log(newArr);
String字符串

1.根据字符找索引

//str.indexOf()  从左向右根据字符找索引,如果没有找到就返回-1
//str.lastIndexOf()  从右向左根据字符找索引,如果没有找到就返回-1

2.根据索引找字符

//str.charAt(索引)//求字符串'abcaba'出现次数最多的字符及次数
// 'abcaba' => (a 3)
// 第一步:'abcaba' => {a:3,b:2,c:1}
// 第二步:{a:3,b:2,c:1} => a 3
var str = "abcaba"
var obj = {}
for (var i = 0; i < str.length; i++) {if (str.charAt(i) in obj) {obj[str.charAt(i)]++     //obj.a++   num++} else {obj[str.charAt(i)] = 1   //{a:1,b:1,c:1}}
}
// console.log(obj);
var char = null
var max = 0for (var k in obj) {   //{a:3,b:2,c:1}if (obj[k] > max) {max = obj[k]char = k;}
}console.log(`出现次数最多的字符是${char},次数是${max}`);

3.截取

// 字符串.substr(start,length)  
var str = "傻逼,你在哪里?"
var str1 = str.substr(0,2)
console.log(str1);  //傻子//字符串.substring(start,end)
var str = "傻逼,你在哪里?"
var str2 = str.substring(0,3)
console.log(str2);  //傻子,

4.替换

//字符串.replace(原字符,要替换的字符)var str = "我爱武汉傻子和傻子们";
var str1 = str.replace("傻子","小可爱")
var str2 = str.replace(/傻子/g,"小可爱")   //正则表达式可以实现全部替换
console.log(str1);   //我爱武汉小可爱和小太妹们
console.log(str2);   //我爱武汉小可爱和小可爱们

5.分割

// 字符串.split(要分割的字符)
var str = "小苍×刘虎×小泽"
var arr = str.split("×")
console.log(arr);   //["小苍", "刘虎", "小泽"]

6.大小写转换

//字符串.toUpperCase()
var str = "Hello World"
var upper = str.toUpperCase()
console.log(upper); //HELLO WORLD//字符串.toUpperCase()
var str = "Hello World"
var lower = str.toLowerCase()
console.log(lower); //hello world

七.数据类型为什么分为值类型和引用类型

值类型:变量中存的是值本身

引用类型:变量中存的是地址

//练习
console.log(123===123) //true
console.log({}==={})   //false
console.log([]===[])   //false
console.log(function(){} ===function(){})  //false//基本数据类型赋值操作  传的值 
//修改了其中的一个,另一个不变
var a = 100
var b = a
a=1000;
console.log(b)  // 100//复杂数据类型赋值操作  传的地址
//修改了其中的一个,另一个也会变
var arr1 = [1,2,3]
var arr2 = arr1
arr1[1]=20;
console.log(b)  //[1,20,3]//案例
var c;	
var changStuff = function (a,b,c){a = a*10;b.item = "changed";c = {item:"changed"};                     
}
var num = 10;
var obj1 = {item:"unchanged"};
var obj2 = {item:"unchanged"};changStuff(num,obj1,obj2);
console.log(num);         //10           
console.log(obj1.item);   //changed            
console.log(obj2.item);   //unchanged      
console.log(c);           //undefined

八.预解析

预解析:代码执行分为两个步骤:预解析阶段 和 执行阶段

预解析相当于是对代码的扫描

关注两个关键词: var 与 function (这个function不是匿名函数的function,而是声明式的function)

1.var 变量名

​ 判断当前内存作用域中是否存在变量

​ a.如果不存在,在内存中开辟空间 变量名指向该空间,这个空间此时的值是undefined

​ b.如果存在,忽略,不再在内存中开辟空间了。

2.function 函数名

​ 判断当前内存作用域中是否存在函数名

​ a.如果不存在,在内存中开辟空间 函数名指向该空间,并且这个空间保存的是函数体的地址

​ b.如果存在,在内存中不开辟空间 但是这个空间也会指向函数体的地址

3.函数调用时,进入函数体内也会在函数内作用域进行预解析


http://www.ppmy.cn/news/141202.html

相关文章

【三国演义】

董卓乱权 天下大事&#xff0c;分久必合。秋之境&#xff0c;五八称雄。战国之时&#xff0c;七雄并立&#xff0c;江山如此多娇&#xff0c;以无数英雄竞折腰。多汉末年&#xff0c;宦官动权&#xff0c;汉室衰败&#xff0c;群雄隔绝&#xff0c;民不聊生&#xff0c;苍天已…

Python数据分析通关,30个案例!

我们团队每周开会讨论问题的时候&#xff0c;都会对每天的增长数据进行复盘。期间&#xff0c;领导常常会提及「数据思维」这个词。 这就涉及到&#xff0c;你必须要有思维能力&#xff0c;去支撑你在看到数据时&#xff0c;会从多维度去分析&#xff0c;而不是只看到表面数字这…

网名大字典。

网名大字典。 #include <stdio.h> #include <string.h> #include<time.h> #include<stdlib.h> #include<windows.h> char str[25234][14]{ "鸢卿漓殇", "心如蝶舞", "人醒梦亦碎", "拂晓晨曦", "携…

台式机与笔记本辐射谁大

台式机之所以背面辐射大是因为正面有金属档板等等厂商设置的防护措施&#xff0c;但是背面却没有&#xff1b;笔记本电脑不同&#xff0c;笔记本电脑辐射最大的地方在键盘上方&#xff0c;因此&#xff0c;合上盖子之后&#xff0c;相对而言辐射反而小些。 下面给你个全的&…

HHUOJ 1040

1040: 一起喝果汁 时间限制: 1 Sec 内存限制: 128 MB提交: 69 解决: 28[提交][状态][讨论版][命题人:admin] 题目描述 kyoma和mirror都十分的爱喝果汁&#xff0c;于是她们在网上新买了一个榨汁机准备榨果汁喝。可是这个榨汁机的容量D十分有限&#xff0c;一次只能放进一个橙…

SQL基础培训25-SQL开发思路畅谈与开发规范

前言 在写每一篇进度前,我都会查找很多篇有价值的技术帖子,进行参考总结。这一篇进度的编写,纯粹是我自己的思考和经验总结。 1.开发思维辩证 1.1.学与用的辨证关系 很多新手,包括在校大学生,也包括以前读书时代的我,觉得开发这门技术入门很难!由此,走了很多弯路以后…

从总经理喝咖啡想到的一些事情,闲体制与个体

昨天总经理去中关村喝咖啡了&#xff0c;大意是鼓励创业&#xff0c;我觉得这个很好&#xff0c;无聊闲谈一下我发散想到的一些事情。 咖啡是利率控制者送给利率奴隶的迷药&#xff0c;本质是压榨剩余劳动力的的毒药&#xff0c;被冠以文化、艺术、美食的外表&#xff0c;迷惑打…

谈谈创业这点事(10)

背景文章 谈谈创业这点事(8) 谈谈创业这点事(9) 套利&#xff0c;最“容易”的赚钱创业手段 昨天说到了单点启动&#xff0c;单边启动&#xff0c;双边启动&#xff0c;多边启动&#xff0c;其实还漏了一个&#xff0c;所谓零点启动&#xff0c;也就是不需要任何用户&#xff0…