编程语言
- 类似人类的语言,用它来进行控制计算机,让计算机为我们做事.
- 编程语言是用来控制计算机的一系列指令,它有固定的格式和词汇(不同的汇编语言的格式和词汇不一样),必须遵守.
- 有很强的逻辑和行为能力
- 编程语言总体上分为机器语言,汇编语言和高级语言三大类
- 汇编语言和机器语言实质相同,都是对硬件操作,指令采用了英文缩写的识别符,容易辨别和记忆
- 高级语言主要是相对于低级语言而言,并不特指某一特种语言,包括了很多编程语言,常用的有c语言,c++,java,javascript等.
- 高级语言需要一个翻译器转换为计算机识别的机器语言
- 计算机语言:计算机最终执行的是机器语言,由0和1组成的二进制数,二进制是计算机语言的基础
javaScript
- 运行在客户端的脚本语言(script是脚本的意思)
- 脚本语言不需要编译,运行过程中由js解释器(js引擎)逐行来进行解释并执行
- 实现业务逻辑和页面控制
浏览器执行js
- 浏览器分为渲染引擎和js引擎
- 渲染引擎:用来解析html和css,俗称内核.
- js引擎:也称为js解释器,用来读取js代码,对其处理后运行.
js三部分组成
- ECMAScript(javeScript语法)
- 由ECMA国际进行标准化的一门编程语言,被称为JavaScript和JScript,但实际上后两者是ECMAScript语言的实现和扩展
- DOM页面文档对象模型
- 对页面的各种元素进行操作
- BOM浏览器对象模型
- 对浏览器的窗口进行操作
js三种书写位置
- 行内式
- 可以将单行或少量js写在标签中
- 可读性差,引号多层嵌套时易错,容易混乱
- 内嵌式
- 可以将多行js代码写到script标签中
- 学习时常用的方法
- 外链式
- 引用外部js文件的script标签中间不可以写代码
- 适合js代码量比较大的情况
变量
- 保存数据的容器,可以通过变量名获取数据,数据可以修改.
- 变量是程序在内存中申请的一块用来存放数据的空间
变量的使用
- 声明一个变量 var age;
- var是一个js关键字,用来声明变量.使用该关键字声明变量后,计算机会自动为变量分配内存空间.
- age是自己给这个变量取的名字.
- 赋值 age = 10; 把自定义的一个值存入这个变量中
- var age = 10; 变量+赋值一起写称为变量的初始化.
- console.log(age) 在浏览器控制台打印输出这个变量的值
- 更新变量:变量被重新赋值后,她原有的值会被覆盖,以最后一次赋的值为准,类似css层叠性.
- 同时声明多个变量:只需要写一个var,多个变量名之间用英语逗号隔开.
- var age = 18, myname= ‘卡卡西’ , address = ‘火影村’ ;
变量的命名
-
由字母,数字,下划线,美元符号组成.
-
严格区别大小写
-
不能以数字开头
-
不能以关键字和保留字命名
- name在某些网站有特殊的含义,尽量不要用来命名.
-
变量名必须有意义(使用英文单词)
-
两个单词之间不能有空格,并遵守驼峰命名法
js输入输出语句
- prompt(info) 浏览器弹出的输入框,用户可以输入
- alert(msg) 浏览器弹出警示框 输出的
- console.log(msg) 浏览器内控制台打印输出显示的信息
- 要一次输出多个变量,可以用逗号隔开
- console.warn(‘控制台显示警告提示’);
- console.error(‘控制台显示可能出现错误的代码提示’) ;
- 检测字符串的长度
- console.log(str.length) str为要检测长度的变量名
- 检测数据类型
- typeof(num); num为要要检测数据类型的变量名
- confirm(‘提示内容’) 浏览器弹出确认取消框 返回一个布尔值
Js的数据类型
- 数据类型: 根据数据不同的类型存放在不同的地方,可以更好的利用空间.
- js的变量数据类型是只有程序在运行时,根据等号右边的值来确定的.
- js是动态语言,变量的数据类型是可以变化的
基本包装类型
- 基本包装类型就是把简单数据类型自动包装成了复杂数据类型.
- 基本包装类型 String Number 和Boolean
- 生成临时变量,将简单类型包装成了复杂类型
- 赋值给我们声明的字符变量
- 销毁临时变量.
简单数据类型
- 简单数据类型又称值类型
- 在存储时变量中存储的是值本身,因此叫做值类型
- 简单数据类型有:String,Number,Boolean,underfined,null
- 简单数据类型在函数里传递参数的时候,传递的是值本身
- typeof检测null 返回的是objeat 空的对象.
- 如果某个变量打算存储为对象,暂时还不知道放啥的话,可以给null
-
number 数字型 (包含整数和小数 默认值0)
- 八进制 数字前面加0表示八进制 0~7
- 十六进制 数字前面加0x 表示十六进制 0~9 a~f
- Infinity 无穷大 -Infinity 无穷小 NaN 非数字
- console.log(isNaN(12)); 可以检测一个值是不是数字类型
-
String 字符串类型
- 用单引号和双引号包裹起来的就是字符串型,js中推荐使用单引号 (html,css中推荐始终双引号)
- 字符串嵌套 外单内双或者外双内单
- 字符串转义符 (以\开头) 必须写在字符串里面
- \n 换行 \r\n 兼容windows和linux
- \\ 斜杠\
- \b空格
- \t tab 缩进
- 字符串拼接
- 字符串+任何类型的数据类型 都会变成字符串类型的
- 用单引号和双引号包裹起来的就是字符串型,js中推荐使用单引号 (html,css中推荐始终双引号)
-
Boolean 布尔值类型 默认false
- true(真的/对) 参与加法运算 等价于1
- fales(假的/错) 参与加法运算 等价于0
-
undefined 未定义数据类型
- 和数字相加 结果是NaN
-
null 空值
- 可以和数值相加
-
isNaN(12) 判断非数字
- 如果是数字返回fales 如果不是数字返回ture.
-
字符类型的转换
- console.log(typeof str) 检测一个变量是什么数据类型 str为变量名 用空格隔开
-
转换为字符串类型
-
转换为字符串类型
- num.toString() num为要转换字符串的变量名
- String(变量) 强制转换
- 变量+’’ 加号拼接字符串(隐式转换)
-
转换为数字类型
- parseInt(变量) 取整(不适用四舍五入,会去掉单位,但是必须以数字开头)
- parseFloat(变量) 保留小数(不适用四舍五入 会去掉单位,但是必须以数字开头)
- Number(变量) 强制转换为数字型 有不能识别的内容 不能转化
- ‘12’ - 0 隐式转换 利用算术运算隐式转换为数字型
- 加法不能隐式转换,只有- * / 可以
-
转换为布尔型
- Boolean(变量)函数
- 代表空和否定的值会被转换为false, 如" , 0 , NaN , null , undefined
- Boolean(变量)函数
-
字面量
字面量是在源代码中一个固定值的表示法，通俗来说，就是字面量表示如何表达这个值。
简单来说就一眼看过去就知道这个数据是什么类型的字面量
- 数字字面量：8, 9, 10
- 字符串字面量：‘黑马程序员’, “大前端”
- 布尔字面量：true，false
-
复杂数据类型
- 复杂数据类型又叫引用类型
- 引用类型:复杂数据类型,在存储时变量中存储的仅仅是地址(引用) 其数据是放在堆中的
- 通过new关键字创建的对象(系统对象,自定义对象)如Object,Array,Date
- 值相同的两个变量 对比 地址是不同的 只要一个变量的数据进行了修改 另一个也会跟着变化
- 复杂数据类型在函数里传递参数的时候,传递的是地址
堆和栈
- 简单数据类型存放到栈里面, 栈里面开辟一个空间, 将值存在里面.
- 复杂数据类型存放到堆里面,首先在栈里面存放一个地址,然后这个地址指向堆里面存放的数据
- 复杂数据类型 传递参数时,传递的是地址
运算符
(先乘除后加减,有小括号先算小括号里的)
-
加(+)
-
减(-)
-
乘(*) 次方(**)
- 2**3=8 (2的三次方等于8)
-
除(/)
-
取余(%)
- 左边的数除以右边的数 能整除为0 不能整除 会除以最大能除的数 剩下的数为取余结果
- 5%3=2，5%2=1, 5%4=1
- 0是false,所以能整除为0 反而是false;
-
浮点数(小数)进行算术计算时精确度远远不如整数,尽量避免用浮点数计算
- 0.1 + 0.2 结果不是0.3 而是:0.300000000000004
- 0.07 * 100 结果不是7 而是:7.00000000000001
-
同理,不能拿浮点数来进行比较 是否相等
-
表达式和返回值
-
表达式:由数字,运算符,变量等组成的式子 称为表达式
-
返回值:表达式计算后,返回的结果 称为返回值
-
递增递减运算符
-
必须和变量配合使用
-
前置运算符:++nub --nub 后置运算符: nub++ nub-- 让变量的值+1或者-1.
-
前置递增和后置递增单独使用时,运行效果相同.
-
前置:先自加,后运算
-
后置:先返回原值,后自加.
- var num = 2; num++ +1=2 console.log(num) num =2
-
var nub= 10; nub++; 运算之后,nub++=10; nub=11;
-
比较运算符 (比较的结果返回一个布尔值对或错)
-
小于号 <
-
大于号 >
-
大于等于号 >=
-
小于等于号 <=
-
判等号(会转型) ==
- 只要值一样就会判对, 并且会转换为数字类型
-
不等号 !=
-
全等号或者全不等 === !==
- 全等要求数值和数据类型完全一样才可以
-
逻辑运算符
-
&& 逻辑与 简称与 and
- 逻辑与两边的比较 只要有一个是fales 结果就是fales
-
|| 逻辑或 简称或 or
- 逻辑或两边的比较 只要有一个是true 结果就是true
-
! 逻辑非,简称非 not
- !true 返回值为fales 也叫作取反符
-
逻辑与短路运算(逻辑中断)
- 当有多个表达式(值)时,左边的表达式值可以确定结果时,就不再继续运算
- 语法: 表达式1 && 表达式2
- 如果第一个表达式的值为true, 则返回表达式2
- 如果第一个表达式的值为假,则返回表达式1 右边的不用运算了
-
逻辑或短路运算(逻辑中断)
- 和逻辑与相反
- 语法: 表达式1 || 表达式2
- 如果第一个表达式的值为true, 则返回表达式1,中断后面的运算.
-
如果第一个表达式的值为假,则返回表达式2
-
赋值运算符
-
= 直接赋值 var age =10; //10
-
+= -= 左边加减一个右边的值 var age= 10; age+=5; //15
-
*= /= %= 乘 除 取模 右边的值 var age=10; age/=5; //2
-
运算符优先级
- 小括号 ()
- 一元运算符 ++ – !(逻辑非)
- 算术运算符 先* / 后+ -
- 关系运算符 > >= < <=
- 相等运算符 == != === !==
- 逻辑运算符 先&& 后|| 先与后或
- 赋值运算符 =
- 逗号运算符 ,
流程控制
流程控制就是来控制我们的代码按照什么结构顺序来执行
顺序流程控制
- 最基本的流程控制,没有特定的语法结构, 程序会按照代码的先后顺序依次执行,大多数代码都是这样执行的.
分支流程控制 if switch
if语句
- 根据不同的条件,执行不同的路径代码,会产生不同的结果.
- if(条件表达式) { 条件成立所执行的代码 ;}
- if里面的条件表达式结果为true 则执行大括号里面的执行语句.
- 如果表达式的结果为fales,则不执行大括号里面的语句.
- if else 语句 else(否则)
- if(条件表达式) { 条件成立所执行的代码 ;} else{条件不成立所执行的语句}
- if和else 最终只会执行一个
- if else if 语句 (多分支语句)
-
if (条件表达式1) {语句1}
else if (条件表达式2) {语句2}
else if (条件表达式3) {语句3}
else {最后的语句}
- 从上往下执行,只要满足一个条件表达式就会执行里面的语句,否则执行最后的语句
- 多选一,只会执行一个语句, else if 中间有空格.
三元表达式
- 类似简化版的ifelse语句
- 语法: 条件表达式 ? 表达式1 : 表达式2
- 语法: var nub1 = nub > 5 ? ‘是的’ : ‘不是的’
- 如果条件表达式是ture则返回表达式1,如果是false,则返回表达式2.
switch语句
-
和if else 类似,但是只有一个表达式,且表达式的值一般会是特定的值或一个固定的值.
switch(表达式) { case value1:执行语句1;break; case value2:执行语句2;break; .... default:最后执行的语句; } -
表达式的值和哪个case 后面的值匹配 就会执行哪段代码,都不匹配则会执行最后一个.同样是只能执行一个.
-
表达式和值要全等 才能执行 值和数据类型一致!
-
case(小例子) break(退出)
循环 for while do while
- 重复执行某一段代码叫循环,被重复执行的语句叫循环体, 能否重复执行,取决于循环的终止条件,由以上两点组成的称之为循环语句.
for 循环 (重复执行某些代码, 通常跟计数有关系)
for(var i = 0;i < 3 ;i++) {
console.log('hellow')
}
//会打印输出3次hellow
-
语法: for (初始化变量; 条件表达式; 操作表达式) {循环体}
-
for (var nub = 1; nub<=100; nub++) { 执行的代码 }
- 初始化变量就是声明一个普通变量,用来表示当前循环次数
- 条件表达式 就是设置要循环的次数
- 操作表达式就是递增或者递增 改变初始化变量的值,一旦不符合第二条的条件表达式的要求,将会终止循环.
-
可以利用nub += 1和字符串的方式让循环体拼接在一行.
while 循环
- 语法: while (条件表达式){ 循环体; 变量++}
- 如果条件表达式的值一直是ture，循环体中不进行终止条件的话,会一直循环
- 可以做一些更精细的判断再循环
do while 循环
-
语法 do { //循环体} while (条件表达式)
-
和while 基本一直,但是do while 无论 是否达成条件,都会先执行一次循环体.
-
关键字 continue
-
continue; 退出本次循环(当前次的循环) 继续执行其他循环;
-
可以利用if (条件表达式) 删除一些不想要的循环;
九九乘法表
str = '';
for (i=1;i<10;i++) {
for (var j = 1;j<=i;j++){
str += j + 'x' + i + '=' + i * j+ '\t';
}
str+='\n';
}
console.log(str)
数组(arr)
- 数组就是一串数据的集合,里面的数据称为数组元素
- 数组元素之间用逗号隔开, 数组元素的数据类型没有限制.
- 声明数组并赋值称为数组初始化.
- 语法1:var arr = new Array(); new关键字 创建一个空数组
- 语法2:var arr1 = [] ; 字面量创建一个空数组
- 数组的索引(index)
-
表示某个数组元素在数组中的排列序号
- 数组元素的排列序号 是从0 开的,提取第一个数组元素,索引号要写0
- 索引号大于数组元素的个数会表示undefined
-
用来提取数组里的某一个元素
-
提取数组元素 语法:数组名[索引号];
- 数组长度 arr.length
- 可以计算数组里的数组元素有几个(动态检测)
- 语法 (数组名.length)
- 数组元素为空的时候 : 数组名.length 的值为 0 ;
- 遍历数组
-
利用for循环将数组里的元素 按顺序全部访问一次
-
因为数组元素第一个是从0开始的,所以 i要等于0 , 输出的时候输出第 i 个
var arr = [1,2,3] for (var i = 0;i < arr.length; i++) { console.log(arr[i]) //分别输出1 2 3 }
- 数组新元素
- 新增数组元素 修改length长度
- 语法:数组名.length = 数组个数++; 可以扩充数组容量
- 但是扩充的数组元素没有内容,会显示undefined
- 修改索引号 并赋值 追加数组元素
- 语法:数组名[数组元素长度++] = 数组元素;
- 追加的索引号是数组里面有的,会替换那个数组元素的值;
- 不要直接给数组名赋值 否则之前的数据将全部被覆盖
数组的翻转
- arr.reverse() 数组翻转方法
//数组翻转原生写法
function overturn(arr){
var temp = 0;
var num = arr.length-1;
for (var i = 0; i < arr.length / 2 ; i++) {
temp = arr[i];
arr[i]=arr[num];
arr[num] =temp;
num--;
}
console.log(arr)
}
overturn([1,2,3,4,5,6])
冒泡排序
- 为数字排大小 从大到小排列or从小到大排列
- 外层循环数组元素长度的次数
- 里层循环的次数比外层少一次 所以要减去 i
- 里层循环每次都是从0 开始的 对比第一个和第二个可以 用 j 和 j +1
- 运用一个空的变量 交换两个数组元素的值;
var arr = [1,8,3,5,2,9,6]
var temp = 0;
for (var i = 0;i<arr.length;i++){
for(var j = 0;j<arr.length-i -1;j++) {
if (arr[j]<arr[j+1]){
temp = arr[j];
arr[j] = arr[j+1];
arr[j+1] = temp;
}
}
}
console.log(arr)
- 数组的最大值最小值
- Math.max(…数组名) 可以利用扩展运算符求出最大最小值
函数(function)
- 将重复的代码装在一个盒子中 谁需要使用就调用这个盒子 ，这个盒子就是函数
- 函数的声明有两种方式(命名函数和匿名函数)
- 函数可以调用另外一个函数(在一个函数体里面调用其他函数即可)
命名函数
- 声明函数
- 语法: function 函数名() {函数体}
- 函数是做某件事情,函数名一般是动词
- 函数不调用,自己不执行
- 调用函数
- 语法: 函数名();
匿名函数
- var 变量名 = function(){函数体};
- 声明的是变量名,不是函数名
- 这个变量里面存的是函数.
函数的参数
-
语法:function 函数名(形参1,形参2… ) {函数体}
-
函数名(实参1,实参2…)
- 形参：函数声明后面的小括号里面的参数,称为形参,可以在函数体中使用,相当于变量。
- 实参：调用的时候小括号要传递的值称为实参,相当于变量的值
- 调用的时候 实参的值才会传给形参.
- 参数的作用,函数的某些值不固定,在调用的时候再传递不同的值进去.
- 多个参数之间用逗号隔开
-
函数的形参实参个数不匹配时
-
实参个数多于形参个数 : 值取到形参的个数,多的实参传递无效
-
实参个数少于形参个数 : 多余的形参取不到值会定义为undefined 和数字运算会变为NaN
函数的返回值(return)
-
function 函数名(形参1,形参2… ) { return 返回的值 ; }
-
函数只是实现某种功能,最终的结果需要返回给函数的调用者(实参)才合理, 通过return实现的
-
只要函数遇到return 就把后面的结果返回给实参.
-
通常用一个变量来接收 函数的返回结果(实参) 使用更简单.
-
var 变量名 = 函数名(返回结果);
-
return终止函数只能返回一个值!
- return 只能返回一个值, 如果用,号表示了多个值,只会返回最后一个值. 可以用数组保存多个值 返回这个数组即可
- 函数返回值 return 后面的代码不会执行了
-
如果函数没有return ， 返回的是undefined。
break,continue,return的区别
- break 退出当前的循环体
- continue 跳出此次循环,继续执行剩下的循环
- return 不仅可以退出循环,还可以返回值,同时会结束当前函数,后面的代码不执行;
arguments伪数组 (存储了传递的实参)
- 当不确定会接收几个实参的时候 形参内的小括号可以空着，在函数中可以通过argumengts获得传递过来的实参.
- argumengts是一个伪数组，可以通过**argumengts[index]**获得对应的实参
- 伪数组无法使用数组的push，pop等方法
- 只有函数才有arguments。
作用域(es6)
- js作用域: 将变量的命名 限定在某个范围 内其效果, 减少命名冲突,提高可靠性.
- 全局作用域:整个script标签里面 或者是一个单独的js文件.
- 局部作用域:只在这个函数内部起效果 也叫函数作用域.
- 系统默认script内部至函数外部 与 函数内部是两个不同的作用域,起同样的名字不会冲突.
- es6之前没有块级作用域.
根据作用域的不同,分为全局变量和局部变量
- 全局变量:在全局作用域下声明 的变量 在全局都可以使用 (函数外部声明的变量)
- 函数内部外部都可以使用
- 如果在函数内部 没有声明就直接赋值的变量也属于全局变量;
- 局部变量:在局部作用域下的变量, 在函数内部声明的变量就是局部变量
- 局部变量只能在函数内部使用
- 函数的形参也是局部变量
预解析
- js代码执行之前会先进行预解析
- js引擎会把js里面所用的var 还有function 提升到当前作用域的最前面先执行(只是声明)
- 然后再执行代码 书写的顺序 从上往下执行.
- 预解析分为变量预解析和函数预解析
-
变量预解析(变量提升) 就是把变量的声明提升到当前作用域的最前面先执行
console.log(num); var num = 10; 相当于: var num; console.log(num); num=10; //还没赋值就打印了 所以num结果为undefined -
函数预解析(函数提升) 就是把函数的声明提升到当前作用域的最前面先执行(不调用)
fun(); var fun = function() { console.log(22); } 相当于: var fun; fun(); //fun()上面没有 变量fun fun = function() { console.log(22); } //所以会报错 //函数表达式的调用一定要放在函数表达式的下面
对象(object)
- 对象是一个具体的实物 (女朋友不是具体的某一个人false,张三是具体的某个人ture)
- 对象是由**属性(特征,常用名词)和方法(行为,常用动词)**组成的
- 表达更清晰 , 用来保存一套完整的信息
- 对象属于复杂数据类型
字面量创建对象 {}
-
语法 var 对象名 = {}; 创建一个空的对象.
-
var 对象名 = {属性1:值, 属性2:值, 属性3:值, 属性4:值, 方法名: function () {函数体} }
- 里面的属性采取键值对的形式保存信息
- 多个属性或者方法中间用逗号隔开
- 方法名冒号跟的是一个匿名函数
-
调用对象的属性
- 方式1: 对象名 . 属性名 如：obj.name
- 方式2: 对象名[‘属性名’] 如：obj[i]
- 一般用于属性名是一个变量的时候 比如遍历对象 for in
-
调用对象的方法 : 对象名.方法名() 如：obj.fn()
变量和属性的不同,函数和方法的不同
- 变量 : 单独声明赋值,单独存在
- 属性 : 对象里面的变量称为属性,不需要声明, 调用要加对象名
- 函数 : 单独声明s存在,通过 函数名() 的方式就可以调用
- 方法 : 对象里面的函数称为方法,不需要声明,调用要加对象名
new Object 创建对象
-
语法 : var obj = new Object(); 创建了一个空的对象.
-
对象名.属性1= 值 ; 对象名.属性2= 值 ;
-
对象名.方法名 = function () {函数体} ;
- 使用属性并赋值可以给空对象添加属性
- 使用方法名并声明可以给空对象添加方法
- 调用的方法是一样的
构造函数创建对象
- 构造函数和普通函数不同,里面封装的是对象
- 利用函数,重复不同对象里面相同的属性或行为, 这个函数称为构造函数.
- 构造函数名字首字母要大写
- 调用构造函数前面要加一个new
- 构造函数不需要return 就可以返回结果
- 调用函数返回的数据类型是对象
- 只要调用了new 对象名() 就创建了一个对象
- 构造函数:泛指某一大类 对象: 某一大类里面的某一个东西
function Star(uname,age,sex) {
this.name = uname;
this.age = age;
this.sex = sex;
this.sing = function(sang) {
console.log(sang);
}
}
var ldh = new Star('刘德华',18,'男'); //声明一个变量保存了返回的对象类型相当于 声明了一个对象名
console.log(ldh.name)
console.log(ldh['sex'])
ldh.sing('冰雨') //调用对象里的sing函数 将实参传给形参sang 函数执行形参的内容
var zxy = new Star('张学友',20,'男');
new关键字
- new构造函数可以创造一个空的对象
- this会指向刚才创才的空对象
- 执行构造函数里的代码,给空对象添加属性和方法
- 返回值给这个new实例
for(var k in Obj) {
console.log(k); //变量 输出 得到的是属性名
console.log(Obj[k]); //对象[变量]输出 得到的是属性值
}
内置对象
- 内置对象就是语言自带的一些对象, 自带了一些常用或者必要的功能(属性和方法)
- 可以帮助我们快速开发
- 可以直接使用
MDN/W3C 查文档
- MDN提供了最常用的一些H5,CSS3一些技术
- 并且拥有很多全面的代码信息
- 网址:https://developer.mozilla.org/zh-CN/
Math对象(数字对象)
- 如果没有参数 结果为 -Infinity 如果有一个参数不是数值,返回NaN
-
Math.max(1,20,5) 最大值
- 取一组数字中的最大值 数字之间用逗号隔开
-
Math.min() 最小值
- 取一组数字中的最小值 数字之间用逗号隔开
-
Math.abs() 绝对值
- 可以将负值的 或者 字符串 的数字 转换成 正值的数字 (自带隐式转换)
-
Math.floor() 向下取整
- 相当于parseInt() 去除小数
-
Math.ceil() 向上取整
- 相当于(parseInt() ) +1 去除小数 +1
-
Math.round() 四舍五入
- Math.round(-1.5) 返回值 - 1
- 其他数字都是四舍五入 但是.5特殊 往大取值
-
Math.random() 随机数
- 返回一个浮点数 (随机在0~1之间) 大于等于0 但是小于1
- 里面不跟参数
function getRandom(min,max) { return Math.floor(Math.random() * (max - min + 1)) +min; } getRandom(1,10) var random = getRandom(1,10); //随机max到min 之间的一个整数 并且包含这两个整数
Date()日期
- 是一个构造函数 必须使用new 来调用日期对象
- 要想使用date的方法 必须先创建new一个日期对象
- 语法 : var date = new Date()
- 如果Date()没有参数 返回当前系统的当前时间
- 数字型参数:new Date(2019,10,01) 返回的月份会比填写的大一月
- 字符串型(常用)参数:new Date(‘2019-10-1 8:8:8’); 返回的和填写的一样
格式化日期 年月日
-
date.getFullYear() 返回当前日期的年
-
date.getMonth()+1 返回(0-11) 返回的月份小1个月 记得+1
-
date.getDate() 返回的是几号
-
date.getDay() 返回(0-6) 返回的是星期几 0是周日
- var arr = [‘星期日’,‘星期一’,‘星期二’,‘星期三’,‘星期四’,‘星期五’,‘星期六’]
- 可以利用数组 arr[返回值] 的方式表示星期几
-
date.getHours() 返回时
-
date.getMinutes() 返回分
-
date.getSeconds() 返回秒
- 利用三元运算符简单地在 时分秒小于10的时候在前面加个0
- h = h < 10 ? ‘0’ + h : h ;
-
获取Date总的毫秒数(时间戳)
- 计算机起始时间从1970年1月1日开始
- 所以是距离1970年1月1号过了多少毫秒
- 1秒=1000毫秒
- 方式1：console.log(date.getTime()) or date.valueOf()
- 方式2：var date1 = +new Date() 简单写法 new前面写个加号
- +new Date() 参数自己输入的话,可以获得起始时间至 输入日期时的总毫秒数
- Date.now() H5新增的
倒计时
- 因为直接用时分秒相减有成负数,所以不能用时分秒直接相减
- 输入未来的时间的毫秒数减去现在时间的毫秒数 就可以做到了
- 将剩余的时间总的毫秒数转换成天,时,分,秒(时间戳转换为时分秒)
// d = parseInt(总秒数/ 60/60 /24); // 计算天数
// h = parseInt(总秒数/ 60/60 %24) // 计算小时
// m = parseInt(总秒数 /60 %60 ); // 计算分数
// s = parseInt(总秒数%60); // 计算当前秒数
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); // 天
d = d < 10 ? '0' + d : d;
var h = parseInt(times / 60 / 60 % 24); //时
h = h < 10 ? '0' + h : h;
var m = parseInt(times / 60 % 60); // 分
m = m < 10 ? '0' + m : m;
var s = parseInt(times % 60); // 当前的秒
s = s < 10 ? '0' + s : s;
return d + '天' + h + '时' + m + '分' + s + '秒';
}
console.log(countDown('2019-5-1 18:00:00'));
var date = new Date();
console.log(date);
数组对象Array
- 语法var arr = new Array() 创建一个而空的数组
-
new Array(2) 参数为数字型
- 表示数组长度 里面有两个空的数组元素
-
new Array(2 , 3) 参数用逗号隔开了
- 相当于[2,3] 表示里面有两个数组元素 第一个2 第二个3
-
检测是否为数组
- instanseof 运算符检测 语法: (arr instanceof Array) 返回值 true和false
- 语法2 : (Array.isArray(arr)) 返回值 true和false h5新增的方法
数组的一些方法 push pop splice join等
- 添加数组元素 push unshift
- 数组名.push() 在数组的末尾 添加一个或 多个数组元素
- 数组名.unshift 在数组的开头 添加一个或 多个数组元素
- 参数直接写数组元素即可,多个参数之间用逗号隔开
- push和unshift完毕后,返回的值 是新数组的长度
- 原数组也会发生变化
- 删除数组元素 pop shift
- 数组名.pop() 删除数组的最后一个元素
- 数组名.shift() 删除数组的第一个元素
- 没有参数 , 执行 一次只能删除一个
- 返回的值是删除的那个数组元素
- 原数组也会发生变化
- 组合数组 arr.concat()
- var newArr = arr1.concat(arr2,arr3)
- 连接两个或者多个数组用逗号隔开 返回一个新的数组
- 截取数组 arr.slice()
- 数组截取 slice(截取开始的索引,截取结束的索引 )
- 返回被截取项目的新数组(截取结束的索引不包裹在内)
- 不影响原数组
- 第二个值不填 默认截取到最后
- 数组截取 arr.splice() 影响原数组
- arr.splice(截取开始的索引 , 截取的个数, 用什么替换删除的内容)
- 返回截取的数组 替换的值不再截取的新数组中
-
翻转数组 arr.reverse();
-
冒泡排序 arr.sort()
-
只能排序个位数的 两位数以上会按数字的第一位数排序,解决方案:
-
数组名.sort(function(a,b){return a - b}? 升序排列(从小到大)
-
数组名.sort(function(a,b){return b - a}? 降序排列(从大到小)
-
- 获取查找元素在数组元素索引
- arr.indexOf() 参数输入要查找的元素
- 如果有会返回索引号 有多个只返回第一个索引号就结束
- 如果没有要输入的元素 则返回-1
- 数组名.lastIndexOf() last最后 从后往前查找
- 和indexOf相同 差别是有多个会先返回最后一个的索引号
-
数组转换为字符串 arr.toString()
-
数组名.join(分隔符) 返回一个字符串
- 数组转换为字符串 参数可以填分隔符 分隔符默认逗号
var arr = [1,2,3] var str = arr.join('&') console.log(str) // 1&2&3
原生js数组去重
- 创建一个新的数组
- 用indexOf() 的返回值是不是-1 搜索 新数组中是否有旧数组的值,如果没有就添加进新数组,如果有返回的值不是-1就不添加
- 配合for循环 可以遍历旧数组的每一个值 达到一一搜索的效果,从而实现数组去重
var arr = [1,5,1,6,5,3]
var newArr=[];
for (var i = 0;i<arr.length;i++) {
//如果新数组没有旧数组当前循环的元素返回值就是-1 将这个数组元素添加到新数组中
newArr.indexOf(arr[i]) == -1 && newArr.push(arr[i]);
}
console.log(newArr)
字符串对象
-
因为字符串的不可变 所以不要大量的拼接和重新赋值字符串,字符串的值虽然改变了,但只是地址改变了,原先的值还占着内存空间
-
字符串方法
- 字符串名.indexOf ( 要搜索的字符串元素 , 搜索起始位置) ;
- 字符串名.lastIndexOf ( 要搜索的字符串元素 , 搜索起始位置) ;
- 如果有会返回索引号 有多个只返回第一个索引号就结束
- 起始位置不填 默认从头开始搜索 last相反 从尾部开始搜索
- 路径也可以搜索索引
-
求某个字符出现的次数和位置
var str ='ofafobeodsaodsi'; var index = str.indexOf('o'); var num = 0; while (index != -1 ) { console.log(index); index = str.indexOf('o', index + 1); num++ } console.log(num);- 声明一个变量保存要搜索的字符第一次出现的位置
- 条件表达式 if index不等于 -1;利用循环继续搜索indexOf(‘o’, index + 1); 此次搜索出的位置 +1 即可继续搜索后面是否还有要搜索的字符
- 声明一个变量等于0, 每次index 不等于 - 1的时候(说明有) 这个变量++ 就计算了这个字符出现的次数
-
根据位置返回字符
- 语法: 字符名.charAt(索引) 返回索引号所对应的字符
- 参数写数字会返回一个字符长度位置的字符
- 可以利用for循环遍历所有的字符
- 语法:字符名.charCodeAt() 返回ASCII值
- 参数填数字 返回索引号字符相应的ASCII值
- 键盘上每个可以输入的数字,单词,字符的ASCII都不同 , 可以用来判断用户按下了哪个键
- 语法:字符名[]
- 填写数字 获取指定位置的字符 h5新增
- 和数组[]一样
- 语法: 字符名.charAt(索引) 返回索引号所对应的字符
-
统计出现次数最多的字符
var str = 'sdadasdtfdgdadvadwq'; var o = {}; //先创建一个空对象 for (i=0;i<=str.length;i++) { //利用for循环遍历字符串 var j = str.charAt(i); //声明一个变量j等于此次循环遍历的str字符 if(o[j]) { //用if判断空对象o[j] 有没有这个属性,没有 o[j]++; //的话, o[j]=1 相当于创建了一个属性j=1; } else { //如果有的话这个属性的值++; o[j] = 1; } } console.log(o); //这样就可以得到每个字符串出现的次数 var max = 0; //声明一个最大值 max = 0 var str1= '' ; for(k in o) { //遍历对象 if (o[k] > max) { //当遍历的这个属性的值 >=max的时候 max = o[k]; //就用max 保存这个值 str1 = k; //因为k不能再外面使用,需要用一个空字符保存 } } console.log(str1); //输出出现次数最多的次数的字符 console.log(max); //输出出现次数最多的次数- 先创建一个空对象
- 利用for循环和charat 遍历整个字符串
- 用一个变量保存每次遍历的字符串
- 用if搜索对象的属性有没有这次遍历的字符串元素,如果有 就为这个对象的属性+1;就声明一个属性赋值等于1; (得出每个不同字符出现的次数)
- 声明一个变量等于0, 用for…in遍历这个对象的值 对比声明的变量,大于的时候用变量保存这个对象的值 (得出出现次数最的次数)
- 因为k不能再for外面使用 所以要声明一个空字符串保存这个k;
-
字符串的操作方式
- 字符串.concat() 用于拼接多个字符串,等效于+, 但是+更常用
- 字符串.substr(截取的起始位置(索引号) , 截取几个字符)
- 后面的值不填,截取后面所有的
- 字符串.replace(要替换的字符 , 替换后的字符)
- 有多个一样的要替换的字符时,只会替换第一个
- 可以利用for循环加indexOf 替换全部要替换的字符
- 字符串.split( ’ 分隔符 ’ ) 字符串转换为数组
- 字符串里面要有分隔符转换为数组时才能划分多个数组元素
- 否则只会有一个数组元素
- 分割符参数写字符串里面用于分割的分割符, 转换的数组分隔符是逗号
- 转换大小写
- 字符串.toUpperCase() 转换大写
- 字符串.toLowerCase() 转换小写
统计 数组或字符串内 不同元素的出现次数
var arr =["c", "a", "z", "a", "x", "a"];
var obj = {};
for (var i = 0; i < arr.length;i++) {
var index = arr[i];
// if (obj[index]) { //判断函数是否有这个属性
// obj[index]++; //如果有的话 值+1;
// } else {
// obj[index] = 1; //如果函数里面没有这个属性 则创建一个并赋值为1
// }
obj[index] ? obj[index]++ : obj[index] = 1;
}
console.log(obj);
对象和函数应用时机
- 函数是返回的一个值
- 输出对象的时候 可以返回 属性和值 显示出来 是键值对的
616
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
