jack

jack 查看完整档案

填写现居城市  |  填写毕业院校  |  填写所在公司/组织填写个人主网站
编辑
_ | |__ _ _ __ _ | '_ \| | | |/ _` | | |_) | |_| | (_| | |_.__/ \__,_|\__, | |___/ 个人简介什么都没有

个人动态

jack 赞了回答 · 1月24日

JavaScript怎么判断一个字母小写大写?

/[A-Z]/.test("A") // true
/[A-Z]/.test("b") // false

关注 7 回答 4

jack 赞了回答 · 1月24日

JavaScript怎么判断一个字母小写大写?

function IsUpper(code) {
    return code === code.toUpperCase()
}
console.log(IsUpper('a')) //false
console.log(IsUpper('A')) //true

关注 7 回答 4

jack 赞了回答 · 1月24日

JavaScript怎么判断一个字母小写大写?

'a'.charCodeAt(0) > 96 //小写
'A'.charCodeAt(0) < 90 //大写

关注 7 回答 4

jack 评论了文章 · 2018-08-13

Javascript作用域和变量提升

引子

首先大家看一下下面的代码,猜猜会输出什么结果?

var foo = 1;
function bar() {
    if (!foo) {
        var foo = 10;
    }
    alert(foo);
}
bar();

答案是10!
你是否会疑惑条件语句if(!foo)并不会执行,为什么foo会被赋值为10

再来看第二个例子

var a = 1;
function b() {
    a = 10;
    return;
    function a() {}
}
b();
alert(a);

答案还是10吗?显然不是,alert输出了1

如果你仍然对上面两个输出结果摸不着头脑,那么请认真阅读这篇文章

Scoping in Javascript

Javascript的作用域已经是老生常谈的问题了,但是不一定每个人都能准确理解。
我们先来看一下C语言的一个例子:

#include <stdio.h>
int main() {
    int x = 1;
    printf("%d, ", x); // 1
    if (1) {
        int x = 2;
        printf("%d, ", x); // 2
    }
    printf("%d\n", x); // 1
}

程序依次输出了1,2,1
为什么第三个输出了1而不是2呢?因为在C语言中,我们有块级作用域(block-level scope)。在一个代码块的中变量并不会覆盖掉代码块外面的变量。我们不妨试一下Javascript中的表现

var x = 1;
console.log(x); // 1
if (true) {
    var x = 2;
    console.log(x); // 2
}
console.log(x); // 2

输出的结果为1,2,2 if代码块中的变量覆盖了全局变量。那是因为JavaScript是一种函数级作用域(function-level scope)所以if中并没有独立维护一个scope,变量x影响到了全局变量x

C,C++,C#和Java都是块级作用域语言,那么在Javascript中,我们怎么实现一种类似块级作用域的效果呢?答案是闭包

function foo() {
    var x = 1;
    if (x) {
        (function () {
            var x = 2;
            // some other code
        }());
    }
    // x is still 1.
}

上面代码在if条件块中创建了一个闭包,它是一个立即执行函数,所以相当于我们又创建了一个函数作用域,所以内部的x并不会对外部产生影响。

Hoisting in Javascript

在Javascript中,变量进入一个作用域可以通过下面四种方式:

  1. 语言自定义变量:所有的作用域中都存在this和arguments这两个默认变量

  2. 函数形参:函数的形参存在函数作用域中

  3. 函数声明:function foo() {}

  4. 变量定义:var foo

其中,___在代码运行前,函数声明和变量定义通常会被解释器移动到其所在作用域的最顶部___,如何理解这句话呢?

function foo() {
    bar();
    var x = 1;
}

上面这段在吗,被代码解释器编译完后,将变成下面的形式:

function foo() {
    var x;
    bar();
    x = 1;
}

我们注意到,x变量的定义被移动到函数的最顶部。然后在bar()后,再对其进行赋值。
再来看一个例子,下面两段代码其实是等价的:

function foo() {
    if (false) {
        var x = 1;
    }
    return;
    var y = 1;
}
function foo() {
    var x, y;
    if (false) {
        x = 1;
    }
    return;
    y = 1;
}

所以变量的上升(Hoisting)只是其定义上升,而变量的赋值并不会上升。

我们都知道,创建一个函数的方法有两种,一种是通过函数声明function foo(){}
另一种是通过定义一个变量var foo = function(){} 那这两种在代码执行上有什么区别呢?

来看下面的例子:

function test() {
    foo(); // TypeError "foo is not a function"
    bar(); // "this will run!"
    var foo = function () { // function expression assigned to local variable 'foo'
        alert("this won't run!");
    }
    function bar() { // function declaration, given the name 'bar'
        alert("this will run!");
    }
}
test();

在这个例子中,foo()调用的时候报错了,而bar能够正常调用
我们前面说过变量会上升,所以var foo首先会上升到函数体顶部,然而此时的fooundefined,所以执行报错。而对于函数bar, 函数本身也是一种变量,所以也存在变量上升的现象,但是它是上升了整个函数,所以bar()才能够顺利执行。

再回到一开始我们提出的两个例子,能理解其输出原理了吗?

var foo = 1;
function bar() {
    if (!foo) {
        var foo = 10;
    }
    alert(foo);
}
bar();

其实就是:

var foo = 1;
function bar() {
    var foo;
    if (!foo) {
        foo = 10;
    }
    alert(foo);
}
bar();
var a = 1;
function b() {
    a = 10;
    return;
    function a() {}
}
b();
alert(a);

其实就是:

var a = 1;
function b() {
    function a() {}
    a = 10;
    return;
}
b();
alert(a);

这就是为什么,我们写代码的时候,变量定义总要写在最前面。

ES6有何区别

在ES6中,存在let关键字,它声明的变量同样存在块级作用域。
而且函数本身的作用域,只存在其所在的块级作用域之内,例如:

function f() { console.log('I am outside!'); }
if(true) {
   // 重复声明一次函数f
   function f() { console.log('I am inside!'); }
}
f();

上面这段代码在ES5中的输出结果为I am inside!因为f被条件语句中的f上升覆盖了。
在ES6中的输出是I am outside!块级中定义的函数不会影响外部。

如果对let的使用,或ES6的其他新特性感兴趣,请自行阅读ES6文档。

查看原文

jack 赞了文章 · 2018-08-13

Javascript作用域和变量提升

引子

首先大家看一下下面的代码,猜猜会输出什么结果?

var foo = 1;
function bar() {
    if (!foo) {
        var foo = 10;
    }
    alert(foo);
}
bar();

答案是10!
你是否会疑惑条件语句if(!foo)并不会执行,为什么foo会被赋值为10

再来看第二个例子

var a = 1;
function b() {
    a = 10;
    return;
    function a() {}
}
b();
alert(a);

答案还是10吗?显然不是,alert输出了1

如果你仍然对上面两个输出结果摸不着头脑,那么请认真阅读这篇文章

Scoping in Javascript

Javascript的作用域已经是老生常谈的问题了,但是不一定每个人都能准确理解。
我们先来看一下C语言的一个例子:

#include <stdio.h>
int main() {
    int x = 1;
    printf("%d, ", x); // 1
    if (1) {
        int x = 2;
        printf("%d, ", x); // 2
    }
    printf("%d\n", x); // 1
}

程序依次输出了1,2,1
为什么第三个输出了1而不是2呢?因为在C语言中,我们有块级作用域(block-level scope)。在一个代码块的中变量并不会覆盖掉代码块外面的变量。我们不妨试一下Javascript中的表现

var x = 1;
console.log(x); // 1
if (true) {
    var x = 2;
    console.log(x); // 2
}
console.log(x); // 2

输出的结果为1,2,2 if代码块中的变量覆盖了全局变量。那是因为JavaScript是一种函数级作用域(function-level scope)所以if中并没有独立维护一个scope,变量x影响到了全局变量x

C,C++,C#和Java都是块级作用域语言,那么在Javascript中,我们怎么实现一种类似块级作用域的效果呢?答案是闭包

function foo() {
    var x = 1;
    if (x) {
        (function () {
            var x = 2;
            // some other code
        }());
    }
    // x is still 1.
}

上面代码在if条件块中创建了一个闭包,它是一个立即执行函数,所以相当于我们又创建了一个函数作用域,所以内部的x并不会对外部产生影响。

Hoisting in Javascript

在Javascript中,变量进入一个作用域可以通过下面四种方式:

  1. 语言自定义变量:所有的作用域中都存在this和arguments这两个默认变量

  2. 函数形参:函数的形参存在函数作用域中

  3. 函数声明:function foo() {}

  4. 变量定义:var foo

其中,___在代码运行前,函数声明和变量定义通常会被解释器移动到其所在作用域的最顶部___,如何理解这句话呢?

function foo() {
    bar();
    var x = 1;
}

上面这段在吗,被代码解释器编译完后,将变成下面的形式:

function foo() {
    var x;
    bar();
    x = 1;
}

我们注意到,x变量的定义被移动到函数的最顶部。然后在bar()后,再对其进行赋值。
再来看一个例子,下面两段代码其实是等价的:

function foo() {
    if (false) {
        var x = 1;
    }
    return;
    var y = 1;
}
function foo() {
    var x, y;
    if (false) {
        x = 1;
    }
    return;
    y = 1;
}

所以变量的上升(Hoisting)只是其定义上升,而变量的赋值并不会上升。

我们都知道,创建一个函数的方法有两种,一种是通过函数声明function foo(){}
另一种是通过定义一个变量var foo = function(){} 那这两种在代码执行上有什么区别呢?

来看下面的例子:

function test() {
    foo(); // TypeError "foo is not a function"
    bar(); // "this will run!"
    var foo = function () { // function expression assigned to local variable 'foo'
        alert("this won't run!");
    }
    function bar() { // function declaration, given the name 'bar'
        alert("this will run!");
    }
}
test();

在这个例子中,foo()调用的时候报错了,而bar能够正常调用
我们前面说过变量会上升,所以var foo首先会上升到函数体顶部,然而此时的fooundefined,所以执行报错。而对于函数bar, 函数本身也是一种变量,所以也存在变量上升的现象,但是它是上升了整个函数,所以bar()才能够顺利执行。

再回到一开始我们提出的两个例子,能理解其输出原理了吗?

var foo = 1;
function bar() {
    if (!foo) {
        var foo = 10;
    }
    alert(foo);
}
bar();

其实就是:

var foo = 1;
function bar() {
    var foo;
    if (!foo) {
        foo = 10;
    }
    alert(foo);
}
bar();
var a = 1;
function b() {
    a = 10;
    return;
    function a() {}
}
b();
alert(a);

其实就是:

var a = 1;
function b() {
    function a() {}
    a = 10;
    return;
}
b();
alert(a);

这就是为什么,我们写代码的时候,变量定义总要写在最前面。

ES6有何区别

在ES6中,存在let关键字,它声明的变量同样存在块级作用域。
而且函数本身的作用域,只存在其所在的块级作用域之内,例如:

function f() { console.log('I am outside!'); }
if(true) {
   // 重复声明一次函数f
   function f() { console.log('I am inside!'); }
}
f();

上面这段代码在ES5中的输出结果为I am inside!因为f被条件语句中的f上升覆盖了。
在ES6中的输出是I am outside!块级中定义的函数不会影响外部。

如果对let的使用,或ES6的其他新特性感兴趣,请自行阅读ES6文档。

查看原文

赞 21 收藏 85 评论 19

jack 收藏了文章 · 2018-08-13

Javascript作用域和变量提升

引子

首先大家看一下下面的代码,猜猜会输出什么结果?

var foo = 1;
function bar() {
    if (!foo) {
        var foo = 10;
    }
    alert(foo);
}
bar();

答案是10!
你是否会疑惑条件语句if(!foo)并不会执行,为什么foo会被赋值为10

再来看第二个例子

var a = 1;
function b() {
    a = 10;
    return;
    function a() {}
}
b();
alert(a);

答案还是10吗?显然不是,alert输出了1

如果你仍然对上面两个输出结果摸不着头脑,那么请认真阅读这篇文章

Scoping in Javascript

Javascript的作用域已经是老生常谈的问题了,但是不一定每个人都能准确理解。
我们先来看一下C语言的一个例子:

#include <stdio.h>
int main() {
    int x = 1;
    printf("%d, ", x); // 1
    if (1) {
        int x = 2;
        printf("%d, ", x); // 2
    }
    printf("%d\n", x); // 1
}

程序依次输出了1,2,1
为什么第三个输出了1而不是2呢?因为在C语言中,我们有块级作用域(block-level scope)。在一个代码块的中变量并不会覆盖掉代码块外面的变量。我们不妨试一下Javascript中的表现

var x = 1;
console.log(x); // 1
if (true) {
    var x = 2;
    console.log(x); // 2
}
console.log(x); // 2

输出的结果为1,2,2 if代码块中的变量覆盖了全局变量。那是因为JavaScript是一种函数级作用域(function-level scope)所以if中并没有独立维护一个scope,变量x影响到了全局变量x

C,C++,C#和Java都是块级作用域语言,那么在Javascript中,我们怎么实现一种类似块级作用域的效果呢?答案是闭包

function foo() {
    var x = 1;
    if (x) {
        (function () {
            var x = 2;
            // some other code
        }());
    }
    // x is still 1.
}

上面代码在if条件块中创建了一个闭包,它是一个立即执行函数,所以相当于我们又创建了一个函数作用域,所以内部的x并不会对外部产生影响。

Hoisting in Javascript

在Javascript中,变量进入一个作用域可以通过下面四种方式:

  1. 语言自定义变量:所有的作用域中都存在this和arguments这两个默认变量

  2. 函数形参:函数的形参存在函数作用域中

  3. 函数声明:function foo() {}

  4. 变量定义:var foo

其中,___在代码运行前,函数声明和变量定义通常会被解释器移动到其所在作用域的最顶部___,如何理解这句话呢?

function foo() {
    bar();
    var x = 1;
}

上面这段在吗,被代码解释器编译完后,将变成下面的形式:

function foo() {
    var x;
    bar();
    x = 1;
}

我们注意到,x变量的定义被移动到函数的最顶部。然后在bar()后,再对其进行赋值。
再来看一个例子,下面两段代码其实是等价的:

function foo() {
    if (false) {
        var x = 1;
    }
    return;
    var y = 1;
}
function foo() {
    var x, y;
    if (false) {
        x = 1;
    }
    return;
    y = 1;
}

所以变量的上升(Hoisting)只是其定义上升,而变量的赋值并不会上升。

我们都知道,创建一个函数的方法有两种,一种是通过函数声明function foo(){}
另一种是通过定义一个变量var foo = function(){} 那这两种在代码执行上有什么区别呢?

来看下面的例子:

function test() {
    foo(); // TypeError "foo is not a function"
    bar(); // "this will run!"
    var foo = function () { // function expression assigned to local variable 'foo'
        alert("this won't run!");
    }
    function bar() { // function declaration, given the name 'bar'
        alert("this will run!");
    }
}
test();

在这个例子中,foo()调用的时候报错了,而bar能够正常调用
我们前面说过变量会上升,所以var foo首先会上升到函数体顶部,然而此时的fooundefined,所以执行报错。而对于函数bar, 函数本身也是一种变量,所以也存在变量上升的现象,但是它是上升了整个函数,所以bar()才能够顺利执行。

再回到一开始我们提出的两个例子,能理解其输出原理了吗?

var foo = 1;
function bar() {
    if (!foo) {
        var foo = 10;
    }
    alert(foo);
}
bar();

其实就是:

var foo = 1;
function bar() {
    var foo;
    if (!foo) {
        foo = 10;
    }
    alert(foo);
}
bar();
var a = 1;
function b() {
    a = 10;
    return;
    function a() {}
}
b();
alert(a);

其实就是:

var a = 1;
function b() {
    function a() {}
    a = 10;
    return;
}
b();
alert(a);

这就是为什么,我们写代码的时候,变量定义总要写在最前面。

ES6有何区别

在ES6中,存在let关键字,它声明的变量同样存在块级作用域。
而且函数本身的作用域,只存在其所在的块级作用域之内,例如:

function f() { console.log('I am outside!'); }
if(true) {
   // 重复声明一次函数f
   function f() { console.log('I am inside!'); }
}
f();

上面这段代码在ES5中的输出结果为I am inside!因为f被条件语句中的f上升覆盖了。
在ES6中的输出是I am outside!块级中定义的函数不会影响外部。

如果对let的使用,或ES6的其他新特性感兴趣,请自行阅读ES6文档。

查看原文

jack 提出了问题 · 2017-08-14

axios 提交的数据出现问题

1.在vue项目中使用axios提交json数据,请求头已设置json格式,但是提交的数据是这种格式:cat=1

2.main.js引入了:
import axios from 'axios'
Vue.prototype.$http = axios

3.报错信息:

Request URL:http://chenshengjv.tunnel.qydev.com/nobee_weixin_ipad_api/user/updateRequire2
Request Method:POST
Status Code:400 
Remote Address:47.92.144.155:80
Referrer Policy:no-referrer-when-downgrade
Response Headers
view source
Access-Control-Allow-Origin:*
Connection:close
Content-Type:application/json;charset=UTF-8
Date:Mon, 14 Aug 2017 00:51:30 GMT
Set-Cookie:JSESSIONID=F829920690130754444D59C77EF507A1; Path=/nobee_weixin_ipad_api; HttpOnly
Transfer-Encoding:chunked
Vary:Origin
Request Headers
view source
Accept:application/json, text/plain, */*
Accept-Encoding:gzip, deflate
Accept-Language:zh-CN,zh;q=0.8
Cache-Control:no-cache
Connection:keep-alive
Content-Length:5
Content-Type:application/json;charset=UTF-8
Host:chenshengjv.tunnel.qydev.com
Origin:http://localhost:8080
Pragma:no-cache
Referer:http://localhost:8080/
User-Agent:Mozilla/5.0 (iPhone; CPU iPhone OS 9_1 like Mac OS X) AppleWebKit/601.1.46 (KHTML, like Gecko) Version/9.0 Mobile/13B143 Safari/601.1
Request Payload
cat=1

4.我搜的使用axios post json数据的发出去的这样的,这个是我想要的

clipboard.png

5.项目使用的是es6语法

关注 2 回答 1

jack 关注了用户 · 2017-05-08

lv_DaDa @lv_dada

关注 63

jack 发布了文章 · 2017-05-02

CSS3新特性学习

引言

最近发现很多css3的新特性不熟悉,所以今天把它们都学习一边,做出效果加深印象,说到css3还加了蛮多的特性,像一些border的一些效果,动画属性animation trasiform等。

1.border-radius(边框圆角)

效果

 实现代码:

    height: 100px;
    width: 100px;
    margin: 0 auto;
    background-color: #E0e0e0;
    border-radius: 10px

加上下面这两个是为了兼容chrome和fixfox旧版本

    -moz-border-radius: 10px;/* chrome */    
    -webkit-border-radius: 10px;/* fixfox */

这个属性很有趣,还可用来画圆,把值设为百分比,可以画任意大小的圆

    border-radius: 50%;
    -moz-border-radius: 50%;/* chrome */
    -webkit-border-radius: 50%;/* fixfox */

 圆效果

2.box-shadow(边框阴影)

这个可就厉害了,可以做出立体效果,也可以使边框很炫酷

 语法:

box-shadow: h-shadow v-shadow blur spread color inset;    
h-shadow:水平阴影位置
v-shadow:垂直阴影位置
blur:模糊距离
spread:阴影尺寸
color:阴影颜色
inset:内部阴影 默认为outset

 效果

 代码

box-shadow: 10px 10px 4px #A5A5A5;

用在input上

代码

box-shadow:0 0 8px 2px #9668db;

3.text-overflow(文本溢出隐藏)

设置div的宽高固定,文字太多时会超出div的边框

我们要实现下面效果,以三个点号代替省略的文字

代码

        text-overflow:ellipsis;
    overflow:hidden;
    white-space:nowrap;

 4.transform(动画)

鼠标移入时动画:

样式

    .di{
            
            width: 100px;
            height: 100px;
            margin: 100px auto;
            background-color: #E0e0e0;
            transition:width 1s, height 1s;
            -moz-transition:width 1s, height 1s, -moz-transform 1s; /* 可以支持Firefox 4 */
            -webkit-transition:width 1s, height 1s, -webkit-transform 1s; /* 可以支持Safari and Chrome */
            -o-transition:width 1s, height 1s, -o-transform 1s; /* 可以支持Opera */
    }

鼠标移入时

    .di:hover{
        width:200px;
        height:200px;
        transform:rotate(180deg); /*旋转180度*/
        -moz-transform:rotate(180deg); /* 可以支持Firefox 4 */
        -webkit-transform:rotate(180deg); /* 可以支持Safari and Chrome */
        -o-transform:rotate(180deg); /* 可以支持Opera */
    }

未完待续。。

查看原文

赞 0 收藏 3 评论 0

认证与成就

  • 获得 0 次点赞
  • 获得 4 枚徽章 获得 0 枚金徽章, 获得 1 枚银徽章, 获得 3 枚铜徽章

擅长技能
编辑

(゚∀゚ )
暂时没有

开源项目 & 著作
编辑

(゚∀゚ )
暂时没有

注册于 2017-05-01
个人主页被 187 人浏览