初识JavaScript(一)

news2024/11/28 9:33:24

文章目录

  • 一、JavaScript介绍
  • 二、JavaScript简介
    • 1.ECMAScript和JavaScript的关系
    • 2.ECMAScript的历史
    • 3.什么是Javascript?
    • 4.JavaScript的作用?
    • 5.JavaScript的特点
  • 三、JavaScript基础
    • 1.注释语法
    • 2.JavaScript的使用
  • 四、JavaScript变量与常量
    • 变量
    • 关键字var和let的区别
    • 常量
  • 五、JavaScript数据类型
    • 1.数值类型(Number)
    • 2.字符类型(String)
      • 常见内置方法
    • 3.布尔值(Boolean)
    • 4.对象(Object)
    • 5.自定义对象
    • 6.数组
      • 数组常用内置方法
  • 六、运算符
    • 算术运算符
    • 比较运算符
    • 逻辑运算符
    • 赋值运算符
  • 七、流程控制
    • 分支结构
    • switch分支
    • 循环结构
      • for循环
      • while循环
      • 三元表达式
  • 八、JavaScript函数
    • 函数的语法
    • 函数的参数传递
    • 匿名函数
    • 箭头函数
    • 函数中的arguments参数
    • JavaScript函数的特点
    • JavaScript函数的全局变量和局部变量
    • 补充知识
  • 九、JavaScript中的内置对象
    • Date对象
    • Json对象
    • RegExp正则对象

一、JavaScript介绍

JavaScript也可以简称为JS,是一种浏览器解释型语言,嵌套在HTML文件中交给浏览器解释执行。主要用来实现网页的动态效果,用户交互及前后端的数据传输等。

JavaScript实际与Java在使用上没有任何关系,但是起源却有些联系,感兴趣可以看看:https://blog.csdn.net/kese7952/article/details/79357868

JS主要负责网页的各式各样的动态功能,因此可以为用户提供更流畅美观的页面浏览效果,以及添加页面交互行为,给用户更好的视觉和使用体验

二、JavaScript简介

1.ECMAScript和JavaScript的关系

​1996年11月,JavaScript的创造者–Netscape公司,决定将JavaScript提交给国际标准化组织ECMA,希望这门语言能够成为国际标准。次年,ECMA发布262号标准文件(ECMA-262)的第一版,规定了浏览器脚本语言的标准,并将这种语言称为ECMAScript,这个版本就是1.0版。

​该标准一开始就是针对JavaScript语言制定的,但是没有称其为JavaScript,有两个方面的原因。一是商标,JavaScript本身已被Netscape注册为商标。而是想体现这门语言的制定者是ECMA,而不是Netscape,这样有利于保证这门语言的开发性和中立性。

​因此ECMAScript和JavaScript的关系是,前者是后者的规格,后者是前者的一种实现。

2.ECMAScript的历史

年份名称描述
1997ECMAScript 1第一个版本
1998ECMAScript 2版本变更
1999ECMAScript 3添加正则表达式添加try/catch
ECMAScript 4没有发布
2009ECMAScript 5添加"strict mode"严格模式添加JSON支持
2011ECMAScript 5.1版本变更
2015ECMAScript 6添加类和模块
2016ECMAScript 7增加指数运算符(**)增加Array.prototype.includes

3.什么是Javascript?

尽管 ECMAScript 是一个重要的标准,但它并不是 JavaScript 唯一的部分,当然,也不是唯一被标准化的部分。实际上,一个完整的 JavaScript 实现是由以下 3 个不同部分组成的:

  • 核心(ECMAScript)(ES5-ES6)规范了JavaScript的基本语法
  • 文档对象模型(DOM) Document object model (整合js,css,html)(提供了一系列操作的文档的方法)
  • 浏览器对象模型(BOM) Broswer object model(整合js和浏览器)(提供了一系列操作浏览器的方法)

一、ECMA Script

  1. ECMAScript是一个标准,JS只是它的一个实现,其他实现包括ActionScript。
  2. “ECMAScript可以为不同种类的宿主环境提供核心的脚本编程能力…”,即ECMAScript不与具体的宿主环境相绑定,如JS的宿主环境是浏览器,AS的宿主环境是Flash。
  3. ECMAScript描述了以下内容:语法、类型、语句、关键字、保留字、运算符、对象。

因此ECMAScript和JavaScript的关系是,前者是后者的标准,后者是前者的一种实现。ECMAScript也可以称为ES

二、DOM

  1. DOM 全称是:Document Object Model,也就是文档对象模型。
  2. DOM 是 W3C 的标准; [所有浏览器公共遵守的标准]
  3. DOM的主要中就是为了操作 HTML 中的元素

三、BOM

  1. BOM 全称是:Browser Object Model,浏览器对象模型。
  2. BOM 是 各个浏览器厂商根据 DOM在各自浏览器上的实现;[表现为不同浏览器定义有差别,实现方式不同]
  3. window 是 BOM 对象,而非 JS 对象;JS是通过访问BOM对象来访问、控制、修改浏览器
  4. 主要作用:可以说,BOM包含了DOM(对象),浏览器提供出来给予访问的是BOM对象,从BOM对象再访问到DOM对象,从而JS可以操作浏览器以及浏览器读取到的文档

简单地说,ECMAScript 描述了JavaScript语言本身的相关内容。
JavaScript一般用来编写页面脚本,来为html页面添加交互行为,是前台语言,而不是后端语言。

  • JavaScript 是一种轻量级的编程语言。
  • JavaScript 是可插入 HTML 页面的编程代码。
  • JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。

4.JavaScript的作用?

​如今,JavaScript 不仅可以在浏览器中执行,也可以在服务端执行,甚至可以在任意搭载了 JavaScript 引擎 的设备中执行。JavaScript 是一种脚本,一门编程语言,它可以在网页上实现复杂的功能,网页展现给你的不再是简单的静态信息,而是实时的内容更新,交互式的地图,2D/3D 动画,滚动播放的视频等等。JavaScript 怎能缺席。它是标准 Web 技术蛋糕的第三层,其中 HTML 和 CSS 我们已经在学习中心的其他部分进行了详细的讲解。

三者之间的作用:

  • HTML是一种标记语言,用来结构化我们的网页内容并赋予内容含义,例如定义段落、标题和数据表,或在页面中嵌入图片和视频。
  • CSS 是一种样式规则语言,可将样式应用于 HTML 内容, 例如设置背景颜色和字体,在多个列中布局内容。
  • JavaScript 是一种脚本语言,可以用来创建动态更新的内容,控制多媒体,制作图像动画,还有很多。(好吧,虽然它不是万能的,但可以通过简短的代码来实现神奇的功能。)

5.JavaScript的特点

  • 解释执行(浏览器就是解释器):事先不编译、逐行执行、无需进行严格的变量声明。
  • 简单易用:可以使用任何文本编辑工具编写,只需要浏览器就可以执行程序。
  • 基于对象:内置大量现成对象,编写少量程序可以完成目标

三、JavaScript基础

1.注释语法

	// 单行注释
	/**/ 多行注释

2.JavaScript的使用

在HTML中有几种引入的方式:

	1.head内script标签内编写
		<script>
			// 在这里写你的JS代码
		</script>

	2.head内script标签src属性引入外部js资源
		<script src="my.js"></script>
		
	3.body内最底部通过script标签src属性引入外部js资源(最常用)


'ps:注意页面的下载是从上往下的 所以操作标签js代码一定要等待标签加载完毕再执行才可以正常运行'

JS的语法规范

JS对换行、缩进、空格并不敏感。
一段JS代码写完记得在末尾加上分号; (当然不写也没问题) ,但是避免日后JS文件压缩导致无法执行的问题所以最好还是写


四、JavaScript变量与常量

​ pycharm创建js文件或者html文件(适合编写较为复杂的js代码),浏览器提供编写js代码的环境

变量

由于JS是一门弱类型、动态语言,所以在定义变量时并不需要提前说明变量类型。

	首先说说可以编写JS代码的地方
		1.浏览器右键检查>>>Console
		2.专门的代码软件

	在JS中声明变量和常量都需要使用关键字来使用
		var(全局有效)					var x = "JavaScript";
		let(如果在局部名称空间中使用 那么仅在局部名称空间中有效) let x = "JavaScript";
	'''
	注意:let关键字是ECMA6推出的新语法,如果你的编辑器支持的版本是5.1那么将无法使用let关键字,
	如果是6.0则向下兼容var、let都可以使用,
	'''
		const(定义常量)					const P = 3.1415
		'真正意义上的常量,不能更改'

	JS也是动态类型:变量名绑定的数据值类型不固定
		var name = "jack";	
		console.log(name) //打印结果为:jack
		name = 'tom';
		console.log(name) // 打印结果为:tom

在这里插入图片描述

变量的命名规范

1、由字母、数字、下划线、$ 组成,但是不能数字开头,也不能纯数字

2、严格区分大小写

3、不能包含关键字和保留字(以后升级版本要用的关键字)。
如:abstract、boolean、byte、char、class、const、debugger、double、enum、export、extends、final、float、
goto、implements、importint、interface、long、native、package、private、protected、public、
short、static、super、synchronized、throws、transient、volatile

4、推荐驼峰命名法:有多个有意义的单词组成名称的时候,第一个单词的首字母小写,其余的单词首字母写

5、匈牙利命名:就是根据数据类型单词的的首字符作为前缀

关键字var和let的区别

var 在for循环里面定义也会影响到全局,let 在局部定义只会在局部生效

	'关键字var'
	var i = 66;
	for (var i = 0; i < 10; i++){
		console.log(i);
	}
	console.log(i); //运行完毕循环后执行打印结果为10

在这里插入图片描述


	'关键字let'
	let n = 88;
	for(let n=0; n < 10; n++){
		console.log(n);
	}
	console.log(n); // 运行完毕循环后执行打印结果为88

在这里插入图片描述


常量

​ python中没有真正意义上的常量 默认全大写就是表示常量。而JS中是有真正意义上的常量。需要关键字声明 : const

	const P = 3.1415;
	P = 3.15; //报错

声明一个常量,声明之后就不能改了

在这里插入图片描述

五、JavaScript数据类型

JS是动态语言:变量里面能够存储数字、字符串等。变量会自动的根据存储内容的类型不同,来决定自己的类型。

变量值刚声明时,如果未赋值,那么默认会存一个值:

	var x; // x的值为undefined:表示未赋值
	
	'声明一个变量名后可以指向任意的数据类型,但是有一些语言中,变量名之间指向一种后续不能更改'
	var x;
	x = 'hello';
	x = 66;
	x = [1,2,3,4];

在这里插入图片描述

1.数值类型(Number)

JavaScript 不区分整型与浮点型,只有一种数字类型,即:number类型。

	var z = 10;
	var y = 12.3;
	var c = 12e5;
	var n = NaN; // Nan表示:not a number 作用与某个值不是数字,但它也是数字类型

	数值类型的一些方法:
		parseint('')	// 转换为整数
		parsefloat('')  // 转换为小数
		typeof 变量名	// 查询数据类型
		NaN:Not a number // 报错不是一个数字

在这里插入图片描述

2.字符类型(String)

字符串是存储字符的变量,即:String类型。
字符串可以是引号中的任意文本。你可以使用单引号或双引号:

	var name1 = 'jack'; //单引号
	var name2 = "tom"; //双引号
	'不可以使用下面这种方式,必须配对使用'
	var name3 = 'oscar";

	typeof name1; // String

	'需要注意的是引号内不能包含外部已经使用的引号'
	var x = 'My name is 'jack''; //报错,引号里面的字符不能包含外部引号
	var x = 'this it's'; //错误写法! 报错

	'不支持三单/双引号'
	var s = '''hello'''; //报错 Uncaught SyntaxError: Unexpected string

1.字符串拼接推荐使用加号

	方法一:字符的拼接 ‘+’
		var a = 'hello';
		var b = 'world';
		var c = a + b;
		console.log(c); //结果为helloworld

	方法二:支持格式化输出
		var name = 'jack';
		var age = 19;
		var user = `my name is ${name} my age is ${age}`;
		console.log(user);
	
	'注意:python 不推荐用加号去拼接,而是join方法'

在这里插入图片描述


常见内置方法

方法说明Python中对应的方法
.length返回长度len()
.trim()移除空白strip()
.trimLeft()移除左边的空白lstrip()
.trimRight()移除右边的空白rstrip()
.charAt(n)返回第n个字符
.concat(value, …)拼接join()
.indexOf(substring, start)子序列位置
.substring(from, to)根据索引获取子序列[]索引取值
.slice(start, end)切片
.toLowerCase()小写lower()
.toUpperCase()大写upper()
.split(delimiter, limit)分割split()

3.布尔值(Boolean)

布尔只有两个值:true、false。即:Boolean类型.
布尔常用在条件判断中。

	JS里面的布尔值类型为boolean(区别于Python中true和false都是小写)
	var x = true;
	var y = false; // (空字符串)0、null、undefined、nan都是false

	typeof x; // boolean

在这里插入图片描述

null与undefined区别

  • null表示值是空的,一般在需要指定或清空一个变量时才会使用,如name=null;
  • Undefined表示当声明一个变量但未初始化时,该变量的默认值是undefined。还有就是函数无明确的返回值时,返回的也是undefined。
    注意:null表示变量的值是空(null可以手动清空一个变量的值,使得该变量变为object类型,值为null),undefined则表示只声明了变量,但还没有赋值。
	var s; // undefined
	
	var name = 'jack';
	name = null; // null 清空了name的值,再次显示出来就是null了表示name变量为空

在这里插入图片描述

4.对象(Object)

对象由花括号分隔。在括号内部,对象的属性以名称和值对的形式 (name : value) 来定义。属性之间由逗号分隔,ps:它与Python内的字典相同:

	var obj = {'name':'jack','age':19};
	typeof obj; // object

对象有两种取值方式

	obj.name; // jack
	obj['name']  // jack

对象的属性值可以存放任意数据类型

	var obj = {'name':'jack','age':19,'hobby':['music','jump','rap']};

此时获取hobby属性的值

	obj.hobby[0]; // music
	JS里面中的所有事物都是对象。(Python也是一切皆对象)
	所有事物都是对象:字符串、数值、数组、函数....,且允许自定义对象。
	JavaScript提供多个内建对象,比如String、Date、Array。对象只是带有属性和方法的特殊数据类型
	
	var a = [12,21,21,333,15];
	typeof a; // object
	console.log(a[1]); // 打印结果为 21

在这里插入图片描述

5.自定义对象

	自定义对象相当于Python中的字典快速的操作数据值
	定义方式1:
		let user = {'name':'jack','password':123}
	定义方式2:
		let d2 = new object()
	自定义对象操作数据值的方式很简单 直接使用句点符就可以直接获取value

在这里插入图片描述

6.数组

​ 数组对象的作用是:使用单独的变量名来存储一系列的值。类似于Python中的列表。

	var a=[123,'jack'];
	console.log(a[1]);  //  jack

数组常用内置方法

方法说明
.length数组的大小
.push(ele)尾部追加元素
.pop()获取尾部的元素
.unshift(ele)头部插入元素
.shift头部移除元素
.slice(start,end)切片操作
.reverse()数据反转
.join(seq)将数组元素连接成字符串
.concat(val,…)链接数组
.sort()排序
.forEach()将数组的每个元素传递给回调函数
.splice()删除元素 并向数组添加新元素
.map()返回一个数组元素调用函数处理后的值的新数组

在这里插入图片描述

1. forEach(function(currentValue, index, arr), thisValue)

参数描述
function(currentValue, index, arr)必需。 数组中每个元素需要调用的函数。 函数参数:参数描述currentValue必需。当前元素index可选。当前元素的索引值。arr可选。当前元素所属的数组对象。
thisValue可选。传递给函数的值一般用 “this” 值。 如果这个参数为空, “undefined” 会传递给 “this” 值
	forEach
		语法:forEach(function(currentValue, index, arr), thisValue)
	
	ll=[111, 222, 333, 444, 555, 666];
	'一个参数就是数组里面每一个元素对象'
	ll.forEach(function(value){console.log(value)},11)
	'两个参数就是元素+元素索引'
	ll.forEach(function(value,index){console.log(value,index)},11)
	'元素+元素索引+元素的数据来源'
	ll.forEach(function(value,index,arr){console.log(value,index,Array)})

在这里插入图片描述


2.splice()

参数描述
index必需。规定从何处添加/删除元素。 该参数是开始插入和(或)删除的数组元素的下标,必须是数字。
howmany必需。规定应该删除多少元素。必须是数字,但可以是 “0”。 如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
item1, …, itemX可选。要添加到数组的新元素
	splice
		语法 splice(index,howmany,item1,.....,itemX)
	
	l1=[111, 222, 333, 444, 555, 666];
	'两个参数,第一个起始位置 第二个是删除的个数'
	l1.splice(0,3); // [111, 222, 333]
	'三个参数 先删除前面指定的参数 在添加后面指定的参数(先删除后添加)'
	l1.splice(0,1,888); // a=[888, 555, 666]
	'先删除指定前面的参数, 在将数组添加到Array内 Array=数组'
	l1.splice(0,1,[111,222,333,444]); // [Array(4), 555, 666]  Array(4)=[111, 222, 333, 444]

在这里插入图片描述


3.map()

参数描述
function(currentValue, index,arr)必须。函数,数组中的每个元素都会执行这个函数 函数参数: 参数描述currentValue必须。当前元素的值index可选。当期元素的索引值arr可选。当期元素属于的数组对象
thisValue可选。对象作为该执行回调时使用,传递给函数,用作 “this” 的值。 如果省略了 thisValue ,“this” 的值为 “undefined”
	map
		语法:map(function(currentValue,index,arr), thisValue)

	var l2=[11,22,33,44,55];
	l2.map(function(value){console.log(value)},l2);
	11
	VM4761:1 22
	VM4761:1 33
	VM4761:1 44
	VM4761:1 55
	
	l2.map(function(value,index){
	    return value*2},l2);
	(5) [22, 44, 66, 88, 110]
	
	l2.map(function(value,index,arr){
	    return value*2},l2);
	(5) [22, 44, 66, 88, 110]

在这里插入图片描述

六、运算符

算术运算符

	+ - * / % ++(自增1) --(自减1)
    var x=10;
    var res1=x++;  加号在后面	先赋值后自增
    var res2=++x;	加号在前面	 先自增后赋值

比较运算符

	!=(值不等 弱) ==(值相等 弱) ===(值相等 强) !==(值不等 强)
	ps:会不会自动转换类型
	
	1 == '1' // true  弱等于
	1 === '1'  // false 强等于
	//上面这张情况出现的原因在于JS是一门弱类型语言(会自动转换数据类型),
	所以当你用两个等号进行比较时,JS内部会自动先将
	
	//数值类型的1转换成字符串类型的1再进行比较,
	所以我们以后写JS涉及到比较时尽量用三等号来强制限制类型,防止判断错误

逻辑运算符

	&&()	||()  !()

赋值运算符

	= += -= *= /=

在这里插入图片描述

七、流程控制

分支结构

	1.if分支
		if(条件){条件成立之后执行的代码}
		
	2.if...else分支
		if(条件){
			条件成立之后执行的代码
		}else{
			条件不成立执行的代码
		}
		
	3.if...else if ....else分支
		if(条件1){
			条件1成立之后执行的代码
		}else if(条件2){
			条件1不成立条件2成立执行的代码
		}else{
			条件1,2不成立之后执行的代码
		}



	var x=10;
    if(x>5){console.log('yes')}

    //分支结构之双分支
    if(x>5){
        console.log('yes');
    }else{
        console.log('no');
    }

    //分支结构之多分支
    if(x>5){
        console.log('x>5');
    }else if(x<5){
        console.log('x<5');
    }else{
        console.log('x=5');
    }

	'如果分支结构中else if很多还可以考虑使用switch语法'

在这里插入图片描述

switch分支

	switch(){
		case 条件1:
		    条件1成立执行的代码;
			break;  # 如果没有break,就会基于某个case条件一直往下执行
		    case 条件2:
		    	条件2成立执行的代码;
		    	break
		case 条件3:
			条件3成立执行的代码;
		      	 break;
		case 条件4:
			条件4成立执行的代码;
		        break;
		   defualt:
		      条件都不满足执行的代码
	}


	var day = new Date().getDay();
    switch(day){
        case 0:
            console.log('Sunday');
            break;
        case 1:
            console.log('Monday');
            break;
        default:
            console.log('...');
    }

在这里插入图片描述

循环结构

for循环

	for(起始条件;循环条件;条件处理){
		循环体代码
	}
	
	1.for 循环列表
	for(let i=0;i<10;i++){
		console.log(i);
	}
	
	2.for 循环字典
	let dd = {'name':'jason','age':18}
	      for(let k in dd){
	      	console.log(k);
	      }
	
	      for(let k in dd){
	      	console.log(dd[k]);
	      };

在这里插入图片描述

while循环

	while循环
		while(循环条件){
	        循环体代码
	    }

	eg:
	    var i = 0;
	    while (i < 10) {
	      console.log(i);
	      i++;
	    }

在这里插入图片描述

三元表达式

	'Python中的三元运算'1 if 条件 else2
	res = 1 if 1>2 else 3
	
	条件成立取	 1
	条件不成立取	3

	'JavaScript中的三元运算'
	JS中: 条件?值1:2

	eg1:
		res = 1>2?1:3
		条件成立	取问号后面的1
		不成立		 取冒号后面的3
	    
	eg2:
	var a = 1;
	var b = 2;
	var c = a > b ? a : b;
//这里的三元运算顺序是先写判断条件a>b再写条件成立返回的值为a,条件不成立返回的值为b;三元运算可以嵌套使用;
	var a=10,b=20;
	var x=a>b ?a:(b=="20")?a:b;
	x=10

在这里插入图片描述

八、JavaScript函数

函数就是将代码存储在一个容器内,当我们需要时就可以直接调用,然后执行里面的代码块。

函数的语法

	语法:
		function 函数名(形参){
			函数体代码;
			return 返回值
		}
	
	function index(){
        console.log('helloworld');
    }

    index(); //调用这个函数

函数的参数传递

我们可以让函数接收外部调用时传递参数,然后函数可以拿着传递进来的参数执行。

	function func(a,b){
        if(a>b){
            return a; // 返回值给这个函数的调用者
        }else{
            return b;
        }
    }

    var res = func(10,20); // 定义一个变量,接收调用函数时函数的返回值
    console.log(res);

	参数的个数不需要一一对应 如果想限制参数个数需要使用内置关键字arguments
	'并且JavaScript函数中只有形参和默认参数,没有关键字参数'
	function func(a, b){
		if(arguments.length===2){
			console.log(a, b) 
    	}else{
      		console.log('需要传对应的个数参数!!!')
	   }
	}

在这里插入图片描述

注意:JavaScript函数只能返回一个值,如果要返回多个值,那么就先将它们放入到数组或者对象内,然后再进行返回。

匿名函数

	Js里面的匿名函数
		定义格式:
			var sum = function(a,b){
				return a+b
			}	
			sum(1,2);
			
	除了匿名函数还有立即执行函数 书写立即执行的函数,首先先写两个括号()()这样防止书写混乱
			(function(a, b){
			  return a + b;
			})(1, 2);

在这里插入图片描述

箭头函数

	var f = v => v;
	var f = fuction(v){
		return v
	}

	eg1:
	    var f = () => 5; //箭头函数不需要参数
	    var f = function(){return 5};
	
	eg2:
	    var sum = (num1, num2) => num1 + num2; //需要多个参数
	    var sum = function(num1, num2){
	      return num1 + num2;  
	      ////这里的return只能返回一个值,如果想返回多个值需要自己手动给他们包一个数组或对象中
	    }

在这里插入图片描述

函数中的arguments参数

		函数中的arguments参数
		function add(a,b){
		  console.log(a+b);
		  console.log(arguments.length);
		 console.log(arguments[0]);//arguments相当于将出传入的参数全部包含,这里取得就是第一个元素1
		}

在这里插入图片描述

JavaScript函数的特点

  1. JS中函数的形参与实参个数可以不对应,传少了缺少的那个变量就是undefined,传多了多余的不用接收
  2. 函数体代码中有一个关键字arguments用来接收所有的实参
  3. 函数的返回值如果有多个需要自己处理成一个整体

JavaScript函数的全局变量和局部变量

局部变量:

在JavaScript函数内部声明的变量(使用 var)是局部变量,所以只能在函数内部访问它(该变量的作用域是函数内部)。只要函数运行完毕,本地变量就会被删除。

全局变量:

在函数外声明的变量是全局变量,网页上的所有脚本和函数都能访问它。

变量生存周期:

JavaScript变量的生命期从它们被声明的时间开始。
局部变量会在函数运行以后被删除。
全局变量会在页面关闭后被删除。

作用域

首先在函数内部查找变量,找不到则到外层函数查找,逐步找到最外层。与python作用域关系查找一模一样

例子

	var city = 'shanghai';
    function func(){
        var city = 'beij';
        function inner(){
            var city = 'shenzhen';
            console.log(city);
        }
        inner();

    }

    func();


    //
    var city1 = 'beij';
    function bar(){
        console.log(city1);
    }
    function func1(){
        var city='shanghai';
        return bar;
    }
    var ret = func1();
    ret();


    //
    var city2 = 'beij';
    function func3(){
        var city2 = 'shanghai';
        function inner(){
            console.log(city2);
        }
        inner();
    }

    var res1 = func3();
    res1();

补充知识

词法分析:JavaScript中在调用函数的那一瞬间,会先进行词法分析

词法分析的过程:

当函数调用的前一瞬间,会先形成一个激活对象:Avtive Object(AO),并会分析以下3个方面:

1:函数参数,如果有,则将此参数赋值给AO,且值为undefined。如果没有,则不做任何操作。
2:函数局部变量,如果AO上有同名的值,则不做任何操作。如果没有,则将此变量赋值给AO,并且值为undefined。
3:函数声明,如果AO上有,则会将AO上的对象覆盖。如果没有,则不做任何操作。

函数内部无论是使用参数还是使用局部变量都到AO上找。

	eg:
    var age = 18;
    function foo(){
      console.log(age);
      var age = 22;
      console.log(age);
    }
    foo();  // 问:执行foo()之后的结果是? 22


	eg:
	    var age = 18;
	    function foo(){
	      console.log(age);
	      var age = 22;
	      console.log(age);
	      function age(){
	        console.log("呵呵");
	      }
	      console.log(age);
	    }
	    foo();  // 执行后的结果是?

在这里插入图片描述

九、JavaScript中的内置对象

		类似于python中的内置函数或者内置模块
		固定语法
			var 变量名 = new 内置对象名();

Date对象

		Date对象方法
		var d = new Date(); 
		//getDate()                 获取日
		//getDay ()                 获取星期
		//getMonth ()               获取月(0-11//getFullYear ()            获取完整年份
		//getYear ()                获取年
		//getHours ()               获取小时
		//getMinutes ()             获取分钟
		//getSeconds ()             获取秒
		//getMilliseconds ()        获取毫秒
		//getTime ()                返回累计毫秒数(1970/1/1午夜)

在这里插入图片描述

		获取当前时间练习 按照年月日时分星期几格式输出
		const WEEKMAP = {  
			  0:"星期天",
			  1:"星期一",
			  2:"星期二",
			  3:"星期三",
			  4:"星期四",
			  5:"星期五",
			  6:"星期六"
			};  //定义一个数字与星期的对应关系对象
		
		function showTime() {
		    var d1 = new Date();
		    var year = d1.getFullYear();
		    var month = d1.getMonth() + 1;  //注意月份是从0~11
		    var day = d1.getDate();
		    var hour = d1.getHours();
		    var minute = d1.getMinutes() < 10?"0"+d1.getMinutes():d1.getMinutes();  //三元运算
		
		    var week = WEEKMAP[d1.getDay()];  //星期是从0~6
		
		    var strTime = `
		    ${year}-${month}-${day} ${hour}:${minute} ${week}
		    `;
		    console.log(strTime)
		};		

在这里插入图片描述

Json对象

		Json对象
		Js里面Json序列化关键词
			Json.stringify()
			Json.parse()
		var str1 = '{"name": "Alex", "age": 18}';
		var obj1 = {"name": "Alex", "age": 18};
		// JSON字符串转换成对象
		var obj = JSON.parse(str1); 
		// 对象转换成JSON字符串
		var str = JSON.stringify(obj1);

在这里插入图片描述

RegExp正则对象

	RegExp正则对象
		语法方式1:
			var reg1 = new RegExp("正则表达式");
		语法方式2:
			var reg1 = new RegExp("正则表达式");
		var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9]{5,11}");
		var reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/;

		reg1.test('Lebron666')
		reg2.test('Lebron666')

		var s1 = 'meijinisdashuaige';
		var s2= /^[a-zA-Z][a-zA-Z0-9]{5,9}$/g
	
		s2.test('meijin')
		s2.test('mjdashuaige')

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1160253.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

苹果AirTag固件更新

苹果公司针对其热销的物品追踪器 AirTag 于今天发布了新的固件更新&#xff0c;最新版本号为 2A61&#xff0c;但是这次更新苹果并未提供发布说明&#xff0c;所以目前还不知道这次更新有什么新内容。 关于这次更新&#xff0c;用户无法自己手动更新 AirTag 固件&#xff0c;因…

5.1 运输层协议概述

思维导图&#xff1a; 前言&#xff1a; 第5章 运输层笔记 1. 概览 主要内容&#xff1a;介绍运输层协议的特点、进程间通信、端口、UDP和TCP协议、可靠传输、TCP报文段的首部格式、TCP的关键概念&#xff08;如滑动窗口、流量控制、拥塞控制和连接管理&#xff09;。重要性…

自定义类型结构体(上)

目录 结构体类型的声明结构体的概念结构体的声明特殊的声明结构的自引用 结构体变量的创建和初始化结构成员访问操作符 感谢各位大佬对我的支持,如果我的文章对你有用,欢迎点击以下链接 &#x1f412;&#x1f412;&#x1f412; 个人主页 &#x1f978;&#x1f978;&#x1…

linux下df -h 命令一直卡住的解决方法

在Linux中&#xff0c;偶尔遇到用 df -h 查看磁盘情况时&#xff0c;一直卡住无法显示结果。 解决方法&#xff1a; 1、首先使用strace追踪到底执行到哪里卡住 $ strace df -h 2、如果没有strace命令则进行安装 $ yum install strace -y 3、显示出卡住的地方&#xff0c;如…

[0xGame 2023 公开赛道] week4 crypto/pwn/rev

最后一周结束了&#xff0c;难度也很大&#xff0c;已经超出我这认为的新生程度了。 crypto Orac1e 先看题&#xff0c;题目先是给了加密过的flag然后提供不限次数的解密&#xff0c;不过仅提供解密后unpad的结果。 from Crypto.Util.number import * from Crypto.Cipher i…

WinCC7.5 将归档数据打印到MSHGrid(不是MSFlexGrid控件)

参考网址&#xff1a;https://www.cnblogs.com/fishingsriver/p/14397431.html 新建变量 MSHGrid控件 查询按钮 Sub OnClick(ByVal Item) Dim myCatalog,myDS,PCN…

【python】路径管理+路径拼接问题

路径管理 问题相对路径问题绝对路径问题 解决os库pathlib库最终解决 问题 环境&#xff1a;python3.7.16 win10 相对路径问题 因为python的执行特殊性&#xff0c;使用相对路径时&#xff0c;在不同路径下用python指令会有不同的索引效果&#xff08;python的项目根目录根据执…

【嵌入式】HC32F07X CAN通讯配置和使用配置不同缓冲器以连续发送

一 背景说明 使用小华&#xff08;华大&#xff09;的MCU HC32F07X实现 CAN 通讯配置和使用 二 原理分析 【1】CAN原理说明&#xff08;参考文章《CAN通信详解》&#xff09;&#xff1a; CAN是控制器局域网络(Controller Area Network, CAN)的简称&#xff0c;是一种能够实现…

公司上网行为监控能监控到什么

公司上网行为监控是一个备受关注的话题&#xff0c;它可以监控员工的网络行为&#xff0c;保护企业的机密和数据安全。但是&#xff0c;这种监控行为也会涉及到员工的隐私权和数据安全问题。 公司上网行为监控能监控到什么&#xff1a; 1、访问网站精确到员工信息、计算机名称…

uni-starter 使用常见问题

1. Invalid uni-id config file 没有找到uni-id文件导致 需要在uniCloud-aliyun/cloudfunctions/common/uni-config-center/uni-id/下新建 config.json 如果没有uni-id 就新建一个。 注意&#xff1a;config.json是一个标准json文件&#xff0c;不支持注释 uni-starter 按照…

git简单介绍,回车换行问题,倒计时+进度条小程序的实现+代码

目录 git--版本控制工具 介绍 使用 小程序 引入 回车换行问题 缓冲区问题 倒计时 分析 代码 进度条 分析 代码 git--版本控制工具 首先,我们需要下载git : yum install git 介绍 Git是一种分布式版本控制系统&#xff0c;用于跟踪文件和目录的变化并协调多个人之…

ACID模型

ACID 是数据库管理系统&#xff08;DBMS&#xff09;中用来确保事务处理正确性和可靠性的四个特性的首字母缩写。ACID 是指原子性&#xff08;Atomicity&#xff09;、一致性&#xff08;Consistency&#xff09;、隔离性&#xff08;Isolation&#xff09;和持久性&#xff08…

亚马逊美国站书包,书皮,便当盒,铅笔盒CPC认证

在人们生活中学习用品的种类十分丰富&#xff0c;并且随着社会经济以及现代电子科技的飞速发展&#xff0c;传统的学习用品已经不能满足人们对学习用品的需求&#xff0c;电子学习用品异军突起&#xff0c;受到了越来越多年轻人的青睐。我国庞大的学习用品消费群体每年用于购买…

字体文件名称成中的Bold, Light,Italic,Regular, Medium是什么意思?

解释 字体文件名&#xff1a; IntelOneMono-Bold.ttf其中IntelOneMono字体名称 Bold 字体的样式 .ttf字体后缀 样式英文 中文Bold粗体BoldItalic粗体斜体Italic斜体Light细体LightItalic斜细体Medium中等MediumItalic中等斜体Regular标准以下来自鸿蒙字体以下来自鸿蒙字体TC…

CSS标点符号换行问题

最近遇到一个奇怪的现象,元素中中文文本正常显示,但是加了一堆符号后中文文本居然换行了. div{width: 200px;border: 1px solid blue;word-break: break-all;} <div>文本</div>经过研究发现&#xff0c;因为标点符号不允许出现在行首和行尾&#xff0c;连带着符号…

【Linux】第八站:gcc和g++的使用

文章目录 一、解决sudo命令的问题二、Linux编译器-gcc/g1.gcc的使用2.g的使用 三、gcc编译链接过程1.预处理2.编译&#xff08;生成汇编&#xff09;3.汇编&#xff08;生成机器可识别代码&#xff09;4.链接&#xff08;生成可执行文件或库文件&#xff09;5.一些选项的意义 四…

Serverless与AI驱动,阿里云数据库核心能力全面升级!

11月1日&#xff0c;2023杭州云栖大会上&#xff0c;阿里云瑶池数据库宣布已全面实现Serverless化&#xff0c;并接入通义等大模型能力&#xff0c;大幅提升数据库一站式及智能化水平。同时&#xff0c;PolarDB Always On系列推出3大重磅升级&#xff0c;首个数据智能助手DMS C…

阿里云2核2G3M云服务器99元/年,新老同享,续费不涨价!

2023年阿里云双11活动正在火热进行中&#xff0c;推出了一款面向个人开发者、学生、小微企业的年度爆款套餐&#xff0c;2核2G3M云服务器99元/年&#xff0c;新老同享&#xff0c;续费不涨价&#xff01; 一、活动入口 活动地址&#xff1a;传送门>>> 二、活动详情 …

【标准化封装 钽电容封装】Tantalum Capacitors 各种壳

〇、引言 钽电容你见到的是什么封装&#xff1f;7343&#xff1f;那是D壳还是E壳&#xff1f; 有没有PCB焊接调试好&#xff0c;结构缺盖不住盖子了&#xff1f;&#xff1f;&#xff1f; 一、正文 上图片 这个叫黑钽 这个叫黄钽 这个叫啥我也不知道 二、封装 典型厂家壳…

stm32 定时器中断

目录 定时器分类 通用定时器框图 时钟源 内部时钟&#xff08;CK_INT&#xff09; 外部时钟模式 1&#xff08; TI1、 TI2&#xff09; 时钟信号输入引脚 滤波器 如果来自外部的时钟信号的频率过高或者混杂有高频干扰信号的话&#xff0c;我们就需要使用滤波器对信号重新…