JavaScript小细节点罗列

众所周知,JavaScript为属性的访问定义了两种语法方式:

表达式.标识符 // 表达式(指定对象)    标识符(指定需要访问的属性的名称)
表达式1(指定对象)  

var O = {a:1,b:{c:3}}
var A = [O,4,[5,6,7]]

O.a //1
O.b.c //3
O["a"] //1
A[1] //4
A[0].b.c //3
A[2]["2"] //7

第一种方法我们使用点"."来进行属性的访问,第二种则是使用方括号来进行属性访问。其实如上我们就可以轻松发现两种方法的区别,第二种方法的方括号内也是一个表达式。

但是这两种方法的第一个表达式都是先进行计算的,如果计算结果是空或者未定义那么就会抛出错误,如果运算结果不是对象或者数组,JS会将其转化为对象(例如下面代码块的字符串)。

var str = "Hello World!";var world = s.substring(s.indexOf(" ")+1, s.length)

如果运算结果不是对象或者数组,JS会将其转化为对象=》有些人会奇怪,字符串不是对象,为什么它还具有属性?这是因为我们在进行属性访问的时候,JS就会将字符串调用 new String(str) 来转换成对象,而提供这个方法新创建的对象自然就继承(关于对象的继承可以查阅相关资料)了字符串的方法并且用来处理属性的引用。一旦属性引用结束了,这个新创建的对象就会被销毁。当然我这里只写了字符串的一个demo,数字布尔值也类似通过Number(),Boolean()构造函数来进行对象创建。

回到属性访问表达式,如果表达式后跟随"."和标识符,就会查找这个标识符所指定的属性的值没并将其作为整个表达式返回的值。如果对象表达式跟随一堆方括号,则会计算方括号内的表达式的值并将其转化为字符串,当然这两方法种如果访问的属性是不存在的。会返回undefine。

我们可以看出,使用"."+标识符的写法更加简单,并且我们有时候习惯了链式调用的时候更加喜欢".",但是,需要注意的是,这种方式下,我们要访问的属性名必须是合法的。如果我们进行访问的属性名称是一个保留字,或者包含空格,或者是一个数字,或者是通过表达式计算得出的值,这时候的属性访问必须要使用方括号。

delete运算符

delete是一元运算符,我们可以使用它来删除对象属性或者数组元素。

delete希望他的操作数是一个左值,如果我们误用使得他的操作数不是一个左值,那么delete就不会进行任何操作并且返回true,当然并不是所有属性都是能够删除的,用户var声明的变量,自定义函数,函数参数,内置核心属性等是不能给删除的,删除非法会抛出错误。

这里插入补充下左值:所谓左值,简单点说就是可以被赋值的表达式,在ES规范中是用内部类型引用(Reference)描述的,其作用为存放数据空间,且存放是允许的。比如这里的属性访问表达式。

虽然delete运算符可以删除对象的属性,但是我们要知道,delete其实只是断开了属性和宿主对象的联系,而不会操作属性中的属性。而且delete运算符只能删除自有属性,不能删除继承属性。

a = { b:{c:1} };
d = a.b;delete a.b;
console.log(d.c) //结果仍旧是1,可以看出delete其实只是断开可属性和宿主对象的联系并没有将其销毁

o = {a:1};delete o.a; //删除属性a并返回truedelete o.x; //因为a属性不存在,什么都不做并返回truedelete o.toString; //因为toString是继承来的,什么都不做并返回truedelete 110; //没有意义,返回truedelete Object.prototype; //返回falsevar b = 1;delete this.b; //返回falsefunction f(){};delete this.f; //返回false

逻辑运算符

运算符 示例 说明
逻辑与 (&&) expr1&&expr2 如果expr1 能转换成false则返回expr1,否则返回expr2. 因此, 在Boolean环境中使用时, 两个操作结果都为true时返回true,否则返回false.
逻辑或 (||) expr1||expr2 如果expr1能转换成true则返回expr1,否则返回expr2. 因此,在boolean环境(在if的条件判断中)中使用时, 二者操作结果中只要有一个为true,返回true;二者操作结果都为false时返回false.
逻辑非(!) !expr 如果单个表达式能转换为true的话返回false,否则返回true.

在JS计算逻辑中我们在使用逻辑运算符会有一个短路原理。如下

var e = a && 1; //1
var f = b && 1; //false

上面代码块的变量c赋值时,a和1都是真,但是因为js的短路原理,在逻辑或中只要排在前面的a为真,那么后面的1就会直接忽略,排在前面的操作数为假才会计算到后面的操作数。同理在使用逻辑与时,只要排在前面的操作数是为假,那么js就会直接忽略后面的操作数而让运算结果直接为false,如果前面的操作数为真,就会继续计算后面的操作数,最后如果后面操作数为真,赋值的才是后面的操作数。

var a = 真1 || 真2 //真1var b = 假 || 真3 //真3var c = 真4 && 真5 //真5var d = 假 && 真6 //假
时间: 2024-08-21 21:56:28

JavaScript小细节点罗列的相关文章

css小细节罗列

有空时候把一些常见可能不是每个人都知道的css小细节总结了下,共勉. 1.line-height 众多周知,line-height是行高的意思,我们时常会使用类似line-height:24px;这样的代码来设置绝对的行高.但是当我们的需求改变,字体大小变动的时候,可能我们还需要再次改动行高,那么现在我们可以使用直接设置数字来设置行高,当我们使用纯数字来设置行高的时候,它相对于的是字体大小的倍数,也就是说下面的h4其实设置的行高也是12*2px就是24px.这样设置的好处是当我们在改变字体大小的

Vue.js 和 MVVM 小细节

Vue.js 和 MVVM 小细节 MVVM 是Model-View-ViewModel 的缩写,它是一种基于前端开发的架构模式,其核心是提供对View 和 ViewModel 的双向数据绑定,这使得ViewModel 的状态改变可以自动传递给 View,即所谓的数据双向绑定. Vue.js 是一个提供了 MVVM 风格的双向数据绑定的 Javascript 库,专注于View 层.它的核心是 MVVM 中的 VM,也就是 ViewModel. ViewModel负责连接 View 和 Mode

php课程---Json格式规范需要注意的小细节

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式. 易于人阅读和编写.同时也易于机器解析和生成. 它基于JavaScript Programming Language, Standard ECMA-262 3rd Edition - December 1999的一个子集. JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯(包括C, C++, C#, Java, JavaScript, Perl, Python等). 这些特性使J

apache配置虚拟主机时需要注意到几个小细节

如今apache在web服务器这块市场占有率还是很高的,而配置虚拟主机现在也是用的非常多,不过在配置虚拟主机的时候一定要注意几个小细节. 首先要注意你的apache版本,注意是2.2还是2.4的. 配置2.2的时候,配置虚拟主机该这样写: NameVirtualHost ip:80   //注意此处与2.4不同 <VirtualHost ip:80> ServerName www1.myweb.com DocumentRoot "/myweb/vhost/www1" <

关于if语句中的小细节

if语句都会用,但是有一些小细节并不容易被发现. 比如我们不应该写这样的代码: if(flag==0) flag为布尔变量,布尔变量的值为真或假,用0表示假,真是多少是不一样的. 所以我们应该避免将布尔变量与0或1这样的整型值进行比较. 那么我们也不应该写这样的代码: if(i) i为一个整型变量,但是写成上面那样就会被人误以为是布尔值,良好的编程习惯是这样的: if(i==0)或if(i!=0) 还有重要的一点是,我们不能将float型和double型数据与0这种整型变量进行==或!=. 因为

强壮你的C和C++代码30个小细节

1 初始化局部变量 使用未初始化的局部变量是引起程序崩溃的一个比较普遍的原因, 2 初始化WINAPI 结构体 许多Windows API都接受或则返回一些结构体参数,结构体如果没有正确的初始化,也很有可能引起程序崩溃.大部分Windows API结构体都必须有一个cbSIze参数,这个参数必须设置为这个结构体的大小. 注意:千万不要用ZeroMemory和memset去初始化那些包括结构体对象的结构体,这样很容易破坏其内部结构体,从而导致程序崩溃. 3 检测函数输入参数有效性 在函数设计的时候

注意编码工作中的小细节

人们常说"细节决定成败". 编码工作中,同样需要关注细节. 本文将给出3个小实例来说明编码中关注细节的重要性,同时给出作者对如何注意编码细节的一点见解(说的不对,请指正). 例1 这个问题如此地显而易见,竟然没有被发现. List<int> numList = new List<int>(); numList.Add(3); numList.Add(1); numList.Add(4); numList.Add(2); numList.Add(5); numLi

python isinstance 判断各种类型的小细节

1. 基本语法 isinstance(object, classinfo) Return true if the object argument is an instance of the classinfo argument, or of a (direct, indirect or virtual) subclass thereof. Also return true if classinfo is a type object (new-style class) and object is

[小细节,大BUG]记录一些小问题引起的大BUG(长期更新....)

[小细节,大BUG]  1. 在不久前,一个朋友出现了这样一个BUG:当UITableView加载cell的时候,自定义的cell,怎么显示,里面的文字总是显示不完全(注意,文字不长).然后,我帮忙给看了下,甚至把在storyBoard中将cell的相关属性都试了下,虽然可以解决,但是效果不理想.最终经过排查,终于发现问题所在:当自定义cell时,因为需要布局子控件,所以他重写了layoutSubviews方法,然而在此方法中没有调用[super layoutSubviews],所以造成了布局混