IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> javaScript基础2 -> 正文阅读

[JavaScript知识库]javaScript基础2

  • 运算符
1】赋值运算符
	=2】算术运算符
	和java基本相同(+ - * / % ++ --)
【3】位运算符
	&(与) |(或) ~(非) ^(异或)
	<<(左位移) >>(右位移) >>>(无符号右移)
【4】加强的赋值运算符
	+=	-=	*=	/=	%=	|=	^=
	<<=		>>=		>>>=5】比较运算符
	>	>=	<	<=	!=	==
	!==(严格不等于)		===(严格等于)这两种除了判断值,还会比较数据类型
【6】逻辑运算符
	&& || !7】三目运算符
	表达式 ? a : b
【8】逗号运算符
	允许将多个表达式排在一起,整个表达式返回最右边表达式的值
	eg:
		a = (b=5,c=7,d=56);
		最终 a = 569void运算符
	强行指定表达式不会返回值
	eg :a = void(b=5,c=7,d=56);
		a最终为undefined10typeofinstanceof运算符
	(1typeof会返回以下值
		undefinedundefined
		null值 object
		布尔值 boolean
		数值类型 number
		字符串值 string
		对象 object
		函数 function2instanceof判断某个变量是不是某个类的实例
  • 语句
1.语句块
{
	...;
	...;
	......;
}
2.空语句
;
3.异常抛出语句
//js所有的异常都是Error对象,一旦遇到异常,会立即寻找catch块,若没有,异常会传播给浏览器,程序会非正常终止。
throw new Error('....');
4.with语句
//主要用于避免重复书写同一个对象
eg:
	document.writeln("a");
	document.writeln("b");
	document.writeln("c");
	使用with语句后:
	with(document){
		writeln("a");
		writeln("b");
		writeln("c");
	}
	
  • 流程控制
1.分支
	if ...else if ....else...
	switch(expression){
		case a : ...  break;
		case b : ...  break;
		case c : ...  break;

		default: ....
	}
2.循环
	while
	do while
	for
	for in 
		for(index in object){
			...
		}
3. break , continue
  • 函数
1)定义命名函数
	function functionName(param1,param2...){
	}2)定义匿名函数(有点类似java的匿名内部类
	function(paramter list){
		...
	}; //注,有;号
	eg:
		var f = function(name){
			document.wirteln(name);
		};
		可以使用 f("tom");调用函数
(3)使用Function类匿名函数
	var f = new Function("name","语句1;" + "语句2;");
	f("name");4)递归函数
	var f = fuction(n)
	{
		if( n == 1){
			return 1;
		}
		else{
			return n * f(n-1);
		}
	}5)注:js中的函数不仅仅是一个函数,还是一个类。该函数还是此类的唯一构造器。
	只要在调用函数时使用new关键字,就可以返回一个对象。这个Object不是函数的返回值,而是函数本身产生的对象。
	根据函数中声明变量的方式,函数中的变量有三种:
		局部变量:在函数中以var定义的变量
		实例属性:在函数中以this前缀修饰的变量
		类属性:在函数中以函数名前缀修饰的变量
		eg:
		function E(a,b){
			//实例属性
			this.a = a;
			//类属性,类属性必须通过函数本身来访问,且是静态的
			E.b = b;
			//局部变量
			var c = "c";
		}
	js中允许随时给对象增加属性和方法,当直接为对象的某个属性赋值时,即可视为给对象增加属性
		eg:
		e1 = new E(3,"12");
		e1.b = "21";
		//因为在函数E中b是一个类属性,它的对象是没有该属性的,此时上述语句就是为对象e1增加了一个b属性。6)调用函数的三种方式:
	直接调用
	call()
	apply()7)函数的独立性
	虽然定义函数时可以将函数定义成某个类的方法,或者定义成某个对象的方法。但是js函数是“一等公民”,它永远是独立的,不会从属其他类、对象。
(8)函数提升
	js允许先调用函数,再定义函数。函数的定义会被提升到顶部。

	使用匿名函数时,只会提升被赋值的变量,不会提升函数的定义。
		<script type="text/javascript">
			console.log(add(1,2));
			
			var add = function(a,b){
				console.log("执行add函数");
				return a + b;
			}
		</script>
	执行上述代码会报错 UncaughtTypeError: add is not a function9)箭头函数,相当于lambda表达式或闭包语法:
	(param1,param2....) => {statements}
	箭头函数没有自己的this,箭头函数中的this代表包含箭头函数的上下文,和java有点类似。
(10)js中参数的传递和java一样也是值传递方式,传入函数中的不是实参本身,而是副本,在函数中修改参数的值不会影响实参。
(11)空参数
	js定义的函数就算带参数,也可以传空参数,但是会将参数值自动设置为undefined
	js中没有方法的重载,函数名是函数的唯一标识,如果定义不同参数列表的同名函数,后面的函数会覆盖前面的函数。
(12)参数类型
	js函数中无需传入参数的类型,但是这也存在隐患。因为参数可能是任意类型的。
	所以函数中执行后续操作的时候因该先判断参数类型是不是符合要求
	eg:
		function changeAge(person){
			//要求调用函数传入的eperson参数是对象,且它的age属性是数值
			if(typeof person  == 'object' && typeof person.age == 'number'){
					...
			}else{
				//报错
			}
		}
  • js的面向对象
1.js中的每个函数都可用于创建对象,该对象既是该类的实例,也是Object的实例。
	eg:
		<script type="text/javascript">
			function Person(name){
				this.name = name;
			}
			
			var p = new Person("tom");
			
			if(p instanceof Person)
				document.writeln("p是Person的实例<br />");
			if(p instanceof Object)
				document.writeln("p是Object的实例");
		</script>
		最后两句都会输出
2.js不允许开发者指定类与类之间的继承关系。但这些类都是Object的子类。
3.对象和关联数组
	【1】js对象本质上是一个关联数组,或者说更像java的Map数据结构,由一组key-value组成
	【2】js对象中的value不仅仅是值(包含基本类型的值和复合类型的值),还可以是函数。
		value是值的时候,value就是对象的属性。value是函数的时候,就是该对象的方法。
	【3】访问js某个对象的属性时,除了使用obj.propName的形式,还可以使用obj[propName],有时只能使用obj[propName]的形式。
		eg:
			<script type="text/javascript">
			function Person(name , age){
				this.name = name;
				this.age = age;
				this.info = function()
				{
					alert('info method');
				}
			}
			
			var p = new Person('tom' , 22);
			//循环遍历p对象的属性
			for(propName in p){
				document.writeln('p对象的' + propName + 
				"属性值为" + p[propName] + "<br />")
			}
		//因为在上述遍历中,使用的循环计数器是对象的属性名。所以程序必须根据属性名来访问Person对象的属性
		//如果采用p.propName的形式访问,程序试图访问Person对象的propName属性,但实际Person对象没有该属性。
4.继承和prototype
	【1】js所有的对象都是Object的子类,类之间是平级关系。
	【2】js是一种动态语言,允许自由地为对象增加属性和方法,当为对象不存在的属性赋值时,即可认为是增加对象的属性。
	【3】js中定义一个函数就是定义了一个同名的类,且该函数就是该类的构造器。
	【4】如下在函数定义(类定义)中直接为函数定义方法,存在弊端
		<script type="text/javascript">
			function Person(){
				var locVal = 'dododo';
				this.info = function(){
					//此处会形成闭包,导致局部变量的作用域扩大,在函数外还能访问
					document.write("locVal的值为: " + locVal);
					return locVal;
				}
			}
			
			var p = new Person();
			//在函数外仍可以访问局部变量locVal
			var val = p.info();
			
			alert(val);
		</script>1)性能低下:每次创建Person的实例时,都会新创建一个info函数,实际上只需要一个info函数,创建多个对象时系统就会存在多个info函数,造成系统泄漏。
	(2)闭包问题:见上述代码中的注释。
	【5】为了解决上面的问题,建议使用prototype属性
		js所有的函数,也就是类都有一个prototype属性
		为类的prototype属性增加属性和方法,就可视为对原来类的扩展,相当于一种继承。
		eg:
			<script type="text/javascript">
			function Person(name){
				this.name = name;
				this.info = function(){
					document.write("姓名:" + this.name + "<br />");
				}
			}
			
			var p1 = new Person('tom');
			p1.info();
			//此时p1还没有walk方法
			//p1.walk();
			//使用prototype属性,给Person增加一个walk方法
			Person.prototype.walk = function(){
				document.write(this.name + '窝嫰叠...<br />');
			}
			
			document.write('<hr />');
			var p2 = new Person("jay");
			p2.info();
			p2.walk();
			
			//由于js允许动态为类增加属性或者方法,现在p1也有了walk方法。
			p1.walk();
		</script>6】prototype属性为js提供了一种伪继承,实质上是修改了原有的类,并不是产生了一个新的子类。
	就像上面的例子,那个原来没有的walk方法的类不复存在。
	【7】建议在类定义结束后,立马增加函数的需要的属性或者方法,以免造成混乱。
	【8】将一个类的prototype属性设置成另一个类,就可以继承另一个类,得到它的属性和方法。实现java中的继承。
	【9】构造器、apply、call实现伪继承。
  • 创建对象
1.js对象是一个特殊的数据结构。(关联数组),创建对象是并不是总需要先创建类。
  js中创建对象可以不使用任何类。
2.创建对象的方式:
	【1new 调用构造器
	【2】使用Object3】JSON语法
	eg:
	<script type="text/javascript">
			//1使用new创建对象
			function Person(name){
				this.name = name;
			}
			
			var p1 = new Person('tom');
			document.writeln(p1.name + "<br />");
			
			//使用Object创建对象
			var obj = new Object(); 
			//这是一个空对象,没有任何属性和方法,后续可以动态增加
			obj.name = 'jay';
			document.writeln(obj.name + "<br />");
			
			//使用JSON语法创建对象
			var p = {
				//普通属性
				name: 'golf',
				age: 28,
				//对象属性
				son : {
					name: 'go',
					age: 2
				},
				//为p增加方法
				info: function(){
					document.writeln( this.name + "   " + this.age + "<br />");
				},
				//定义数组
				gril: [
					{
						ad : 'beijing'
					},
					{
						ad : 'xian'
					}
				]
			};
			
			p.info();
			document.writeln(p.son.name + ">>>>" + p.son.age + "<br />");
			document.writeln(p.gril[0].ad + "------" + p.gril[1].ad + "<br />");
		</script>
  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-07-16 11:11:21  更:2021-07-16 11:11:56 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年5日历 -2024/5/20 7:02:27-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码