Array 及 Object 的宣告, 及新增元素, 取得元素值處理

 目的: Array 及  Object 的宣告, 及新增元素 取值處理

處理說明:  1>Array  及 Object 的宣告
                       var Tmp_Ary=[];      //宣告 Array   

                       var Tmp_Obj={};     //宣告 Object

                   2>Array 及 Object 設定值

                       var Tmp_len=0;

                       for (var i=1; i<=5;i++)

                       { 

                           Tmp_len=Tmp_Ary.push(i) //傳回目前 Tmp_Ary.length

                           //Tmp_Ary[Tmp_len-1]=整數,並非Object ,所以無法設定property(newSet)

                           Tmp_Ary[Tmp_len - 1].newSet = i;    //undefined

                        } 

                       

                        Tmp_Obj = {

                             name: "蔡聰進",

                             gender: "男",

                        };             

                        Tmp_Obj.newSet=1;  //新增  Object 的屬性,直接 Assing 即可　

                        Tmp_len=Tmp_Ary.push(Tmp_Obj) ;

                        //Tmp_Ary[Tmp_len-1] 為 Object ,所以可以設定 property(newSet2) , 取值也會正常

                        Tmp_Ary[Tmp_len-1].newSet2=2;  

                   3>Array 及 Object 取值 

                       var Tmp_Ary=[1,2,3,4,5] ;

                       var  Tmp_Obj={

                               name: "蔡聰進",

                               gender: "男",

                               newSet: 1,

                               }

                      var Tmp_Str="";

                       //取得  Array 元素值_1  for 

                      for (var i=0; i<=Tmp_Ary.length-1;i++)

                     { 

                         Tmp_Str="Tmp_Ary[i]="+Tmp_Ary[i];

                        console.log(Tmp_Str) ;

                      }

                      //取得  Object property值  for 

                     for (var prop in Tmp_Obj)

                     {

                        Tmp_Str="Tmp_Obj["+prop +"]="+Tmp_Obj[prop];

                        console.log(Tmp_Str) ;

                      }

                      //取得  Array元素值_2  Ext.each

                      Ext.each(Tmp_Ary, functon(item,index){

                        Tmp_Str="Tmp_Ary["+index+"]="+item;

                        console.log(Tmp_Str) ;

                      });

實際案例:

                    var Tmp_Ary = [];

                    var Tmp_Obj = {};

                    var cur_recs = Ext.getCmp('grid_Single').getView().getSelectionModel().getSelection();

                    var cur_rec;

                    if (cur_recs.length > 0) {

                        cur_rec = cur_recs[0];

                        Tmp_Ary.push(cur_rec);

                        cur_rec.newSet = 0;

                    }

                    console.log("cur_rec.newSet:", cur_rec.newSet);

            console.log("Tmp_Ary[Tmp_Ary.length-1].newSet:", Tmp_Ary[Tmp_Ary.length - 1].newSet);

                    console.log("0 Tmp_Ary.length:", Tmp_Ary.length);

                    //mysuccessalert("cur_rec.newSet:" + cur_rec.newSet.toString());                    

                    var Tmp_len;

                    var Tmp_Str = "";

                   //0.5

                    for (var i = 1; i <= 5; i++) {                     

                        Tmp_len = Tmp_Ary.push(i);

                        console.log("0.5 Tmp_len:", Tmp_len);

                        Tmp_Ary[Tmp_len - 1].newSet = i;

                        //因 Tmp_Ary[Tmp_len - 1]=整數,非 Object , 所以,newSet undefined

                        console.log("0.5  Tmp_Ary[Tmp_len - 1].newSet:", Tmp_Ary[Tmp_len - 1].newSet);

                    }

                    for (var i = 1; i <= 5; i++) {

                        var Tmp_Obj1 = {};

                        Tmp_Obj1.value = i;

                        Tmp_len = Tmp_Ary.push(Tmp_Obj1);

                        console.log("1 Tmp_len:", Tmp_len);

                        //因 Tmp_Ary[Tmp_len - 1]= Object , 所以,newSet 可存值

                        Tmp_Ary[Tmp_len - 1].newSet = i;    

                        console.log("1  Tmp_Ary[Tmp_len - 1].newSet:", Tmp_Ary[Tmp_len - 1].newSet);

                    }

                    console.log("1 Tmp_Ary.length:", Tmp_Ary.length);

     

                    //1.5

                    //item 為 Array 元素

                    Ext.each(Tmp_Ary,

                        function (item, index) {

                            console.log("1.5 index:", index);

                            Tmp_Str = " 1.5  Tmp_Ary[index]=" + Tmp_Ary[index];

                            console.log(Tmp_Str);

                            Tmp_Str = " 1.5  Tmp_Ary[index].newSet=" + Tmp_Ary[index].newSet;

                            console.log(Tmp_Str);

                    )  

 

                    //1.8     

                    for (var index in Tmp_Ary) {

                        Tmp_Str = " 1.8  index=" + index;

                        console.log(Tmp_Str);

                        Tmp_Str = " 1.8  Tmp_Ary[index].newSet=" + Tmp_Ary[index].newSet;

                        console.log(Tmp_Str);

                    }

                    

                    //1.9  

                    Tmp_Str = " 1.9  Tmp_Ary.length=" + Tmp_Ary.length;

                    console.log(Tmp_Str);                     

                    for (var index = 0; index < Tmp_Ary.length ; index++) {

                        Tmp_Str = " 1.9  index: " + index;

                        console.log(Tmp_Str);

                        Tmp_Str = " 1.9  Tmp_Ary[index].newSet=" + Tmp_Ary[index].newSet;

                        console.log(Tmp_Str);

                    }

                    Tmp_Obj = {

                        name: "蔡聰進",

                        gender: "男",

                    };                 

                    Tmp_Obj.newSet = 1;

                    //2  

                    for (var item in Tmp_Obj) {

                        Tmp_Str = "2 Tmp_Obj[" + item + "] is " + Tmp_Obj[item];

                        console.log(Tmp_Str);

                    }

輸出結果:

0 Tmp_Ary.length: 1

0.5 Tmp_len: 2

0.5  Tmp_Ary[Tmp_len - 1].newSet: undefined

0.5 Tmp_len: 3

0.5  Tmp_Ary[Tmp_len - 1].newSet: undefined

0.5 Tmp_len: 4

0.5 Tmp_Ary[Tmp_len - 1].newSet: undefined

0.5 Tmp_len: 5

0.5  Tmp_Ary[Tmp_len - 1].newSet: undefined

0.5 Tmp_len: 6

0.5  Tmp_Ary[Tmp_len - 1].newSet: undefined

1 Tmp_len: 7

1  Tmp_Ary[Tmp_len - 1].newSet: 1

1 Tmp_len: 8

1  Tmp_Ary[Tmp_len - 1].newSet: 2

1 Tmp_len: 9

1  Tmp_Ary[Tmp_len - 1].newSet: 3

1 Tmp_len: 10

1  Tmp_Ary[Tmp_len - 1].newSet: 4

1 Tmp_len: 11

1  Tmp_Ary[Tmp_len - 1].newSet: 5

1 Tmp_Ary.length: 11

1.5 index: 0

1.5  Tmp_Ary[index]=[object Object]

1.5  Tmp_Ary[index].newSet=0

1.5 index: 1

1.5  Tmp_Ary[index]=1

1.5  Tmp_Ary[index].newSet=undefined

1.5 index: 2

1.5  Tmp_Ary[index]=2

1.5  Tmp_Ary[index].newSet=undefined

1.5 index: 3

1.5  Tmp_Ary[index]=3

1.5  Tmp_Ary[index].newSet=undefined

1.5 index: 4

1.5  Tmp_Ary[index]=4

1.5  Tmp_Ary[index].newSet=undefined

1.5 index: 5

1.5  Tmp_Ary[index]=5

1.5  Tmp_Ary[index].newSet=undefined

1.5 index: 6

1.5  Tmp_Ary[index]=[object Object]

1.5  Tmp_Ary[index].newSet=1

1.5 index: 7

1.5  Tmp_Ary[index]=[object Object]

1.5  Tmp_Ary[index].newSet=2

1.5 index: 8

1.5  Tmp_Ary[index]=[object Object]

1.5  Tmp_Ary[index].newSet=3

1.5 index: 9

1.5  Tmp_Ary[index]=[object Object]

1.5  Tmp_Ary[index].newSet=4

1.5 index: 10

1.5  Tmp_Ary[index]=[object Object]

1.5  Tmp_Ary[index].newSet=5

1.8  index=0

1.8  Tmp_Ary[index].newSet=0

1.8  index=1

1.8  Tmp_Ary[index].newSet=undefined

1.8  index=2

1.8  Tmp_Ary[index].newSet=undefined

1.8  index=3

1.8  Tmp_Ary[index].newSet=undefined

1.8  index=4

1.8  Tmp_Ary[index].newSet=undefined

1.8  index=5

1.8  Tmp_Ary[index].newSet=undefined

1.8  index=6

1.8  Tmp_Ary[index].newSet=1

1.8  index=7

1.8  Tmp_Ary[index].newSet=2

1.8  index=8

1.8  Tmp_Ary[index].newSet=3

1.8  index=9

1.8  Tmp_Ary[index].newSet=4

1.8  index=10

1.8  Tmp_Ary[index].newSet=5

1.9  Tmp_Ary.length=11

1.9  index: 0

1.9  Tmp_Ary[index].newSet=0

1.9  index: 1

1.9  Tmp_Ary[index].newSet=undefined

1.9  index: 2

1.9  Tmp_Ary[index].newSet=undefined

1.9  index: 3

1.9  Tmp_Ary[index].newSet=undefined

1.9  index: 4

1.9  Tmp_Ary[index].newSet=undefined

1.9  index: 5

1.9  Tmp_Ary[index].newSet=undefined

1.9  index: 6

1.9  Tmp_Ary[index].newSet=1

1.9  index: 7

1.9  Tmp_Ary[index].newSet=2

1.9  index: 8

1.9  Tmp_Ary[index].newSet=3

1.9  index: 9

1.9  Tmp_Ary[index].newSet=4

1.9  index: 10

1.9  Tmp_Ary[index].newSet=5

2 Tmp_Obj[name] is 蔡聰進

2 Tmp_Obj[gender] is 男

2 Tmp_Obj[newSet] is 1

JS - - Object,Array的宣告 , Object 基本型別 及 物件型別 - Object 的建立 - 屬性的存取 - typeof 型別的判斷 - == ===

JavaScript 內建的型別主要可以分成基本型別 (Primitives) 與物件型別 (Object) 兩大類。 

基本型別又分成 string、number、boolean、null、undefined 幾種，
除了以上幾種之外，其他都可以歸類至物件型別 (Object)

一.物件的定義 - Object :

「An object is a collection of properties and has a single prototype object.」

一個物件可以是個零至多種屬性的集合，而屬性是鍵 (key) 與值 (value) 之間的關聯。 

一個屬性的「值」可以是某個基本型別，也可以是另一個物件，甚至可以是一個函數。
物件可以是瀏覽器預先定義好的，當然也可以是由自己定義物件的屬性與內容

1>Object 的宣告方式:

var person={}                                 //或是  var person=new Object();

person["NAME"]="蔡聰進";

person["GENDER"]="male";

2>Array的宣告方式:

var tempData=[];

tempData.push(rec);

1>建立 Object 的2種方法如下:

方法1> new Object() 方式,建立物件 , 再設定物件屬性

var person = new Object(); 

person.name = 'Kuro'; 

person.job = 'Front-end developer'; 

person.sayName = function() { alert( this.name ); };

方法2>  JSON 方式 , 建立物件

var person = { 

       name: 'Kuro', 

       job: 'Front-end developer', 

       sayName: function() { alert( this.name ); } 

};

 -->

直接用大括號 { }，即可建立起一個新的物件，並且在建立物件的同時直接指定屬性至該物件內。
這種建立物件的方式稱為「物件實字 (Object literal)」，同時也是 JSON 格式的核心語法。

二.屬性的存取 , 建議用   Object["Name"]

存取屬性 的2種方法如下:

var person = { 

      name: 'Kuro', 

      job: 'Front-end developer', 

      sayName: function() { alert( this.name ); } ,

      "001" : "Hello",

}; 

1>由.Name存取

person.name;                   // 'Kuro' 

person.sayName();         // ƒ sayName()

person.001;                   // SyntaxError: Unexpected number 

2>由 [Name]存取
person["name"];             // 'Kuro' 

person["sayName"];      // ƒ sayName()

person["001"]              // Hello 

--> 屬性的新增及刪除

person["age"]=50;
console.log("person[age]]",person["age"]);  //50
delete person["age"];
console.log("person[age]]",person["age"]);  //undefined

--> 判斷屬性是否存在

方法1:  ==undefined

if (person["age"]!=undefined){

    console.log("property age exist");

}

方法2:  (age in person)  , true/false

if (age in person){

    console.log("property age exist");

}

方法3: person.hasOwnProperty('age')

if (person.hasOwnProperty('age')) {

    console.log("property age exist");

}

-->

if (person["name"]!="undefined"){

    console.log("1 property name exist");

};

if ("name" in person){

    console.log("2 property name exist");

};

     if (person.hasOwnProperty('name')) {

    console.log("3 property name exist");

};

三.型別的判斷 - typeof  -  typeof 運算子回傳的東西都是「字串」

typeof true; // 'boolean' 

typeof 'Kuro'; // 'string' 

typeof 123; // 'number' 

typeof NaN; // 'number' 

typeof { }; // 'object' 

typeof [ ]; // 'object' Array

typeof undefined; // 'undefined' 

typeof window.alert; // 'function' 

typeof null; // 'object'

--> typeof   Array   --> 得到 "object" , 非 array

      由 Array.isarray([]) 判斷  //true

       Array.isarray( [4,"a","b","c"] );  //true

       Array.isarray("abc");   //false

四.==   ===  比較

var a = 10; 

var b = "10"; 

console.log( a == b ); // true 

console.log( a === b ); // false

console.log(null == undefined) ; //true

console.log(null === undefined) ; //false

-->

在 JavaScript 這門程式語言中，大家會提倡盡量使用 === 來取代 == 的原因。

-->

!= 的版本會做自動轉型，而 !== 則不會做自動轉型。