JavaScript数组的查找

2019-11-4 张宇童 学习日志

我们在ES5中常用的方法filter

我们来看一下

let arrary = Array.of(1,2,3,4,5)
let find = array.filter(x => {
    return x === 3;
})
console.log(find)
// 运行程序
// [3]

使用filter时候的弊端

filter不管有没有查找到需要的元素都会将数组遍历完成

而ES6中新加入了find只需要返回true将不会继续遍历相当于break

下面我们来看一下

let array = Array.of(1,2,3,4,5)
let find = array.find(x => {
    return x === 2
})
console.log(find)
// 好的运行程序。我们会发现输出2,这个返回值是数组的值而不是index

find的弊端在于没有返回索引

这是又有一个findIndex解决了这个问题

let array = Array.of(1,2,3,4,5)
let find = array.findIndex(x => {
    return x===3
})
console.log(find)

标签: 数组的查找

评论(0) 浏览(642)

JavaScript中生成数组的几种方式

2019-11-4 张宇童

第一种最简单的

new Array(5) // 生成5个 empty 的数组元素

new Array(1,2,3,4,5) // 生成5个值为1,2,3,4,5的元素

第二种使用伪数组概念

Array.from({ length: 100 }, x => 1) // 生成100个元素值为1的数组

第三种使用fill

Array(100).fill(5) // 生成100个元素为5的数组

Array(100).fill(5,2,10) // 生成100个元素其中索引为2的数组~索引为9的数组值为5 其余均为empty

第四种生成一个数组

Array.of(2) // 生成一个值为2的数组

Array.of(1,2,3,4,5) // 生成五个值为1~5的数组


标签: 数组的生成

评论(0) 浏览(695)

JavaScript中的伪数组转换

2019-11-4 张宇童 学习日志

在进行转换之前首先我们要明白什么是伪数组。

伪数组就是指一个类似于数组的集合。同样它具有length以及index数字索引

好了我们先来定义一个伪数组

let pseudoArray = {

0: 'hello',

1: 'world',

length: 2

}

好了一个经典的伪数组就定义好了

这时候我们使用forEach遍历一下

pesudoArray.forEach(x => {
    console.log(x)
})
// 这个时候运行程序浏览器会报错
// lesson2.js:6 Uncaught TypeError: pseudoArray.forEach is not a function at lesson2.js:6
因为它看似数组其实不然

我们这个时候需要转换一下

怎么转换呢?

Es5之中我们会使用数组对象上面的一个方法

let array = [].slice.call(pseudoArray)
array.forEach(x => {
    console.log(x)
})
// 运行程序这个时候会正确的输出
// hello
// world
有的同学可能会说很麻烦啊!有没有更简单的方法呢?

在ES6中array提供了from方法可以直接转化

let array = Array.from(pseudoArray)
array.forEach(x => {
     console.log(x)
})
// 这个时候程序也可以正常的运行
// hello
// world
// 和之前ES5中繁琐的步骤是一样的

标签: javascript 数组的转换

评论(0) 浏览(553)

ES6数组遍历复习

2019-11-4 张宇童 关注网络

1、for(let i = 0; i < array.length; i++) {}方式

    // 声明一个数组
    array = [1,2,3,4,5]
    // 遍历
    for(let i = 0; i < array.length; i++) {
        console.log(i,array[i])
    }
    // 依次输出
    // 0, 1
    // 1,2
    // 2,3
    // 3,4
    // 4,5

2、forEach遍历方式

foreach.png

    // 这里直接使用上面的数组了
    array.forEach( function (x) {
        console.log(x)
    })
    // 输出1,2,3,4,5
    // 需要值得注意的是forEach不支持break以及continue

3、every遍历方式

使用forEach方式遍历的场景是需要遍历每一个元素,因为forEach不能在执行过程中停止掉

而使用every方式遍历的大部分场景都是用于判定一个元素是否存在这个数组中的时候使用every

下面请看example

everyreturntrue.png
let array = [1,2,3,4,5]
array.every( x => {
    console.log(x)
    return true // 注意这里如果返回true时将继续遍历
})
// 程序结束输出
// 1
// 2
// 3
// 4
// 5
// 下一个example
everyreturnfalse.png
array.every( x => {
    console.log(x)
} )
// 程序结束输出
// 1
// 这里可能有很多同学疑惑我并没有返回false呀,为什么只遍历了一个呢?
// 这里需要说明的是如果没有返回值将默认返回false
4、for...in...

for...in...方法本不属于array,但是却可以用于遍历array。for...in...方法主要用于遍历对象

下面是一个example

forin1.png
let array = [1,2,3,4,5]
for ( i in array ) {
    console.log(i, array[i])
}
// 这里输出的是
// 0,1
// 1,2
// 2,3
// 3,4
// 4,5
这里可能很多同学会问for in 本是给object设计的,那么array使用了就没有什么副作用吗?


我在这里的回答是有的,肯定是有的

for in 给我们带来便利的同时也会遍历到一些array上面的非原型对象

这里打个比方

我一开始new了一个array

后来我直接给这个array对象加上一个属性,同学们想一想这个属性他是可以遍历出来的吗?

我们来看一下

for in2.png



let array = [1,2,3,4,5]
array.a = 'hello wrold'
for ( i in array ) {
    console.log(i , array[i])
}
// 运行结束,程序输出
// lesson2.js:4 1 2
// lesson2.js:4 2 3
// lesson2.js:4 3 4
// lesson2.js:4 4 5
// lesson2.js:4 a hello world
最后数组遍历的方法还有一个for...of...


可能我们大部分人的意识里面可遍历的数据类型只有object、array,但是到了es6之后我们就可以自定义数据结构,只要按照es6标准定义数据结构就可以遍历。但是这样的遍历不可以使用for、 for...in...只时候就要用到for...of...了

标签: ES6 数组 遍历

评论(0) 浏览(606)

使用Django处理excel

2019-10-31 张宇童 Python

感觉大部分没有使用到Django其实并不是标题所说的使用Django了。大部分还要是python原生内容为主

首先需要安装xlrd这个扩展包

pip3 install xlrd

然后在Django中接收到文件

import xlrd
fs = reuqest.FILES.get('file_name');
fd = xlrd.open_workbook(filename=None, file_contents=fs.read())
table = fd.sheets()[0]
rows = table.nrows
for i in range(1, rows):
    ...


标签: python 扩展 excel 处理文件

评论(0) 浏览(589)

django.core.exceptions.ImproperlyConfigured: mysqlclient 1.3.13 or newer is required; you have 0.9.2

2019-10-28 张宇童 Python

使用python3.7+django2.2+pymysql时遇到这个错误,

django.core.exceptions.ImproperlyConfigured: mysqlclient 1.3.13 or newer is required; you have 0.9.2

别急,这主要是django2.2内部的一个版本限制在作怪处理方案

1.修复源码
按照文中配置,报错django.core.exceptions.ImproperlyConfigured: mysqlclient 1.3.13 or newer is required; you have 0.9.3.
原因:django2.2和pymysql版本不匹配。mysqldb不支持python3.
解决方案:
1、raise ImproperlyConfigured(‘mysqlclient 1.3.13 or newer is required; you have %s.’ % Database.version)
  django.core.exceptions.ImproperlyConfigured: mysqlclient 1.3.13 or newer is required; you have 0.9.3.  
解决办法:
C:\Python37\Lib\site-packages\django\db\backends\mysql(python安装目录)打开base.py,注释掉以下内容:        
if version < (1, 3, 13):           raise ImproperlyConfigured(‘mysqlclient 1.3.13 or newer is required; you have %s.’ % Database.version)   
2、File “C:\Python37\lib\site-packages\django\db\backends\mysql\operations.py”, line 146, in last_executed_query   
query = query.decode(errors=‘replace’)   
AttributeError: ‘str’ object has no attribute ‘decode’   
解决办法:
打开此文件把146行的decode修改为encode

屏幕快照 2019-10-28 下午12.24.42.png

注释后即可

屏幕快照 2019-10-28 下午12.26.18.png

ps.django2.2不支持pyMySQL,但2.2是LTS,有想过试试mysqldb,但是MySQLDB又不支持python3。。。。的确让人头大。


标签: python 报错

评论(0) 浏览(1052)

AttributeError: 'str' object has no attribute 'decode'

2019-10-28 张宇童 Python

python3下列代码会报上边的错

print("Response:", resp.text.decode('unicode_escape'))
解决办法:
print("Response:", resp.text.encode('utf-8').decode('unicode_escape'))
中间加上.encode('utf-8')即可

标签: python 学习笔记

评论(0) 浏览(2789)

React生命周期函数

2019-10-25 张宇童 学习日志

首先贴一张图片,直观深刻的理解一下屏幕快照 2019-10-25 下午9.48.18.png


组件挂载前执行

 1、componentWillMount


组件挂载后执行

2、componentDidMount


组件更新之前执行

3、shouldComponentUpdate


组件被更新之前执行但在shouldComponentUpdate之后执行,如果shouldComponentUpdate返回true执行 返回false不执行

4、componentWillUpdate


组件更新完成之后执行

5、componentDidUpdate


存在于自组件中,要从父组件接受参数,第一次存在于父组件中不会执行,父组件执行render会触发componentWillReceiveProps函数

6、compoentWillReceiveProps


当一个组件将被销毁之前执行

7、componentWillMount

标签: react 生命周期函数

评论(0) 浏览(796)

Django中的SESSION操作

2019-10-25 张宇童 Python

# 获取、设置、删除Session中数据
request.session['k1']
request.session.get('k1',None)
request.session['k1'] = 123
request.session.setdefault('k1',123) # 存在则不设置
del request.session['k1']


# 所有 键、值、键值对
request.session.keys()
request.session.values()
request.session.items()
request.session.iterkeys()
request.session.itervalues()
request.session.iteritems()

# 会话session的key
request.session.session_key

# 将所有Session失效日期小于当前日期的数据删除
request.session.clear_expired()

# 检查会话session的key在数据库中是否存在
request.session.exists("session_key")

# 删除当前会话的所有Session数据
request.session.delete()
  
# 删除当前的会话数据并删除会话的Cookie。  推荐使用****
request.session.flush() 
    这用于确保前面的会话数据不可以再次被用户的浏览器访问
    例如,django.contrib.auth.logout() 函数中就会调用它。

# 设置会话Session和Cookie的超时时间
request.session.set_expiry(value)
    * 如果value是个整数,session会在些秒数后失效。
    * 如果value是个datatime或timedelta,session就会在这个时间后失效。
    * 如果value是0,用户关闭浏览器session就会失效。
    * 如果value是None,session会依赖全局session失效策略。

标签: python Django

评论(0) 浏览(564)

http请求参数之Query String Parameters、Form Data、Request Payload

2019-10-24 张宇童 学习日志

在与server端进行数据传递时,通常会用到GET、POST方法进行参数提交,而参数提交的方式,通常取决于server端对数据的接收方式。
Query String Parameters
当发起一次GET请求时,参数会以url string的形式进行传递。即?后的字符串则为其请求参数,并以&amp;作为分隔符。

如下http请求报文头:


// General

Request URL: http://foo.com?x=1&amp;y=2 Request Method: GET 
// Query String Parameters
x=1&amp;y=2


Form Data

当发起一次POST请求时,若未指定content-type,则默认content-type为application/x-www-form-urlencoded。即参数会以Form Data的形式进行传递,不会显式出现在请求url中。

如下http请求报头:
// General
Request URL: http://foo.com Request Method: POST 
// Request Headers
content-type: application/x-www-form-urlencoded; charset=UTF-8 
// Form Data
x=1&amp;y=2 
Request Payload
当发起一次POST请求时,若content-type为application/json,则参数会以Request Payload的形式进行传递(显然的,数据格式为JSON),不会显式出现在请求url中。
如下http请求报头:
// General
Request URL: http://foo.com Request Method: POST 
// Request Headers
content-type: application/json; charset=UTF-8 
// Request Payload
x=1&amp;y=2 
如果希望通过Form Data的方式来传递数据,则可以通过原生方法formData()来进行数据组装,且content-type需要设置为multipart/form-data。
如下http请求报头:
// General
Request URL: http://foo.com Request Method: POST 
// Request Headers
content-type: multipart/form-data; charset=UTF-8 
// Request Payload
------WebKitFormBoundaryAIpmgzV8Ohi99ImM
Content-Disposition: form-data; name=“x” 
------WebKitFormBoundaryAIpmgzV8Ohi99ImM
Content-Disposition: form-data; name=“y” 
------WebKitFormBoundaryAIpmgzV8Ohi99ImM–
其中,WebKitFormBoundaryAIpmgzV8Ohi99ImM为浏览器随机生成的boundary,作为分隔参数,作用等同于&amp;。
application/x-www-form-urlencoded 和 multipart/form-data
The content type "application/x-www-form-urlencoded" is inefficient for sending large quantities of binary data or text containing non-ASCII characters. The content type "multipart/form-data" should be used for submitting forms that contain files, non-ASCII data, and binary data.
multipart/form-data的优势还伴随一些兼容性问题,详细请参考文章结束的参考文献。

标签: javascript request ajax

评论(0) 浏览(841)

Powered by emlog