作用域
一段程序代码中所用到的名字并不总是有效可用的,而限定这个名字(变量)的可用性的代码范围,就是这个名字的作用域,作用域提高了逻辑程序的局部性,增强了可靠性,减少了名字冲突;
JavaScript作用域(es6)之前:全局作用域,局部作用域
全局作用域:整个script标签或者是一个单独的JS文件
局部作用域(函数作用域):在函数内部就是作用域;
变量作用域
全局变量:在全局作用域下声明的变量;如果在函数内部没有声明(var)直接赋值的变量也是全局变量 num = 2;
局部变量:在函数内部声明的变量;
全局变量 和 局部变量
- 全局变量任何地方都可以使用;只有浏览器关闭的时候才会销毁,比较占用内存资源;
- 局部变量只有在函数内可以使用;当程序执行完毕就会销毁,比较节约内存资源;
作用域链
内部函数访问采用链式查找外部函数的变量来决定取哪个值, 这种结构称为作用域链
var num = 10;
function fu() {
var num = 20;
function fun() {
var num = 30;
// 在fun内部往外部查找
// 1. 如果 fun 没有声明 num 就去找到 fu 内部 num 变量;
// 2. 如果 fun 和 fn 内部都没有 num 就去全局找;
// 3. 如果 都没有 报错 num is not defined;
console.logg(num);
}
fun();
}
fu();
预解析
JS 解析器运行 JS 分为两步:预解析,代码执行
预解析: Js引擎会把 js 里面所有的 var 还有 function 提升到当前作用域的最前面
代码执行:从上往下依次执行;
变量预解析(变量提升)
就是把所有的变量声明提升到当前作用域最前面,不提升赋值操作;
console.log(num); // num is not defined;
var num = 10;
// 等价于
var num;
console.log(num);
num = 10;
fun(); // fun is not a function
var fun = function () {...}
// 等价于
var fun;
fun();
fun = function () {...};
函数预解析(函数提示)
就是把所有函数的声明提升到当前作用域的最前面,只提升不调用
fun()
function fun() {...}
// 等价于
function fun() {...}
fun();
案例:
fn();
console.log(a);
console.log(b);
console.log(c);
function fn() {
var a = b = c = 9;
// var a = 9, b = 9, c = 9; 这种声明方式 b 和 c 是全局变量
console.log(a);
console.log(b);
console.log(c);
}
对象
在 javascript 中,对象是一组无序的相关属性和方法的集合,所有事物都是对象,String Number Array function ...
创建对象的三种方式
对象字面量
// 创建一个名称为 obj 的对象;并且包含多个属性和一个方法;
var obj = {
uname: ‘zs‘,
uage: ‘23‘,
usex: ‘0‘,
sayHi: function () {
console.log(‘Hi~‘);
}
};
// 1. 调用对象属性;
console.log(obj.uname);
console.log(obj[‘uage‘]);
// 2. 调用对象方法
obj.sayHi();
new Object
var obj = new Object(); // 声明一个空对象;
obj.name = ‘zs‘;
obj.sayHi = function () {
return ‘Hi‘;
}
console.log(obj.name);
console.log(obj.sayHi());
构造函数:是一种特殊的函数,主要用来初始化对象,即为对象成员赋初始化值,可以把对象中一些公用的属性和方法抽取出来,封装到这个函数里;
// 构造函数中是不需要return的
// 抽象了对象的公共部分,封装到了函数里面,泛指一大类(class)
function Person(name) {
this.name = name;
this.sayHi = function (say) {
console.log(say);
}
}
// 特指某一个,通过 new 关键字创建对象的过程也称对象实例化
var zs = new Person(‘zs‘);
console.log(zs.name);
zs.sayHi(‘Hi~‘);
// new 执行过程
// 1, 在内存中创建一个空对象
// 2, 让 this 指向这个新对象
// 3, 执行构造函数里面的代码,给这个新对象添加属性和方法
// 4, 返回这个对象
遍历对象
var obj = {
uname: ‘red‘,
say: function () {
console.log(‘Hi‘);
}
}
// 遍历对象
for (var k in obj) {
console.log(k); // 输出键;uname, say
console.log(obj[k]); // 输出值;red, function
}
JavaScript 内置对象
Math
Math.PI; // 返回圆周率
Math.max(1, 2); // 返回最大值,非数字返回NaN, 空返回 -infinity
Math.min(1, 2); // 返回最小值,非数字返回NaN, 空返回 infinity
Math.abs(1); // 绝对值 字符串型数字会隐式转换,非数字返回 NaN
Math.floor(1.9); // 向下取整;
Math.ceil(1.1); // 向上取整;
Math.round(1.5); // 四舍五入;
Math.random(); // 随机数 0~1 不包含1
// 案例 任意两个数之间的随机值,包含最大值
function getRandom(max, min) {
return Math.floor(Math.random() * (max - min + 1) + min);
}
Date
// date 是构造函数 要通过new来创建实例
var date = new Date(); // 默认输出当前系统时间 2020-03-25T14:45:05.347Z
var date = new Date(‘2019-10-1 8:8:8‘) // 可以设置时间注意格式 2019-10-01T00:08:08.000Z
方法 | 说明 |
---|---|
getFullYear(); |
获取当前年 |
getMonth(); |
获取当前月(0 - 11) |
getDate(); |
获取当前日 |
getDay(); |
获取当前 星期(星期天 0) |
getHours(); |
获取当前小时 |
getMinutes(); |
获取当前分钟 |
getSeconds(); |
获取当前秒 |
获取时间戳
var date = new Date();
date.valueOf();
date.getTime();
// 简单写法
var date1 = +new Date();
// H5 新增方法
Date.now();
Array
检测是否为数组
var arr = [];
console.log(arr instanceof Array); // true false
console.log(Array.isArray(arr)); // true false H5 新增 IE9+
添加删除数组元素
方法名 | 说明 | 返回值 |
---|---|---|
arr.push(1, 2); |
末尾添加一个或多个元素,修改原数组 | 返回新的长度 |
arr.pop(); |
末尾删除一个元素,修改原数组 | 返回被删除的元素 |
arr.unshift(1, 2); |
开头添加一个或多个元素,修改原数组 | 返回新的长度 |
arr.shift(); |
开头删除一个元素,修改原数组 | 返回第一个被删除的元素 |
数组排序方法
方法 | 说明 | 返回值 |
---|---|---|
reverse(); |
翻转数组 | 已经翻转完成的数组 |
sort(); |
数组排序,但是如果碰到2位数以上的元素需要特殊处理 | 已经排序完成的数组 |
// **以上两个方法会修改原数组**
var arr = [13, 44, 2, 1, 0];
arr.sort(function (a, b) {
// return a - b; // 升序排列
return b - a; // 降序排列
});
数组索引方法
方法名 | 说明 | 返回值 |
---|---|---|
indexOf(); |
数组中查找给定元素的第一个索引 | 如果存在返回索引号,不存在返回 -1 |
lastIndexOf(); |
在数组中的最后一个索引 | 如果存在返回索引号,不存在返回 -1 |
var arr = [‘pink‘, ‘red‘, ‘bule‘, ‘red‘];
console.log(indexOf(‘red‘)); // 1 从前面开始找只找一个
console.log(lastIndexOf(‘red‘)); // 3
// 数组去重
function unique(arr) {
var newArr = [];
for (var i = 0; i < arr.length; i++) {
if (newArr.indexOf(arr[i]) === -1) {
newArr.push(arr[i]);
}
}
return newArr;
}
原文地址:https://www.cnblogs.com/article-record/p/12571775.html
时间: 2024-10-14 06:30:17