前端常用的库和实用技术之JavaScript高级技巧
javascript高级技巧
变量作用域和闭包
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
// js是函数级作用域，在内部的变量内部都能访问，外部不能访问内部的，内部能访问外部的
test();
var j;
j = 1000;
function test(){
if(false){
var i=10;
}else{
var t =100;
}
console.log('bbb',t);
console.log('cccc',j);
}
alert('....',t);
</script>
<script>
var j = 100;
~(function test(){
console.log(j);
})();
//100
//-1
</script>
<script>
var j =100;
function test(){
var j;
alert(j);//拿不到外面的J，里面的j值，war在前面
j=10
}
//执行test()根本取不到
test()
</script>
<script>
//闭包：闭包就是拿到本不属于它的东西
var j = 100;
function test(){
var j;
j = 10;
var k = 666;
return function(){
return k;
}
alert(j);
}
var t = test()();
alert(t);
</script>
</body>
</html>
this指针的使用
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
// window.m = 100;
// // this指针的使用
// function test(){
// alert(this.m);
// }
// window.test();
this.m = 1000;
var obj = {
m:100,
test:function(){
alert(this.m);
return function(){
alert(this.m);//
}
}
}
// 谁调指向谁
var t = obj.test()
window.t();
//上面等同于
// (obj.test()) ();
</script>
</body>
</html>
<script>
this.a = 1000;
function test(){
this.a = 1;
}
test.prototype.geta = function(){
return this.a;
}
var p = new test;
console.log(p.geta);
</script>
<script>
function test(){
this.a = 1;
}
test.prototype.a = 100;
var p = new test;
console.log(p);
</script>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<input type="button" id="test" value="test" style="color:red;">
<script>
var style = {
color:"green"
}
window.test();
document.getElementById("test").click = test;
function test(){
alert(this.style.color);
}
</script>
</body>
</html>
按值传递和按引用传递
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
function test(num){
//这里对num 创建了一个内存的副本
var num = num+1;
return num;
}
var num = 1;
alert(test(num));
alert(num);
</script>
<script>
function test(obj){
obj.age = "20"
console.log('内部obj',obj);
}
var obj = {
name:'xiaoming'
}
test(obj);
console.log('外部的..',obj);
</script>
</body>
</html>
by上面的例子其实不够经典也不够高级
本文看自前端常用的库和实用技术之JavaScript按值传递和按引用传递
前端常用的库和实用技术之JavaScript高级技巧的更多相关文章
- 前端常用的库和实用技术之JavaScript多线程
多线程概念: 多线程是指从软件或硬件上实现多个线程并发执行的技术.具有多线程能力的计算机因有硬件支持而能够在 同一时间执行多于一个线程,进而提升整理处理性能.具有这种能力的系统包括对称多处理机,多核心 ...
- 前端常用的库和实用技术之JavaScript面向切面编程
Aspect Oriented Programming(AOP)面向切面编程是一个比较热门的话题. AOP主要实现的目的是针对业务处理过程中的切面进行提取,它所面对的是处理过程 中的某个步骤或阶段,以 ...
- 前端常用的库和实用技术之JavaScript高级函数
1.惰性载入函数 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- 前端常用的库和实用技术之JavaScript 模块化
模块化概念 AMD是requirejs在推广过程中对模块化定义的规范化产出. 异步加载模块,依赖前置,提前执行 Define定义模块define(['require','foo'],function( ...
- javascript功能插件大集合 前端常用插件 js常用插件
转载来源:https://github.com/jobbole/aw... 包管理器管理着 javascript 库,并提供读取和打包它们的工具.•npm – npm 是 javascript 的包管 ...
- python进阶05 常用问题库（1）json os os.path模块
python进阶05 常用问题库(1)json os os.path模块 一.json模块(数据交互) web开发和爬虫开发都离不开数据交互,web开发是做网站后台的,要跟网站前端进行数据交互 1.什 ...
- Python常用的库简单介绍一下
Python常用的库简单介绍一下fuzzywuzzy ,字符串模糊匹配. esmre ,正则表达式的加速器. colorama 主要用来给文本添加各种颜色,并且非常简单易用. Prettytable ...
- WEB前端常用网站收集
WEB前端常用网站收集整理 w3school.w3schools 前端里.脚本之家.素材家园 17素材.frontopen NEC更好的CSS方案.一些常用的JS实例 Bootstrap 官网 h ...
- Vue-ui常用组件库整理
Vue-ui常用组件库整理 查看全部整理内容==> element-ui Element 是由饿了么UED设计.饿了么大前端开发的一套基于 Vue 2.0 的桌面端组件库. 这款是我用了很久的, ...
随机推荐
- 前端（十四）—— JavaScript常用类：Number、Date类、字符串、数组、Math类、正则
JS常用类:Number类.Date类.Math类.字符串.数组.正则 一.Number 1.常用数字 整数:10 小数:3.14 科学计数法:1e5 | 1e-5 正负无穷:Infinity | - ...
- MySQL数据库（一）—— 数据库介绍、MySQL安装、基础SQL语句
数据库介绍.MySQL安装.基础SQL语句 一.数据库介绍 1.什么是数据库 数据库即存储数据的仓库 2.为什么要用数据库 (1)用文件存储是和硬盘打交道,是IO操作,所以有效率问题 (2)管理不方便 ...
- 【三】Jmeter接口自动化测试系列之Http接口自动化实战
作者:大虫 本文介绍 Jmeter 工具的 http 接口 自动化测试 实战! 为了通用性,就拿知乎 网站作为实战例子吧! 必备技能:http接口基础知识.抓包,本文不做详细介绍,不会的可以先百度恶补 ...
- CentOS6.5下RPM包安装MySQL5.6.35
基本环境:VMware10.0+CentOS6.5+MySQL5.6.35 .查看操作系统相关 shell> cat /etc/issue shell> uname -a .创建需要下载r ...
- URL&HTTP协议&GET请求&POST请求
1.什么是URL URL的全称是Uniform Resource Locator(统一资源定位符) 通过1个URL,能找到互联网上唯一的1个资源 URL就是资源的地址.位置,互联网上的每个资源都有一个 ...
- 阿里云 Server (Ubuntu 12.04) 配置 FTP
来自 http://blog.csdn.net/zgrjkflmkyc/article/details/45510345 这个是阿里云的官方用户手册 http://bbs.aliyun.com/re ...
- usb-host与外设通信(三)
4.与设备之间的通信 和USB设备通信可以是同步的或者是异步的,无论是哪一种情况,你都应该创建一个新的线程来处理数据传输,这样才不会使UI线程出现阻塞.与设备建立适宜的通信,你需要获得该设备一个合适的 ...
- 用python输出1-100之间所有的质数
# 1-100之间的质数 i = 2 while i <= 100: j = 2 flag = True while j < i: if i % j == 0: flag = False ...
- 线程池 一 ScheduledThreadPoolExecutor
java.util.concurrent public class ScheduledThreadPoolExecutor extends ThreadPoolExecutor implements ...
- bzoj1011题解
[解题思路] 这题解法很多,我也不知道标算是什么..这简直就是大放水啊.. 网上流传的乱搞法,对于小范围内(假设为[1,l]∩N)暴力,大范围内估算. 我写这题时还是写P的?!..但是我看不懂我当时写 ...