javascript this相关知识

最近看了一些javascript相关的知识,打算整理一下 一、全局执行上下文中的this console.log(this) 上面这个打印结果是: 全局执行上下文中的this是指向window对象的 二、函数执行上下文中的this function foo() { console.log(this) } foo() 上方这段代码的打印结果是: 再看下下面这段代码,它的打印结果也是window对象 function bar() { console.log(this) } function foo() { bar() } foo() 以上的示例说明,在默认情况下调用一个函数,其执行上下文中的this也是指向window对象的 2.1 如何指定函数执行上下文中的this 看以下示例代码,同一个函数,由于调用的方式不同,它内部的this指向了不同的对象。 在一个函数的执行上下文中,this由该函数的调用者提供,由调用函数的方式来决定其指向。 var a = 10; var obj = { a : 20 } function…

javascript 闭包

最近看了一些javascript相关的知识,打算整理一下 闭包 在javascript中,根据词法作用域的规则,内部函数总是可以访问其外部函数中的变量,当通过调用一个外部函数返回一个内部函数后,即使该外部函数已经执行结束了,但是内部函数引用外部函数的变量依然保存在内存中,我们就把这些变量的集合称为闭包。 看以下示例代码,在bar执行的时候,访问了foo的内部变量a和b,所以产生了闭包 function foo() { var a = 20 var b = 30 function bar() { return a + b } return bar; } var bar = foo(); bar(); 在chrome里面断点调试,Call Stack表示当前的函数调用栈,Scope为当前正在被执行的函数的作用域链,Local为当前活动对象。可以看出来产生了一个名为foo的闭包 再来看一段示例代码,可以看到也产生了闭包 function foo() { var a = 1 let b = 2 const…

javascript 作用域-作用域链

最近看了一些javascript相关的知识,打算整理一下 一、作用域 先来看一段代码 for (var i = 0; i < 10; i ++) { console.log('test'); } console.log(i); 如果是在其他语言里面,console.log(i)会报错,因为i的只在for循环这个块里面起作用。但是javascript里面这段代码打印结果是10。 下面说一下javascript里面的作用域以及作用域链等相关知识 1.1 全局作用域 和 函数作用域 在javascript里,作用域是用来规定变量与函数可见性和生命周期一套规则。在ES6之前,作用域有两种,分别是全局作用域与函数作用域。 全局作用域中的对象在代码中的任何地方都能访问,其生命周期伴随着页面的生命周期。 函数作用域即函数内部定义的变量或者函数,并且定义的变量或者函数只能在函数内部被访问。 看下面这段示例代码: var a = 3; function foo () { console.log(a)…

javascript-变量提升及执行上下文相关知识

最近看了一些javascript相关的知识,打算整理一下 变量提升 先来看一段示例代码 foo() console.log(name) var name = 'test' function foo() { console.log('function foo be called'); } 可以看到打印出的结果是: function foo be called undefined 可以看到变量name在声明之前就被调用了,这在其他语言里面是会报错的,但是在javascript里面却打印出undefined,这是因为用var声明的变量发生了变量提升。 在javascript代码执行之前,需要先进行编译。在编译的时候,就把变量的声明和函数的声明提升到了“代码开头”,即上方的代码可以理解为这样: /** * 变量提升和函数提升部分 */ var name = undefined function foo() { console.log('function foo be called'); } /** * 可执行代码部分 */ foo() console.…

nginx的autoindex

如果想要把服务器上的某个目录对外开放,让所有人可以看到并下载目录里面的文件,可以使用nginx的autoindex 举个例子,我想把/home/nemo/publicdir/file/这个目录对外开放,我可以设置请求http://wwww.mysite.com/testpublic/这个url的时候,自动映射到我要开放的目录。nginx配置如下: location /testpublic/ { alias /home/nemo/publicdir/file/; autoindex on; } location / { root /home/nemo/www; try_files /notfound.html 404; } 然后重启nginx,之后在浏览器里面输入http://wwww.mysite.com/testpublic/就可以看到/home/nemo/publicdir/file/这个目录里面的文件了。 注意:…

iOS给一张照片美颜

之前我的一篇笔记iOS实时美颜并获取原图里面写了如何实现实时的美颜滤镜,本篇作为补充说下如何给一张图片美颜。 还是使用之前提到的GPUImageBeautifyFilter // 原图 UIImage * sourceImage = [UIImage imageNamed:@"notBeauty.png"]; GPUImageBeautifyFilter *beautyFilter = [[GPUImageBeautifyFilter alloc] init]; //设置要渲染的区域 [beautyFilter forceProcessingAtSize:sourceImage.size]; [beautyFilter useNextFrameForImageCapture]; //获取数据源 GPUImagePicture *stillImageSource = [[GPUImagePicture alloc]initWithImage:sourceImage]; //添加上滤镜 [stillImageSource addTarget:beautyFilter]; //开始渲染 [stillImageSource processImage]; //获取滤镜后的图片 UIImage *beautyImage = [beautyFilter imageFromCurrentFramebuffer]; [beautyFilter removeAllTargets]; [stillImageSource removeAllTargets]; 根据以上代码,UIImage *beautyImage存储的就是美颜后的图片。…

iOS实现实时美颜滤镜并获取原图

实时美颜 在iOS里面进行实时美颜,我使用的是GPUImageBeautifyFilter, 具体原理可以看作者的文章。 具体使用方法如下: 1.在项目的Podfile里面引入GPUImage target 'TestBeauty' do pod 'GPUImage' end 2.将GPUImageBeautyFilter.h和GPUImageBeautyFilter.m添加到项目中 3.编写相关代码 在ViewController.m里面实现如下代码: #import "ViewController.h" #import <GPUImage/GPUImage.h> #import "GPUImageBeautifyFilter.h" @interface ViewController () @property (nonatomic, strong) GPUImageVideoCamera *videoCamera; @property (nonatomic, strong) GPUImageView *filterView; @end…

iOS调用UIImagePickerController相机拍照图片旋转了90度

以前遇到过iOS调用相机拍照图片旋转了90度的问题,照片显示在UIImageView里面是正常的,但是传输到服务器之后发现不是正的。 要解决上面这个问题,在发送图片到服务器之前,要对图片方向进行纠正。一般有两种方法进行纠正。 方法一、使用CGAffineTransform + CGBitmapContextCreateImage UIImage+fixOrientation.h文件 // UIImage+fixOrientation.h文件 #import <UIKit/UIKit.h> @interface UIImage (fixOrientation) - (UIImage *)fixOrientation; @end UIImage+fixOrientation.m 文件 // UIImage+fixOrientation.m 文件 @implementation UIImage (fixOrientation) - (UIImage *)fixOrientation { // No-op if the orientation is already correct…