20170709 笔记

属性操作的两种方式

1、"." oDiv.style.background window.console.log()
+ []的写法: oDiv["style"]["background"]
2、[]
+ 数字不能用点,只能用[ ]; 变量必须用[ ];
+ 所有"."能操作的属性,都能用[]来写;

=

  • "=" 等号是用来赋值的
  • "==" 双等用来比较的,他是非严格比较
    • 非严格比较:只比较结果,不比较数据类型 比如 "2"==2 true
  • "===" 三等用来比较的,他是严格比较
    • 严格比较:即比较结果,也比较数据类型 比如 "2" == 2 false

请实现左边宽度固定为200,右边宽度自适应; 最少用三种

  • 思路1:左边浮动,右边margin-left

  • 思路2:绝对定位
    *{
    margin: 0;
    padding: 0;
    }
    body{
    overflow: hidden;
    }
    .container div{
    position: absolute;
    left: 0;
    top: 0;
    font-size: 30px;
    }
    .left{
    width: 200px;
    height: 400px;
    background: #ff0000;
    word-break: break-all;
    }
    .right{
    width: 100%;
    height: 400px;
    background: #ff00ff;
    margin-left: 200px;
    word-break: break-all;
    }

  • 思路3 :绝对定位
    *{
    margin: 0;
    padding: 0;
    }
    body{
    overflow: hidden;
    }
    .container div{
    position: absolute;
    height: 400px;
    word-break: break-all;
    top: 0;
    font-size: 30px;
    }
    .left{
    width: 200px;
    left: 0;
    background: #ff0000;
    }
    .right{
    background: #ff00ff;
    left: 200px;
    }

  • 思路4 :flex布局
    *{
    margin: 0;
    padding: 0;
    }
    body{
    overflow: hidden;
    font-size: 50px;
    }
    .container{
    display: flex;
    flex-direction:row;
    }
    .left{
    width: 200px;
    height: 400px;
    background: #f00;
    }
    .right{
    width: 100%;
    height: 400px;
    background: #ffff00;
    }

出现省略号的样式

white-space: nowrap;  不折行
text-overflow: ellipsis;   当文本溢出的时候,以什么形式来展示,ellipsis代表省略号
overflow: hidden;  内容溢出隐藏

switch的坑

  • 注意:switch是严格比较

数据类型

  • 数据类型的判断 type of
  • 数据类型包含:
    • 基本数据类型:string ,number ,boolean,null,undefined
    • 引用数据类型:
      • 对象数据类型:object array Date RegExp
      • 函数数据类型: function
  • null和undefined
    • null代表的是现在没有,以后会有
      var data=null;
      只有等到请求结束的时候,才能给data赋值; data=[{},{}....]
      
      
    • undefined 代表现在没有,以后也没有
      • 函数没有返回值
        • 没写return
        • 写了return但没有返回值
      • 对象的某个属性不存在的时候,我们拿到的值就是undefined;
      • 定义了形参,但没有赋值;
  • 对象object {}
    • 语法{k:v,k:v}
    • 对象的遍历,用 for..in
    for(var attr in obj){
        attr -> 属性名
        obj[attr] -> 属性值
    }
    
    • 对象的增删改查
      • 增 obj.xxx=xxxx;
      • 改 obj.xxx=xxxxx; 区别,如果属性名不存在,属于增加,如果属性名存在,属于更改;
      • 查 obj.xxx
      • 删除
        • 真删除
          delete obj.xxx
        • 假删除
          obj.xxx=null;
    • 数组的语法:[x,x,x,x]
    • 数组的循环:
      • for循环 常用!!!!
      • for...in 循环
    • 数组的增删改查
      • 增加 ary[x]=xxxx;
      • 更改 ary[x]=xxxx;
      • 查:通过数组的索引进行查找 ary[x]
      • 删除:通过delete不能删除,只能通过数组常用的方法来删除
        • splice
          • 如果是两个参数 代表删除
          • 如果是三个参数,且第二个参数为0 ,插入
          • 如果是三个参数,且第二个参数不为0, 替换
  • 运算符:
    • "+" 具备两个功能:
      • 字符串拼接 优先
      • 运算

运算符

  • 算术运算符: + - * / %
    • %的小技巧:有几种情况就%几;
    • 除了+法,其他几个都有隐式数据类型转换的功能
  • 比较运算符: > < >= <= == === != !==
  • 逻辑运算符: && || !
    • 常用&&代替if
    bOk && alert('真真');
    
    • 常用||代替else
    bOk || alert('假假');
    
  • 赋值运算符: + - += -= *= /= %=
  • 运算符的优先级 算术> 比较 > 逻辑 > 赋值

数字 number

  • 常用的方法 toFixed(保留几位小数) 可以四舍五入的保留小数
  • 字符串转数字的方法中,有一个严格转换,两个非严格转换
    • 一个严格:Number()
    • 两个非严格:
      • parseInt() 整数
      • parseFloat() 保存小数
  • 布尔值转数字: true-》1 false-》0
  • 对象也能转数字: []->toString()转成""字符串 -》 把""字符串通过Number() 转成0

什么是真?什么是假?

  • 除了这几个为假的,其他都是真:
    • false "" 0 NaN null undefined

== 数据类型之间的比较

1)对象和对象比较,按照地址进行比较 [] == [] 引用数据类型,是对地址的比较
2)对象和布尔值进行比较,按照数字进行比较 []==![]
3)对象和字符串进行比较,转成数字 []==""

  1. 对象和数字进行比较,转成数字 []==0
  2. 字符串和数字进行比较,转成数字 ""==0
  3. 字符串和布尔值进行比较,转成数字 ""==false
  4. 数字和布尔值进行比较 1==true false==0
  5. null==undefined true; null===undefined false
  6. NaN==NaN NaN跟谁都不相等,包括他自己
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,590评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 86,808评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,151评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,779评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,773评论 5 367
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,656评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,022评论 3 398
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,678评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 41,038评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,659评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,756评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,411评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,005评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,973评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,203评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,053评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,495评论 2 343

推荐阅读更多精彩内容

  • 标签: 我的笔记 ---学习资料:http://javascript.ruanyifeng.com/ 1. 导论 ...
    暗夜的怒吼阅读 792评论 0 1
  • 1. Java基础部分 基础部分的顺序:基本语法,类相关的语法,内部类的语法,继承相关的语法,异常的语法,线程的语...
    子非鱼_t_阅读 31,571评论 18 399
  • 贴吧上看到了帖子加的我微信、只能说比较有缘分吧、哈、性格很好的一个小伙子、问他叫什么、告诉我佛山张学友、之后我就以...
    丶乔妹er阅读 233评论 0 1
  • 《抗压力》作者按:为什么同样是才华横溢的商业精英,有人能攀上事业高峰,有人却折戟而归?你是否曾经陷入害怕失败,逃避...
    木子求阅读 1,331评论 0 3