030-Web前端-JS-变量与内置对象

最新推荐文章于 2023-12-23 08:00:00 发布

我的肚肚有点儿疼

最新推荐文章于 2023-12-23 08:00:00 发布

阅读量169

点赞数

分类专栏： Web前端

本文链接：https://blog.csdn.net/Fenfen_vyron/article/details/106723822

版权

Web前端专栏收录该内容

46 篇文章 0 订阅

订阅专栏

#6.12 又一个加长版^2^

1.变量 2.内存 3.Math对象 4.Date对象

1.变量

(1)变量提升 (2)变量作用域. (3)一等公民. (4)函数名提升. (5)函数内的变量提升. (6)*函数参数的默认值

(1)变量提升

JavaScript引擎的工作方式是，先解析代码，获取所有被声明的变量，然后再一行一行地运行。这造成的结果就是所有的变量的声明语句，都会被提升到代码的头部。javascript的这种读取变量的机制就叫做变量提升。

描述：

js会将var命令声明的全局变量的声明语句提升到代码的头部

js会将var命令声明的局部变量的声明语句提升到函数的头部

ps：变量提升只对var命令声明的变量有效，如果一个变量不是用var命令声明的，就不会发生变量提升。

(2)变量作用域

用var声明的变量：

console.log(num);

var num = 1;

//undefined

不用var声明的变量：

console.log(num);

num = 1;

//error!

很明显的区别，不使用var声明的变量在使用时被系统识别为错误。这是因为javascript中存在一个叫做局部变量的东西：

var声明的变量称为局部变量。

局部变量仅在其所在的函数范围内生效，变量生效的范围被称为变量作用域。

而变量如果不使用var来声明，则表示变量在整个文件内生效。即全局变量。

(3)一等公民

描述：在JavaScript世界中函数却是一等公民，它不仅拥有一切传统函数的使用方式（声明和调用），而且可以做到像简单值一样赋值、传参、返回，这样的函数也称之为第一级函数（First-class Function）或一等公民。

a.函数可以直接赋值给变量

b.函数可以直接当作另一个函数的参数

c.函数可以像简单值一样作为函数的返回值

补充说明：在很多传统语言（C/C++/Java/C#等）中，函数都是作为一个二等公民存在，你只能用语言的关键字声明一个函数然后调用它，如果需要把函数作为参数传给另一个函数，或是赋值给一个本地变量，又或是作为返回值，就需要通过函数指针(function pointer)、代理(delegate)等特殊的方式周折一番。

但是在JavaScript世界中函数却是一等公民，它不仅拥有一切传统函数的使用方式（声明和调用），而且可以做到像简单值一样赋值、传参、返回，这样的函数也称之为第一级函数（First-class Function）或一等公民。不仅如此，JavaScript中的函数还充当了类的构造函数的作用，同时又是一个Function类的实例(instance)。这样的多重身份让JavaScript的函数变得非常重要。

(4)函数名提升

JavaScript引擎将函数名视同变量名，通过function命令声明函数时，整个函数会像变量声明一样，被提升到代码头部。

qiuHe(1,2);

function qiuHe(a,b) { console.log(a+b); }//3

注意：函数表达式声明不会发生函数提升（只有function声明的函数会发生函数名提升，而如果通过赋值语句写的函数则不会。）

qiuHe(1,2);

var qiuHe = function(a,b){ console.log(a,b); };//qiuHe is not a function

(5)函数内的变量提升

与全局作用域一样，函数作用域内部也会产生“变量提升”现象。var命令声明的变量，不管在什么位置，变量声明都会被提升到函数体的头部。

e.g.

var bb='11111111';

function aaa(){

//其实此处：var bb;

alert(bb); //undefined

var bb='test';

alert(bb); //test

var cc='test1';

alert(age); //error

}

aaa();

(6)*函数参数的默认值

function func(num){

num = num || 1; // ||为或，num默认值为1

return num;

}

func() // 1

这种写法会对函数参数num进行一次布尔运算，只有为true时才会返回num。避免了因为忘写参数而导致的函数调用失败问题。

可是除了undefined以外，0、空字符、null等的布尔值也是false。也就是说，在上面的函数中，不能让num等于0或空字符串，否则在明明有参数的情况下，也会返回默认值1。

func('') // 1

func(0) // 1

2.内存

//部分知识除（1）外了解

(1)值传递和地址传递. (2)函数的同名参数. (3)arguments对象. (4)eval函数. (5)instanceof类型检测. (6)javascript垃圾回收机制

(1)值传递和地址传递

原始数据类型(数值、字符串、布尔值)的内容传递方式是值传递(pass by value)。

复合数据类型(数组、对象、其他函数)的内容传递是地址传递(pass by reference)。

(2)函数的同名参数

如果函数有同名的参数，则取最后出现的那个参数值。

function func(num, num) {

console.log(num);

}

func(1, 2) // 2

如果函数没有提供第二个参数，num的取值就变成了undefined

function func(num, num) {

console.log(num);

}

func(1) // undefined

原则上来讲：尽量不要写同名参数，而且定义函数的时候写了几个参数，在调用的时候尽量保证和定义时一致。

(3)arguments对象

由于JavaScript允许函数有不定数目的参数，所以我们需要一种机制来在函数体内部读取所有参数。这就是arguments对象的由来。

arguments对象包含了函数【运行时】的所有参数。

arguments[0]就是函数的第一个参数,arguments[1]是第二个,以此类推。这个对象只有在【函数内部】才可以使用。

var func = function(one) {

console.log(arguments[0]);

console.log(arguments[1]);

console.log(arguments[2]);

}

func(1, 2, 3);

能够看到，尽管在函数被声明的时候并没有多个参数。但是在函数运行的时候有三个参数，因此arguments对象便能够获取到这三个参数。

arguments对象除了可以读取参数，还可以为参数赋值

var func = function(a, b) {

arguments[0] = 3;

arguments[1] = 2;

return a + b;

}

console.log(func(1, 1)); // 5

当然也可以通过arguments对象length属性，判断函数调用时究竟带几个参数

function func() {

return arguments.length;

}

f(1, 2, 3) // 3

f(1) // 1

f() // 0

作用：

(1)arguments对象包含了函数【运行时】的所有参数。

var func = function(one) {

console.log(arguments[0]);

console.log(arguments[1]);

console.log(arguments[2]);

}

func(1, 2, 3);

(2)arguments对象除了可以读取参数，还可以为参数赋值

function func(num1,num2){

arguments[0]=10;

arguments[1]=20;

console.log(num1+num2);

}

func(2,3);

需要注意的是，虽然arguments很像数组，但它是一个对象。数组专有的方法（比如slice），不能在arguments对象上直接使用。

(4)eval函数

描述：能够将字符串当作代码执行

语法：eval(string);

例子：

var str='var temp=10';

eval(str);

console.log(temp);

ps：如果eval函数在使用的过程中发生了非法调用或者传入参数出错，则会抛出异常。

pss：虽然 eval() 的功能非常强大，但在实际使用中用到它的情况并不多。

(5)instanceof类型检测

typeof用来检测基本数据类型简直是神器，但是如果是引用数据类型，则需要使用instanceof操作符。

描述：用来检测是否归属于某个类型(仅对于复合数据类型)

语法：变量 instanceof 类型

var arr=[1,2,3];

console.log(arr instanceof Array); //数组属于对象

var obj={}; //但

console.log(obj instanceof Array); //对象不属于数组

var func=function(){};

console.log(func instanceof Array);

instanceof 用于判断一个变量是否某个对象的实例。

var arr = new Array();

console.log(arr instanceof Array); //true

console.log(arr instanceof Object);//true(Array 是 object 的子类)

上面我们强调了arguments是一个对象。

在这里我们可以用instaceof测试会发现 arguments不是一个Array对象，尽管看起来很像。 function func() {

console.log(arguments instanceof Array); //false

console.log(arguments instanceof Object);//true

}

func();

(6)javascript垃圾回收机制

对于其他语言来说，如C,C++,需要开发者手动的来跟踪并管理内存。

而JS的垃圾回收机制使得JS开发人员无需再关系内存的情况，所有的内存分配以及回收都会由垃圾回收器自动完成，执行环境会对执行过程中占有的内存负责。

其原理就是找出那些不在被使用的变量，然后释放其所占有的内存。回收器一般是按照固定的时间间隔或者预设的时间进行处理的。

function test1(){

var item = { name:'frank' };

}

function test2(){

var item = { name:'frank' };

return item;

}

var m1 = test1();

var m2 = test2();

3.Math对象

Math对象是JavaScript的内置对象，提供一系列数学常数和数学方法。该对象不是构造函数，所以不能生成实例，所有的属性和方法都必须在Math对象本身上调用。

(1)Math对象属性：Math对象的属性表示只读的数学常数

Math.E：常数e。 // 2.718281828459045

Math.LN2：2的自然对数。// 0.6931471805599453

Math.LN10：10的自然对数。// 2.302585092994046

Math.LOG2E：以2为底的e的对数。// 1.4426950408889634

Math.LOG10E：以10为底的e的对数。// 0.4342944819032518

Math.PI：常数Pi。// 3.141592653589793

Math.SQRT1_2：0.5的平方根。// 0.7071067811865476

Math.SQRT2：2的平方根。// 1.4142135623730951

(2)Math对象的方法

Math.round()：四舍五入

小于0.5取0，大于等于0.5取1

Math.round(0.1) // 0

Math.round(0.5) // 1

Math.round(-1.1) // -1

Math.round(-1.6) // -2

Math.floor()：向下取整

Math.floor(3.9) // 3

Math.floor(-3.2) // -4

Math.ceil()：向上取整

Math.ceil(3.2) // 4

Math.ceil(-3.9) // -3

Math.abs()：绝对值

Math.abs(1) // 1

Math.abs(-1) // 1

Math.max()：最大参

Math.max(2, -1, 5) // 5

Math.min()：最小参

Math.min(2, -1, 5) // -1

Math. pow()：第一个参数为底、第二个参数为幂的指数值

Math.pow(2, 2) // 4

Math.pow(2, 3) // 8

Math. sqrt()：返回平方根

//如果参数是一个负值，则返回NaN

Math.sqrt(4) // 2

Math.sqrt(-4) // NaN

Math. log()：返回以e为底的自然对数值

Math.log(Math.E) // 1

Math.log(10) // 2.302585092994046

Math. exp()：返回常数e的参数次方

Math.exp(1) // 2.718281828459045

Math.exp(3) // 20.085536923187668

三角函数方法

Math.sin方法返回参数的正弦

Math.cos方法返回参数的余弦

Math.tan方法返回参数的正切。

Math.asin方法返回参数的反正弦

Math.acos方法返回参数反余弦

Math.atan方法返回参数反正切

Math.sin(0) // 0

Math.cos(0) // 1

Math.tan(0) // 0

Math. random()：伪随机数

返回0到1之间的一个伪随机数。可能等于0，但是一定小于1。常用！

//0-10随机数

var num=Math.random()*10;

console.log(num);

//10-15随机数

var num=Math.random()*5 +10;

console.log(num);

//10-15随机整数

var num=Math.floor(Math.random()*5 +10);

console.log(num);

//总结：m-n之间的随机整数

Math.floor(Math.random()*(m-n)+m);

e.g.验证码：

//获取随机字符构成的，指定长度的字符串，形成验证码

function getRandomNumber(min,max){ //获取范围内随机数

return Math.floor(Math.random()*(max-min)+min);

}

function getRandomStr(length){

var characterDic =

'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-_';

var finalStr='';

for(var i=0;i<length;i++){

var index=getRandomNumber(0,64);

var tempStr=characterDic[index];

finalStr+=tempStr;

}

return finalStr;

}

var str=getRandomStr(4);

console.log(str);

4.Date对象

Date对象是JavaScript提供的日期和时间的操作接口。在JavaScript内部，所有日期和时间都储存为一个整数。这个整数是当前时间距离1970年1月1日00:00:00的毫秒数，正负的范围为基准时间前后各1亿天同Math对象一样，javascript也为Date对象提供了很多内置的方法。

(1)Date()函数

描述：Date函数可以被Date对象可以直接调用，返回一个当前日期和时间的字符串。

语法：var date=Date();

例子：

var date=Date();

console.log(date);

// 无论有没有参数，直接调用Date总是返回当前时间

(2)Date(日期字符串|日期参数)构造函数

Date对象是一个构造函数，对它使用new命令，会返回一个Date对象的实例。

【如果不加参数，生成的就是代表当前时间的对象。】

语法：var date1 = new Date();

var today = new Date();

// "Fri Nov 7 2014 14:52:00 GMT+0800 (中国标准时间)"

【如果添加一个日期字符串作为参数，返回字符串所对应的时间。】

语法：var date2 = new Date("January 6, 2013");

// Sun Jan 06 2013 00:00:00 GMT+0800 (中国标准时间)

一些其他合法的日期字符串写法

new Date(datestring)

new Date("2013-2-15")

new Date('2013/2/15')

new Date("2013-FEB-15")

new Date("FEB, 15, 2013")

new Date("FEB 15, 2013")

new Date("Feberuary, 15, 2013")

new Date("Feberuary 15, 2013")

new Date("15, Feberuary, 2013")

Sun Jan 06 2013 00:00:00 GMT+0800 (中国标准时间)

【如果添加日期参数，返回字符串所对应的时间。】

语法：var date2 = new Date(year, month, day, hours, minutes, seconds, ms)

使用日期参数时，年月必须写，其他则默认和可以省略，省略为0。

new Date(2013, 2)// Fri Mar 01 2013 00:00:00 GMT+0800 (中国标准时间)

new Date(2013, 0, 15)// Tue Jan 15 2013 00:00:00 GMT+0800 (中国标准时间)

new Date(2013, 0, 22, 7)// Tue Jan 22 2013 07:00:00 GMT+0800 (中国标准时间)

new Date(2013, 0, 1, 8, 15, 47, 18) //Tue Jan 01 2013 08:15:47 GMT+0800 (中国标准时间)

(3)日期运算

之前提到过，javascript内部存储日期类型的时候等于距离1970年1月1日零点的毫秒数。而显示给用户的时候是转换为字符串显示的。因此：

两个日期对象进行减法运算，返回的就是它们间隔的毫秒数。

两个日期对象进行加法运算，返回的就是连接后的两个字符串。

var d1 = new Date(2000, 2, 1);

var d2 = new Date(2000, 3, 1);

console.log(d2-d1);//2678400000

console.log(d2+d1);//Sat Apr 01 2000 00:00:00 GMT+0800 (中国标准时间)Wed Mar 01 2000 00:00:00 GMT+0800 (中国标准时间)

(4)日期对象的get*系列方法

getTime()：返回实例对象距离1970年1月1日00:00:00对应的毫秒数，等同于valueOf方法。

getDate()：返回实例对象对应每个月的几号（从1开始）。

getDay()：返回星期几，星期日为0，星期一为1，以此类推。

getYear()：返回距离1900的年数。

getFullYear()：返回四位的年份。

getMonth()：返回月份（0表示1月，11表示12月）。

getHours()：返回小时（0-23）。

getMilliseconds()：返回毫秒（0-999）。

getMinutes()：返回分钟（0-59）。

getSeconds()：返回秒（0-59）。

我的肚肚有点儿疼

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
030-Web前端-JS-变量与内置对象

变量和内置对象#6.12 又一个加长版^2^1.变量 2.内存 3.Math对象 4.Date对象1.变量(1)变量提升(2)变量作用域(3)一等公民(4)函数名提升(5)函数内的变量提升(6)*函数参数的默认值(1)变量提升JavaScript引擎的工作方式是，先解析代码，获取所有被声明的变量，然后再一行一行地运行。这造成的结果就是所有的变量的声明语句，都会被提升到代码的头部。javascript的这种读取变量的机制就叫做变量提升。描述：...
复制链接

扫一扫