Jquery高级

最新推荐文章于 2024-04-16 17:00:00 发布

梦里花落知多少、

最新推荐文章于 2024-04-16 17:00:00 发布

阅读量97

点赞数

分类专栏： jquery入门文章标签： Jquery

本文链接：https://blog.csdn.net/primarykey123/article/details/96462728

版权

jquery入门专栏收录该内容

4 篇文章 0 订阅

订阅专栏

1.js中一切都是对象

js中变量，或者函数都是对象，都可以调用方法

var func1 = new Function("a","b","return a+b");
			console.log(func1(1,2));
			func1.age = 18;
			
			console.log(func1);
这里的函数对象也可以添加属性

js中的true 和false

<script type="text/javascript">
			 0,"空字符串",undefined,NaN,null,false(基本数据类型的false)为false,其他值都为true.
			if(5){
				console.log("会打印")
			}
			if("233"){
				console.log("会打印")
			}
			if(NaN){
				console.log("不会打印")
			}
			if(undefined){
				console.log("不会打印")
			}
			var b = new Boolean(false)
			if(b){
				console.log("会打印"+"------")
			}
			
		
		</script>

3.js对象的创建

第一种，通过new的方式创建对象
			var p = new Object()
			p.name="唐三";
			p.age = 18
			console.log(p)
第二种  json格式的创建对象
			var man = {"name":"唐二","age":20}
			console.log(man.age)
			console.log(man["age"])
第三种方式   先声明对象，再创建
			function Person(){}
			var person = new Person()
			person.name ="红渠"
			person.sex="女"
			//给对象添加方法
			person.paly = function(){
				console.log("k快来玩儿啊")
			}
			
			person.paly()
4.删除属性
			delete person.sex
			console.log(person)
5. 遍历对象 获取对象的属性     及拷贝属性的操作
	遍历对象   注意对象的属性分为普通属性和函数属性，需要区分开
function Person(){}
			var p =  new Person()
			p.name ="张三"
			p.age =16
			p.sex = "女"
			p.say = function(){
				console.log("像我这样优秀的人")
			}
			for(var key in p){
				//这样可以直接遍历出来对象的属性
				//console.log(key)
				//这样 可以遍历出属性的值
				//console.log(p[key])
				//如果属性中有函数
				if(typeof p[key] ==  "function"){
					p[key]()
				}else{
					console.log(p[key])
				}
			}
	拷贝属性的操作
	var obj1 = new Object()
			obj1.name = "小李子"
			obj1.age  = 18;
			
			var obj2 = new Object()
			obj2.name = "小王吧"
			obj2.age  = 22;
			obj2. sex = "男"
			obj2.addr = "成都"
			
			console.log(obj1)
			console.log(obj2)
			for (var key in obj2) {
				if(!obj1.hasOwnProperty(key)){
					obj1[key] = obj2[key]
				}
			}
			console.log(obj1)

2.获取json对象的几种方式

 第一种、eval表达式：
			var str = '{"name":"张三","age":18}'
			console.log(str)
			var jsonobj =eval("("+str+")")
			console.log(jsonobj)
第二种方式   window.JSON.parse(jsonStr):必须是标准的json字符串，【使用的最多】
			var jsonobj2 = JSON.parse(str)
			console.log(jsonobj2)
第三种方式    $.parseJSON(jsonStr):
			var jsonobj3 =  $.parseJSON(str)
			console.log(jsonobj3)

3.函数对象
可以给函数对象添加属性，但是函数对象的name 属性为只读，不能给它赋值

var fun = new Function("a","b","a+b")
			fun.age= 18;
			fun.name = "小李飞刀"
			console.log(fun)   //name: "anonymous"
			函数对象的name 属性为只读 ，不能给它赋值
			window.name = "小李"
			console.log(window.name)
			
			var name = "6666"
			默认的name 属性就是windom 的name属性  
			console.log(window.name)//输出6666

4.注意js中this的用法同Java类似，谁调用this就指向谁

改变this的指向的两种方式
			var obj1 = {"name":"悟空"};
			var obj2 = {"name":"八戒"}
			//call（thisObject,args1,args2...） 第一个参数，是调用对象；第2-n个参数是函数需要的参数，一个个的写
　　		//apply（thisObject,[args1,args2]） 第一个参数，是调用对象,第2个参数是函数需要的参数，是一个数组

			//console.log(get.apply(obj2,["xxx","yyy"]));
			console.log(get.call(obj1,"6666","9999"))

5.prototypo 的使用

1.同一个类的prototype【原型】是共享的，可以用来向对象添加属性和方法
2.对象的属性查找，先从对象自定义属性中查找，如果没有找到就从原型中查找此属性
3.对象里面原型属性 --这个原型属性也是一个对象
4.类.prototype.方法名 = function(){}

function Person(name,age){
				this.name = name;
				this.age  = age;
			}
			var p1 = new Person("张三",16)
			var p2 = new Person("李四",18)
			console.log(p1)
			console.log(p2)
			console.log(p1.__proto__ === p2.__proto__) //true ,同一个类的prototype属性(__proto__)时同样的

6.回调函数
如果你把函数的引用（地址）作为参数传递给另一个函数，
当这个引用被用来调用其所指向的函数时，我们就说这是回调函数。
就是先执行代码，然后满足一定的条件后又回来执行另一个函数

常用的两种回调函数
setTimeout(go,3000);
			 
			 function go(){
			 	alert("go!go!go!");
			 }
--------------------------------------------------------			 
ajax 回调  $.get(url,params,callback,type)

7.匿名函数
匿名函数一般作为参数传递给另一函数来使用或赋值给其他变量
三种写法：
(function(){})//推荐写法
~function(){}
+function(){}

作用域污染问题

		var a =2;
		var b = 3;
		var sum = a+b;
		function say123(){
				console.log("你说你说")
		}
	console.log(window)
上面定义的全局变量在使用后任然会存在于window中，这就是作用域污染
使用（）将函数包裹起来就是并且函数没有函数名，这就是匿名函数
		(function(name){
		console.debug("请说出你的名字:" + name);
		}) //注意这里只是申明的函数，没有调用    函数的调用：函数名();
			
		(function(name){
			console.log("请说出你的名字:" + name);
		})("狗子")

8.闭包
指的是语法。简单理解就是：函数中可以使用函数之外定义的变量。一种封装特性

用来计数
			/*var a = 0;
			function total(){
				res = a++;
				return res;
			}
			console.log(total());
			console.log(total());
			//改变a 的值，就会改变函数的结果
			var a = 5;
			console.log(total());
			console.log(total());
			console.log(total());*/
			//跟匿名函数一起使用，实现只读功能
			(function(){
				var a = 0;
				window.go = function(){
					
					return a++;
				}
				
			})();
			console.log(go());
			console.log(go());
			console.log(go());
			//使用匿名函数过后，不会改变计数
			a = 10;
			console.log(go());
			console.log(go());

9.事件委托

selector 事件委托写法
				$("#userForm").on('click','a.del',function(){
					alert('111111111111');
				})

10.事件的注册命名空间
事件的注册空间，就是给一个标签注册多个事件【不常用】

1. $("#btn").click(function()//jQuery对象.事件名
2.$("#btn").bind(‘click’，function()   // jQuery对象.bind unbind取消绑定
3.$("#btn").on(‘click’，function()      // jQuery对象.on off取消绑定	
	 以上三种 方式注册事件，后面两种可以设置取消

11.jQuery的继承
当prototype中的方法不能满足我们的需求时，就需要为它自定义一些方法
【也就是，有时候我们需要扩展功能】
jquery可以通过prototype来扩展功能
jQuery.fn == jQuery.prototype == $.fn

//扩展一个添加标签内容的方法
			$(function(){
				$.fn.addhtml = function(text){
					this.html(text);
				}
				//调用自定义的方法
				//$("#div").addhtml('狗子')
				
				//再设置一个获取值的方法
				$.fn.gethtml = function(){
					return this.html();
				}
				var h = $("#div").gethtml()
				console.log(h)
			})

	<body>
		<div id="div">你是天上的顶顶帽</div>
		
	</body>

梦里花落知多少、

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Jquery高级

1.js中一切都是对象js中变量，或者函数都是对象，都可以调用方法var func1 = new Function("a","b","return a+b"); console.log(func1(1,2)); func1.age = 18; console.log(func1);这里的函数对象也可以添加属性js中的true 和false&l...
复制链接

扫一扫