javascript基础 总结性笔记 黑马前端视频笔记
一、变量
- 为什么需要变量:存储一些数据
- 是什么:在内存中开辟一块空间,存储数据,用变量名指向这个空间。
- 怎么用:先声明
var a;
,再赋值a=10;
。 - 命名规范:区分大小写|数字字母_$|不能以数字开头
注意点:
二、简单数据类型
- 为什么需要数据类型:不同数据占据存储空间不同
- 分类:简单数据类型 复杂数据类型(用new生成的)
- 简单数据类型 放在栈 在栈里开辟空间存放值
- 复杂数据类型 放在堆 在栈里开辟空间存放地址 地址指向堆 值放在堆
- 简单数据类型传参:
function fun(a){
a++;
console.log(a);
}
var x=10;
fun(x);
console.log(x);
输出11 10
2. 复杂数据类型传参:
function Person(name){
This.name=name;
}
function fun(a){
console.log(a.name);
a.name='张学友';
console.log(a.name);
}
var x=new Person('刘德华');
console.log(x.name);
fun(x);
console.log(x.name);
输出刘德华 刘德华 张学友 张学友
重点对比最后一句:形参的操作对简单数据类型的数据不起作用,形参的操作对复杂数据类型的数据起作用
| console(typeof goods); 字符型是黑色 | 类型转换 |
---|
数字型Number | - 八进制
var num=010; 8 - 十六进制
var num=0xa; 10 - 最大值
Number.MAX_VALUE - 最小值
Number.MIN_VALUE - 无穷大 infinity
- 无穷小 -infinity
- 非数值 NaN 判断是否为数字
isNaN(判断的东西); 是返回false
| - parseInt(str) 可以去单位
parseInt('120px') –120 - parseFloat(str) 去单位
- - * /隐式转换
console('123'-3) –120 - 强制转换Number(str)
|
字符串类型String | - 引号嵌套:内双外单 内单外双
- 转义字符要包到引号中
- 长度
str.length; 无括号 - 隐式转换:字符串+任何其他类型=字符串
| - +隐式转换
var num=1;alert(num+''); - num.toString()
- 强制转换String(num)
|
布尔型Boolean | | - Boolean(变量)
null NaN undefined 0 '' 代表空、否定的值转换为false
|
Undefined | | |
Null | | 返回的是object 空的对象 如果有个变量打算存储为对象,但是没想好放啥,就先给null |
三、运算符
四、流程控制
五、数组
- 为什么需要数组:一次存储多个数据
- 数组是有序的;对象是无序的。
| |
---|
创建数组 | var arr=['a',1,true]; var arr=new Array(); 空数组var arr=new Array(3); 3为数组长度 var arr=new Array(2,3); 2,3是元素
|
访问数组元素 | var a=arr[1] –1 var a=arr[3] –undefined
|
遍历数组 | - 利用索引号进行
for 循环 - 数组长度
arr.length
|
数组转换为字符串 | - +隐式转换
arr.toString(); 默认,分割arr.jion(分隔符)
|
新增删数组元素 | - 修改数组长度,后边的是undefined
- 修改索引号
arr[索引号]=值; arr.push(元素值); 末尾加 返回新数组长度arr.unshift(元素值); 开头加 返回新数组长度arr.pop(); 删除最后一个 返回删除的元素arr.shift(); 删除第一个 返回删除的元素
|
反转数组元素 | arr.reverse(); |
冒泡排序 | arr.sort(); 只对个位数有效arr.sort(function(a,b)){return a-b;} 升序
|
返回元素的索引 | arr.indexof(元素); 没有返回-1 去重 多个元素只返回第一个索引号arr.lastIndexof(元素); 逆序
|
检测是否为数组 | - 运算符
arr instanceof Array 返回布尔值 - 对象方法
Array.isArray(参数) 返回布尔值 H5新增
|
六、函数
- 为什么需要函数:封装可以被重复调用的代码块,增加代码可用性
| |
---|
声明方式 | - 命名函数
function fn(){} - 函数表达式
var fn=function(){} 变量提升 函数不提升
|
形参实参个数不匹配 | - 形参多 NaN 多出来的形参相当于声明未赋值undefined
- 实参多 取形参个数 直接算
|
返回值return | - 有return 返回后边的值
- 没有return 返回
undefined
|
arguments 内置对象 | 不确定有多少个参数传递时,用arguments 对象存储传递的实参- 是个伪数组 有length 按索引存储 没有.pop() .push()方法
- 每个函数都有
|
作用域 | - 全局作用域 全局变量 特殊:在函数内部 没有声明直接赋值
- 局部作用域 局部变量 注意:函数形参可以看作局部变量
- 块级作用域 es6新增
|
预解析 | - 变量预解析(1).
var num=10;console.log(num); 正常输出(2).console.log(num); var num=10 –输出undefined - 函数预解析(1).
function fn(){console.log(11);} fn(); 正常运行(2).fn(); function fn(){console.log(11)}; 正常执行 (3)var fn=function(){console.log(11)} fn(); 正常执行(4)fn();var fn=function(){console.log(22);} 报错
|
作用域和预解析 重点案例
fun();
console.log(c);
console.log(b);
console.log(a);
function fun(){
var a=b=c=9;
console.log(a);
console.log(b);
console.log(c);
}
输出结果9 9 9 9 9 报错
七、对象
- 为什么需要对象:保存一个人的完整信息。让结构更清晰。
- 什么是对象:对象是具体的事物。是一组的无序的相关属性和方法的集合。
- 字符串、数值、数组、函数都是对象。
- 对象分为:1.自定义对象 2.内置对象3.浏览器对象
| |
---|
创建对象 | - 字面量构建
var obj={uname:'a', age:19, sayHi:function(){console.log('hi')}}; <li - new object()
var obj=new Object(); obj.uname='a'; obj.age=19; obj.sayHi=function(console.log('hi');){} - 构建函数构建对象 一次可以构造多个对象
function Star(uname,age){this.name=uname; this.age=age;this.sayHi=function(){}} var a=new Star('a',19); 构造函数首字母大写
|
使用对象 | - 对象.属性名
obj.uname; - 对象[‘属性名’]
obj['uname']; - 对象.方法名()
obj.sayHi();
|
遍历对象 | for ( var k in obj){console.log(k);--属性名 console.log(obj[k]);--属性值} 不能用obj.k obj[‘k’]
|
内置对象 | js自带的一些对象,提供常用的方法和属性 MDN文档查阅内置对象 |
Math对象 | - 不需要new实例化 直接使用
- 最大值
Math.max([参数]) 1.如果参数里有无法转换成数字的 NaN 2.无参数 -infinity - 绝对值
Math.abs(参数) 1.字符串型‘-1’ 会隐式转换 2.非数字型 NaN - 向上取整
Math.ceil(参数) - 向下取整
Math.floor(参数) - 四舍五入
Math.round(参数) 1.对于0.5 往大了取 Math.round(-1.5)=-1 - 产生随机小数[0,1)
Math.rondom() - 得到两个数之间的随机整数,且包含这两个数
function getRandom(min.max){return Math.floor(Math.random()*(max-min+1))+min;} 2.得到两个数之间随机整数,但是不包含这两个数 不加1
|
Date对象 | - 是构造函数,需要实例化
- 返回当前时间
var date=new Date(); 不加参数 - 返回想要时间1.
var date=new Date('2022-7-1 8:8:8'); 参数为字符串型 正确2. var date=new Date('2022,7,1 ); 参数为数字型 返回的月份比实际月份大1月 - 返回当前年
date.getFullYear() ; - 返回当前月
date.getMonth() ; 0-11 返回的月份比现在小1月 - 返回当前日
date.getDate() ; - 返回周几
date.getDay() ; 0-6 - 返回当前小时
date.getHours() ; - 返回当前分钟
date.getMinutes() ; - 返回当前秒
date.getSeconds() ; - 时间戳1.
var date1=+new Date(); 当前时间距离1970年1月1号过了多少毫秒 2.Date.now() ;H5新增属性 3.date.valueof(); 4.date.getTime();
|
Array对象 | 见五、数组 |
String对象 | - 基本类型包装:把简单数据类型 包装成 复杂数据类型 String Number Boolean
- 字符串不可变,操作完成后会返回新的字符串,原本的字符串还在。
- 根据字符返回位置 1.
str.indexOf(字符,[起始位置]); 无起始位置,返回第一个出现的索引 2.str.lastIndexOf(字符); 从后往前找 但索引不会倒序 - 根据位置返回字符1.
str.charAt(index) 2.str.charCodeAt(index) 返回字符的ASC码 3.str[index] H5新增 - 连接字符
str.concat(连接的元素); 一般用+ - 截取字符
str.substr(从哪个位置开始,截取的长度); - 替换字符
str.replace(被替换的元素,替换的元素); 只会替换第一个出现的字符 - 字符串转换为数组
str.split('分隔符');
|
八、重点案例代码
- 打印n行n列的星星
- 打印倒三角
- 打印九九乘法表
- 数组去重
- 冒泡排序
- 倒计时
- 统计出现次数最多的字符